Skip to main content

15 tips to improve your development with React

· 8 min read
Bruno Carneiro
Bruno Carneiro
Fundador da @TautornTech

I have been working with React for many years and have gathered here some tips I picked up throughout my journey across various projects.

These are useful both for improving project development and for career growth.

1 - Learn JavaScript​

That's right — React is "just" a User Interface library and much of what you use day to day is, simply, JavaScript.

A lack of understanding of JavaScript can cause many problems when trying to understand React and its structure. Study JavaScript.

The use of imports, lists, iterations, and other methods are mandatory in day-to-day work. Not just for those who develop with React, but for any web application.

Here I have a list of JavaScript versions:
https://www.tautorn.com.br/docs/javascript/versions/introducao

2 - Study the React basics​

Understanding how React works is fundamental. But not just using it for the sake of it — you need to truly understand in depth how each feature works.

React is a fascinating library and is constantly evolving. Understanding hooks, lifecycle, Virtual DOM, and other features are essential to getting the most out of the library and, consequently, applying it in the best way in systems and applications.

In many cases, simply not understanding how re-rendering works can lead to unnecessary resource usage in the application.

I have a React learning path on my site:
https://www.tautorn.com.br/docs/react/introducao

3 - Try to understand the business you work in as best as possible​

Whether you enjoy programming or not, it is extremely important to be aligned with the business of the company you work for or provide services to, whether it is yours or not.

Software development is something magical, but it is pointless to use the best technologies and architectures if there is no real value delivered to users.

I have worked on many systems — some very well structured and others not so much. The biggest lesson I took from all of them is that delivering value is more important than "clean" code. Focus on that; understanding the business you are working in is essential. This is often more important than writing countless lines of code.

Of course, in order to make better decisions about development, understanding the company's business is essential.

Study, learn, and use the system you build.

4 - Learn skills beyond the technical ones​

What I mean here is that mastering technical skills is paramount. But to grow in your career, it is essential to develop skills like negotiation, public speaking, idea communication, and interpersonal communication.

There are many others, but I list these as fundamental because, regardless of your role, you will need to convey your ideas — and I have seen many people cause confusion or fail to pass on their contributions simply because they did not know how to communicate.

These skills are not easy to learn, but they are very important.

5 - Understand the development layers of the project​

Do not isolate yourself in one part of the system. I am a FE developer and, because of that, I will only learn the parts of the system that relate to the interface. This works for a while, but it can leave you with very shallow knowledge. You do not need to master backend languages, infrastructure, etc., but it is essential to know how your code gets to production and how that affects users.

APIs are generally built to serve the FE, so a lot of synergy is needed between teams to offer the best experience to users. This will only happen if there is no isolation in the work.

6 - Keep components simple​

This is fundamental for scaling any project with React: keep components "simple."

Avoid components that have several coupled rules and do many different things; single responsibility is the key to creating a good component. Remember that other people will use what you are creating, and even you yourself may get lost with components that have too many responsibilities.

Simplicity is the key.

Here I talk about dumb and smart components:
https://www.tautorn.com.br/docs/react/dumb-e-smart-components

7 - Read the tool documentation​

This tip may seem obvious, but many people do not read the documentation of the tools they use, or when they do, it is in a very superficial way.

Understanding how each library works in the project is fundamental.
Just as I already mentioned understanding React in depth, the same applies to everything that will be used in projects.

I have seen many libraries added to projects without need, and even being used in a very superficial way.

Follow websites, GitHub repos, and people who talk about what you use. This can make all the difference to your development.

8 - Practice a lot​

You will not learn to swim by reading a book about swimming.

Theory is very important, but software development demands a lot of practice, and the best way to learn technologies is by creating small projects to apply what you have read.

This is, without a doubt, one of the fastest ways to learn a programming language, tool, or anything else about technology. Practice a lot.

Read something and then immediately create small projects or run small code snippets so your brain can more easily retain what you just read.

It is very easy to forget something we just read, and practicing will take you to another level because it greatly facilitates understanding.

9 - Use frameworks only when necessary​

Plain React is generally the best scenario.

Frameworks like NextJS, Remix, and others can be great, but only start projects with them if it is relevant and you need the features they provide. React alone will usually be enough.

10 - Do not start a project with state management​

Redux, Zustand, Easy Peasy, and other state management tools should only be added to a project if truly necessary. They add significant complexity to the project, and in most cases you do not need state management right from the start.

Only add it to the project if it is truly necessary. Keep things simple.

11 - Make mistakes​

That's right — make mistakes. Test, learn, do not be afraid of failing.

But do not just make mistakes for the sake of it — learn from them. This is a learning opportunity you should embrace, and it is very important for your growth. Analyze the reason for the mistake, do not hide anything, and do not get stuck on it. Share with others too.

The goal of learning from mistakes is to avoid them in the future.

12 - Learn to solve problems​

As much as we love programming and doing things in the best way possible, many times we will need simple and quick solutions for a particular problem or validation.

Do not get stuck on the code — add value to the business and understand that you are there to solve problems.

13 - Keep your component logic in the same place​

Separating the application into many layers might seem like a good idea, but depending on how it is done, it can spread logic across many folders and cause confusion.

Whenever possible, keep the logic and resources in the same place where you use them.

pages/  
   Wallet/  
      utils.tsx  
      ConnectionBridge.tsx  
      ComponentWallet.tsx
      index.tsx

14 - Keep projects lean​

Many times a new library is not necessary. Vanilla JavaScript is already enough for many things, and this prevents you from installing a ton of unnecessary libraries.

But of course, avoid reinventing the wheel.

Do not create a routing system for your project — that will only cause problems.

15 - Join communities​

This, without a doubt, has one of the biggest impacts on someone's career.

Being close to communities, in person or online, can help you a great deal in your growth. The exchange of knowledge and experiences in software communities is incredible, and if you have the opportunity to participate in one, do it.

I was once a Developer Circle Lead and it was one of the best moments of my career. I was able to share a lot of knowledge, but what I received in return was even greater. You end up meeting many incredible people and, without a doubt, their stories can positively impact your life and the way you see things.