Learn React every day – Day 1: Installation of React in your local device

Share this:

Hello !!!!
Good lord !!! Finally, you are here to learn with me !!!!
I will be posting new articles every day with a calculated dosage of knowledge so, keep following and start with me to learn React.

Day 1 of React :

As the ‘young Sheldon’ said “Let’s the learning begin” without wasting time.

Starting with this, I presume that you know

HTML
CSS
JS 
(more specifically ES6)

If you don’t, don’t worry !!! I will make another article for you with just information that you will need from JS so that you can carry on learning JS parallelly with React.

Installing React in our local system :

First, we need to install nodejs in our system before we deal with react.

Go to https://nodejs.org/en/download/ and download the appropriate version of Node.js.

Mine is windows 64 bit so I downloaded :

Now go to the command line and check if the node is installed properly.

Before heading forward, let’s dissect and understand what this command is and what is this new term npx that looks like npm .

create-react-app is an utility to bootstrap a react project

You can find multiple webpages detailing the difference between npm and npx but here is a short and maxim information.

https://stackoverflow.com/questions/50605219/difference-between-npx-and-npm

after the above command, you will see page opened in your browser

Now you have to React project my-app in your local system …

We will go to the project directory to understand the boilerplate. For now, we need to get through some JS concept before jumping into React:

  • ‘this’ keyword
  • let and const
  • arrow functions
  • object literals
  • Rest and spreads operators

‘this’ keyword :

first what is ‘this’?
‘this’ refers to the object that is executing the current function.

more clearly, if the function is inside the object, ‘this’ references the object itself. For example :

let’s create an object name Laptop

result in console should be like this :

let’s try this with regular function:

This is because by default ‘this’ reference global object which is the window for now.

To be Continued…

Stay safe Take care and Have a productive Quarantine !!!!

Bye, see you in another article tomorrow!

1

Related posts

One Thought to “Learn React every day – Day 1: Installation of React in your local device”

  1. Curiouscoder

    Thanks for starting this .Waiting for next post

Leave a Reply