To start with react technology you should have basic knowledge of HTML, CSS and Javascript. React is a javascript library to create single-page applications along with web development. React is one of the most popular front end libraries nowadays. So, here is a step by step react training for beginners.

You can also use the online code editors like CodePen or CodeSandbox otherwise download the standard version of Visual Studio Code for local setup.

Here is the simplest example of react :

What is React

React is a flexible and efficient JavaScript library for developing UI(user interfaces).

Create a project

To create a react project from scratch we need to download visual studio code and Node.js and npm installer (node package manager).

To check if a node gets installed or not you can run the command in cmd prompt if you are using Windows Os or run the command in terminal if you are using Mac OS.

node –version

This command will show you the node version.

You can now start with a react project.  

npx create-react-app react_training

This is the syntax to create react project react_training is the name of the project. It will create the react_training folder and will take a few minutes to install the project.

Now do change directory and start the server and see the application in your browser with the help of following commands.

cd react_training npm start

Go to http://localhost:3000 link and you will see the react logo on the browser.

Print “Welcome to the online React course”:

Form here you can edit the application and add your content as per your requirements. Here I am describing the code to print an online react course!

import React from ‘react’; import ReactDOM from ‘react-dom’; import ‘./index.css’; import App from ‘./App’; import * as serviceWorker from ‘./serviceWorker’; var element = React.createElement(‘h1’, { className: ‘greeting’ }, ‘Welcome to the online React course!’); ReactDOM.render(element, document.getElementById(‘root’)); serviceWorker.unregister();

Write the code into index.js file and run it on the server you  will see the below output on your browser.

Welcome to the online React course!

Now before moving further you should know the two most important things that are react components and props. Without a good understanding of these two you can not work with react.

React Components

React divides the huge UI into a small set of pieces called components. Defining different UI parts into different components makes the process easy for developers. So that’s why react is so effective.

React Props

Props is a keyword in react and it stands for properties. It is used to display data from one component to another.

This blog is for beginners, but if you are interested in react training in Jalandhar then you can visit us at Jalandhar office. We provide online react courses and react training to those students who are eager to learn new things! Other than react if you are looking for online training in Jalandhar then you can visit our office, we are providing training in various trending IT technologies. Happy coding!