Beginning with Reactjs

Robson Andrade
Passei Direto Product and Engineering
3 min readMay 1, 2020

This is a story about how I start to know something about Reactjs.

Introduction

In the past three years, I have been focused at improve myself skills related to infrastructure, I’ve been learned lots of things about AWS, Docker, Jenkins, and so on. It was a great time where I grew a lot, but it had a price, in my case, it was to stay out of application development, that was been my main role during all my career until now.

Because of that I didn’t see some frameworks, and this kind of stuff, growth during this period. Now I defined that it is the time to change and to be up to date again.

Why React?

When I choose to study Reactjs, I already was familiar with Nodejs and I wanted to know technologies that could help me to develop the most complete application possible. In this context the proximity of Reactjs and React Native that make it possible to develop frontend applications to the web, Android, and IOS with a pretty similar code make me happy.

The tutorial

My start point wast this tutorial https://reactjs.org/tutorial/tutorial.html, I make the application proposed on the tutorial and I was really surprised how it passes so many concepts writing a small app. I did it in two days and send it to Github, if you want, you can see it here: https://github.com/RobsonAndraDev/react-tutorial. Put it on git was just to have a history, I didn’t do any change on the app that wasn’t on the tutorial.

My project

When I understand the Reactjs main concepts, I started to write my app. My go writing this was to fix the knowledge and to have a real experience solving a problem. I started writing a Node API that works as a CRUD to a TODO list, it was pretty simple to implement the first version, that I could use as backend. After that I started to implement the frontend, it was an exploratory journey.

In the begin, I just focused on making it works, so I write everything in some file. As expected every time that I implemented a new feature the file becomes a mess, at this point I started to broke it in small components. This was the moment when I need to understand well the concept of status in React and how to share it among components.

Wrote this code helped me to better understand how to React works and what kind of issues we can get using it. My next step is to find a pattern to organize components and create a mobile app using React Native.

If you wanna take a look at some project that I talked about here follow the links:

https://github.com/RobsonAndraDev/todolist-react

Conclusion

My conclusion was that craft React components is not a hard thing. But manage the status of components can be a challenge besides that organize project files is not so easy, because, apparently we don’t have patterns for that.

We need to pay attention to these things, otherwise, our project becomes messy.

--

--

Robson Andrade
Passei Direto Product and Engineering

Cloud Solutions specialist, agile methods fan and free software enthusiast. More info at https://robsonandradev.github.io