My first experience with “React”….

“React” is a free and open-source front-end JavaScript library for building user interfaces or UI components and this is developed by Facebook and a community of individual developers and companies.

I have worked with CSS, HTML, and JavaScript before but I haven't done anything with React. So as the start of learning, I started following Robin Wieruch’s “Road to React” book. Though I went through some chapters of that book the things weren't clear for me. So besides following that I started to work on a simple project to get the idea about react.

The simple project was to create a Todo list with react. For this, I followed a youtube video. It was from the beginning of creating the react app files. After that, I went through the code step by step until the end. The code was contained in a .js file and there was another file for the styles. Add a new todo, delete a todo, and mark the completed ones are the functionalities of that todo list. After the end of the tutorial, those functions worked correctly. So I thought of doing some modifications. The thing I worked on was to add a description section for the specific task. As the first step, I started with adding text input for the description under the task input.

The above shows the UI after the modifications. Next, I worked on the code to get the input and display it in a list as same as the tasks. After doing few tests, finally I was able to succeed.

The above image shows the final UI of the react app. As in the image, the task description is under the task. Also by clicking the completed button, it strikes through the task and the delete button removes the task from the list.

This was my first experience with React!!!