In this section, you’ll be walked through the entire process of creating a Hello World application in React.js. There are chances that you might run into minor errors. You’ll also be guided on how to tackle with them.First, make sure that you have the latest version of Node.js installed on your system. If not, please visit this link and download the current version on your system.
There are two ways to start creating a React project. Here, you’ll see both. Afterwards, you can follow whichever suits you better.
Open your Terminal (in Linux/Mac) or CMD (in Windows) and run the following command:
npm install create-react-app -g
npm: Node Package Manager install: You want to install a package in your system -g: Flag to indicate it is installed globally, so that you can run it from terminal / CMD or from anywhere throughout your computer create-react-app: Name of the Node package that you want to install
After that, make sure you’re in the directory where you want to create your project and run the following command:
In the above code, you’re creating a React project by the name “helloworld” (shortened from hello world). It’ll download and install a lot of files and directories in the project directory.
Note: This method only works if you have NPM (Node Package Manager) version 5 or greater installed on your machine. To check which version you have, open your Terminal or CMD and run the following: npm -v This will tell your NPM version (right now, mine is 6.9.0 as I write this article).
Once you’re sure that you have NPM 5.0 or greater, run the following command:
npx create-react-app helloworld
This command will download dependencies, install them in the project directory as well as create the project structure for you.