Have you ever wanted to know some quick React tips to help you write a better code? You are on the right place. This two-part series will give you six of these React tips. These tips will cover a variety of topics. However, all will share the same goal, to help you write a better code and make your work easier and more enjoyable. Let’s begin.
6 Quick React Tips to Write A Better Code Part 2.
Keep your components small
Take a look at some of your React components. How big are they? How much code do they contain? Is it easy for someone new who never worked with your components before to understand the code? There is usually some chance that at least some of your components will be quite big. This is especially true if you are a beginner without more prior experience with React or programming.
You don’t have to feel bad if this is your case, if your current practice results in quite big components. Almost everyone does in the beginning. You should see some of the code I wrote when I started working with React. Back then my code was a disaster. Well, there is still a lot of polishing to do. However, I am working on it and making a decent progress.
Many of us have some experience with bloated code and big React components. This is not the ideal state one should aim for, rather the opposite. Your React components should be small. Don’t be afraid that this practice will result to having “too” many files. This is something I was worried about when I started with Atomic Design. Yes, you will end up with more files.
On the other hand, it will be much easier for you to work with and maintain your code, as well as whole projects. This is one of the easiest React tips you can learn about. It is also one of those React tips you can implement almost immediately and often with relative ease.
Let’s take a look at a simple example of a landing page. This page will contain header, hero, a number of small sections and footer. In the first version we will put everything in one file.
#react #javascript #design development #reactjs
