View profile

Class or Function Components in React?


Robin Wieruch - A Developer's Newsletter

June 4 · Issue #22 · View online

Hello, it's Robin. I am the author of books such as The Road to React and much more content about JavaScript and its ecosystem.

This is my newsletter which delivers comprehensive tutorials, books, and courses straight to your inbox. Quality content only. Give it a chance and become a better developer every month.

Hey there. It’s Robin with your monthly digest of React and the JavaScript world. I am glad to see many people picking up this Newsletter to keep themselves up to date with the ecosystem. If you have any feedback for me – things you want to learn about, things you value about my content, or how often you like to read about new React related topics – just reply to this E-Mail. I would be happy to hear from you.
Before I go into the new tutorials, I wanted to let you know about my Patreon. I started it a while ago, but never really announced it. If my content has been valuable for you over the past years, or if you are still learning new things with my newsletters and tutorials, you can support my work on a monthly basis. It would mean very much to me to see you over there.

React Function Components with Hooks
React Hooks make it a breeze to work with React, don’t they? Finally we can use state and side-effects in function components. Therefore, I wrote a larger introduction to function components, because they will become the status quo in modern React applications. If you have implemented lots of class components before, this class to function component with hooks migration guide might be worth checking out. Another article might be for you if you are new to React and just need an overview about all the historically available component types. These three tutorials offer lots of content already to shift your mind to React Hooks and to get comfortable with function components.
SVG Icons as React Components
My last client had the idea to implement an icon library for their React application. That’s when I stepped in and helped them automating the whole process: from SVG files to React components. Also, if you just want to use SVGs conveniently in your own application, this process could help you to set up the pipeline.
However, if you just want to style your application, you should check out this styled components tutorial to encapsulate styling in React components. Styled components are my go-to when it comes to CSS in React.
Component Gotchas
If you are just starting out with React, there are a a few component gotchas that are worth to learn about. Every React application is a component tree. Whereas some components are highly specific and only used once, other components are more generic and thus reusable. Also, you may have heard about controlled components, but no one takes the time to explain them. Here’s where I stepped in. Last but not least, why do we need a component library like React in the first place? Check out my answer over here on Quora.
That’s it from me. Let me know whether you find the new content interesting and what you want to read about next. See you again! Best, Robin
Book Recommendation
I just finished Genius Foods by Max Lugavere. While reading the book, I already improved my eating habits by stocking my fridge with nutritious foods. Last week they offered blueberries at a local market and I bought 6kg of them. My girlfriend called me nuts, but I wanted to go all in. My family already gets slightly annoyed about all my ramblings about healthy fats. Anyway, I can recommend the book to anyone who wants to get into it.
Did you enjoy this issue?
In order to unsubscribe, click here.
If you were forwarded this newsletter and you like it, you can subscribe here.
Powered by Revue