Today I will be going over :
- Share Logic Across Multiple React Components with Custom Hooks
- Advanced React Component Patterns
I have never used hooks before but I have heard some good things so it will be good to get a better insight into Hooks I will also be building a mock landing page whilst I corporate everything I have learnt yesterday and potentially utilise Formnik.
Updates:
What are hooks?
Before I could even dive in and try understand how to share logic across multiple R components I needed to understand what a React hook is and a hook is basically “a function that let us hook into the React state and lifecycle features from function components.” Which in turn allows us to easily manipulate state. Now the arguement of what is better to use is personal preference this article really points out the differences between the two. However I will stick with classess for now as it is something I am used too and I don’t find the boiler plate code an issue.
In turn whilst trying to learn about Hooks, I in turn learnt that react has a testing library! Despite not having learnt how to test, I understand it is important skill to learn as it will allow me a frontend developer to debug my code. This is definitely something I will consider learning in the future to ensure my code is in tip top shape!
React Component Patterns
I’ll be honest I had no idea what a React Component pattern was but sometimes with code you may be doing something the right way and have no idea. Everyone has their own way of writing out functional code and tweak it to their personal or professional preference but it was great to see that there are set patterns out there which can help a new developer like me. Enusres my code is written well and is clear but also that I can render and pass down props with ease!
React Component Patterns by Michael Chan React Design patterns Patterns