Learn React js Fundamentals In 10 Days

Hai guys welcome the world of react js. We going to learn react js fundamentals by building the game Rock Paper Scissor in 10 days. So let’s see what are the topics we going to cover

1. Introduction to react js
2. Hello world in React JS day#1
3. Components in React JS day#2
4. Add style to components in React JS day#3
5. State in React JS day#4  
6. Props in React day#5
7. Handling events in React JS day#6
8. Accessing DOM elements in React JS day#7
9. Conditional rendering in React JS day#8
10. Adding logic to the game part-1 day#9
11. Adding logic to the game part-2 day#10

You get the idea that what we are going to see in the upcoming days. So let’s dive into the topic

Introduction to React js

Prerequisites to learn react js

1. Basic knowledge of HTML, CSS, and JavaScript.
2. Basic understanding of ES6 features in JavaScript
3. Basic understanding of how to use npm.

If you feel comfortable with the prerequisites you can continue learning, else first learn the prerequisites and came here guys because without knowing the prerequisites. So learning react is waste of time.

what is React js?

React js is a javascript library for building the user interface on a web page. It is also available to make us create reusable UI components. It is an open-source project and was created by the Facebook team.

What is virtual DOM?

React js use a virtual DOM to increase the performance of the web page.

Virtual dom is similar to the DOM in the browser. But React js use virtual dom to find the changes that happen in the web page and update only the component that was changing instead of rendering the whole page. So It increases the performance of the webpage

Let’s understand this by taking an example

Consider Facebook. Say at a given time, you like the post of your friend one. To show that the browser renders the whole page again but if you use react js it only renders the like component(button).

In react we can keep the user interface and the state synchronized with each other. In javascript, if we have to change the state, we would need to change the user interface also.

Code organization and re-using the code is another advantage of React. So react use component to increase the reusability of code.

If you don’t understand what is component don’t worry because we will see in the upcoming day briefly so just keep learning.

Conclusion:

Ok guys that’s enough for today because if we cover more it will confuse you easily. In the next article, we learn  How to write hello world in react.

All the best guys for upcoming days.

One response to “Learn React js Fundamentals In 10 Days”

1. selvam says:

   June 8, 2022 at 6:56 pm

   just awsome thank you for this article i get basic idea about react

   Reply