Before getting started with the react command line interface (CLI), you need to first install Nodejs. To do that, simply head over to the official Nodejs website here
, select your system option, download and install Nodejs.
Fig 1. NodejsHaving installed Nodejs, we will be exposed to use the npx, to create our react application. Firstly, create a folder/directory where you would like to have your react application created then open the directory in your command line interface and run the below code sequentially.
From the above codes:npx which is exposed from the nodejs package, create-react-app is the command to create a new react app, then ‘my-app’ is the name of the react application you want to create and must be in lowercases.cd my-app, allows you to change directory into the newly created directory.npm start, spins up the React server for you to serve your files in the browser.The time taken to create a new react application will depend on your Internet speed and other factors.Once the project is created you'll see many new directories and a react boilerplate to welcome you to the React Application.
Fig 2. Boilerplate from react-app.While yours might have the App.jsx as App.js, it’s perfectly fine, you can simply rename it to .jsx so you’d get the React file icon.
Hello World in ReactTo create the famed 'Hello World' in React, we'll need to open our App.jsx file (App.js, in your case).
Fig 3.Single Function Components Approach to writing React Components.
Fig 4. Index.js file, where App.jsx is imported and rendered to the DOMApply Now
The App.jsx is the beginning point of our application, which means that any other component must pass through it because it is the only one being rendered.
To see your react application, save your file and open your browser to the port where the react server is executing.