Day-1 Live Demo-1: React JS First App

Live Demo: First app by React + Webpack 4 + Babel Setup

App Name: my-fist-react-app

Pre-requisites: Node JS, Node Package Manager

Node JS Environment Setup:

Download and Install Node JS: https://nodejs.org/en/download/

Download and Install Git: https://git-scm.com/download/win

You can download Yarn for Package manager instead of node package manager (npm): https://yarnpkg.com/en/docs/install#windows-stable

Step-1: React Project Setup In your terminal, type:

create-react-app my-first-react-app

Project Directory:

Step-2: Run this app Type the below command in your terminal:

npm start

Go to browser and type: http://localhost:3000

You can see the below output:

First app Moc Up Design and How React Components work

Sources:

https://www.tutorialspoint.com/reactjs/reactjs_environment_setup.html
https://www.valentinog.com/blog/react-webpack-babel/ 
https://www.robinwieruch.de/minimal-react-webpack-babel-setup/

Live Demo: First app by React + Webpack 4 + Babel Setup