React js Tutorial Part 1 with Examples [Learn ReactJS For Free]

What is React Js?

React is a javascript framework for building user interfaces. It is a front-end library created by Jordan Walke and it is maintained by Facebook and a community of individual developers and compines.

Features

Let’s dive into some of the key features of ReactJS

Declarative

React makes it simple to create interactive and dynamic web and mobile interface. Just by creating a simple view in your app it will update and render just the right components when your data changes. Also, it makes your code more readable and easier to debug.

Component-Based

The component simply means views or UI.React is all about components which manage its own state, and compose them to make complex UI.

Component logic is written in javascript so it can easily pass rich data and keep the state out of the DOM

Virtual DOM

DOM(Data Object Model) is a logical structure of HTML. The reason behind the update speed of React is that it uses virtual DOM.It updates even a small change applied by the user but does not affect the other part of the interface.

Some famous sites which in built on ReactJS are

  • Dropbox.
  • Airbnb.
  • CloudFlare.
  • BBC.
  • Flipboard.
  • Facebook.
  • Instagram

Installation

To install React you first need to download and install nodejs.

Once that is done now let’s install React by typing:

sudo npm install -g create-react-app

That’s it React is now installed on your system

Let’s create our first ‘hello world’ app

In terminal type

create-react-app hello-world
cd ./hello-world && ls -ls

Now let’s test our app by starting up the local server by typing following command in the terminal:

npm start

This command will start the server and open up a browser window which will look like this:

Reactjs startup

Leave a Reply