React Introduction

Introduction

React is a JavaScript library for building UI. React can also be referred to as ReactJs. React was developed by one of the Facebook developers "Jordan Walke".

React implements a component-based approach which means you build applications using components. Each component can be reused for any number of times. This helps developers by improving reusability.

React uses a declarative approach which means it only tells what to do and not how to do it.

It mainly serves the purpose of code reusing the code instead of creating the same code each based on the requirement.

Environment setup

• Install node.js on your local computer and run the .exe file

• Goto command prompt and create a directory/folder

•     mkdir reactApp
      cd reactApp
  

• Run the command to create react app within the folder

•     npx create-react-app <app name>
  

• Open the folder from any IDE supposedly from VSCode.

• To start the react app run the following command from that file path

•     npm start
  

Folder Structure

The folder structure looks as follows:

The main folders created are:

1. node_modules: It consists source code of all the packages that will be installed.

2. public: All the files in the public folder can be statically served. Files in this folder can be called directly through the URL. By default react renders index.html file from the public folder.

   

3. src: When even we run react app it looks for the src folder and runs index.js file by default. The folder name should not be renamed. We can create components and render these in index.js file. By default, app.js is one of the components that is created and rendered by index.js.

   

4. .gitignore: This consists of files to be ignored while uploading on GitHub like /node_modules since these can be regenerated.

5. package.json: It contains configurations of our project such as name, dependencies, scripts.. etc.