How to create-react-app and installing Node.js with NPM
How does React work?
React creates a VIRTUAL DOM in memory. Instead of manipulating the browser’s DOM directly, React creates a virtual DOM in memory, where it does all the necessary manipulating, before making the changes in the browser DOM. React finds out what changes have been made, and changes only what needs to be changed.
React Getting Started
To use React in production, you need NPM and Node.js
What is Node.js?
What is NPM?
Why do i need Node.js and NPM?
How to install Node.js and NPM?
To create react app, you have to first install Node.js on your system. Follow the steps below:
Step 1: Download Node.js installer. In a web browser, navigate to https://nodejs.org/en/download/. Click either the Windows installer button or other installers button depending on your operating system to download the latest default version. At the time this article was written, version 16.0.0 was the latest version. The Node.js installer includes the NPM package manager.
Step 2: Install Node.js and NPM from browser.
- Once the installer finished downloading, launch it. Open the downloads link in your browser and click the file or browse to the location where you have saved the file on your system and double-click to launch.
- The system will ask you if you want to run the software, click run.
- You will be welcomed to the Node.js Setup wizard, click next.
- On the next screen, review the license agreement. Click next if you agree to the terms and install the software.
- The installer will prompt you for the installation location. Leave the default location, unless you have a specific need to install it somewhere else, click next.
- The wizard will let you select components to include or remove from the installation. Again, unless you have a specific need, accept the default by clicking next.
- Finally, click the install button to run the installer. When it finishes, click finish.
Step 3: Verify installation
Open a command prompt or your preferred IDE and enter the following:
The system should display the Node.js version installed on your system.
Do the same for NPM by typing npm -v on your command prompt or your preferred editor(Vscode etc.)
How to create-react-app
There are two ways to install ReactJs:
- Using webpack and babel.
2. Using the create-react-app command
In this article, i will walk you through by using create react app. Create React App is much easier which does all the configuration and necessary package installations for us automatically and starts a new React app locally for development. Another advantage of using create react app is that, you don’t have to deal with Babel and Webpack configurations. All of the necessary configurations will be made available by create react app for you.
To create react app, follow the steps below:
Step 1: Create a new folder in your Local Disk (C:) or go-to your preferred editor and run the following command: C:\>mkdir folder-name
Step 2: Cd into the new folder you just created and run the following command:
The installation process may take a few minutes. After the installation, you should see a folder that appears in your workspace with the name you gave to your app.
Note: my-app is the name i chose for my folder. Name your folder whatever you like.
Step 3: After the installation is completed, change to the directory where your app was installed e.g cd my-app and finally run npm start to see your app live on localhost:
Thank you patiently for your time to read this article. Give a clap after reading this article.