Ready to create your first app in React ? I thought so.
Here’s the plan;
Installing latest version of npm
Installing create-react-app
Creating a react app
Conclusion
Let’s get right into it…
Installing npm
Before using React, you’ll need to have node js installed on your system.
Linked here is a source that could explain why npm is needed for React should you like to learn more.
I used Linux Mint for creating this but the commands I will use should not be any different from those used under on Windows, Mac or any other Linux distro. Except for the npm installation, whose instructions you could find here.
For your node installation, you will use node version manager to have some control which node version gets installed. In this post, I’ll install the latest version which is 22, at least as per the time I am writing this.
Do paste the code below into your terminal to install node using nvm.
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
# download and install Node.js
nvm install 22
# verifies the right Node.js version is in the environment
node -v # should print 22.x.x
# verifies the right NPM version is in the environment
npm -v
If the nvm command fails to run the first time. You might have to close your terminal and reopen it, then retry the installation by running;
nvm install 22
To confirm if your installation was successful, running should print out version 22;
node –version
Moving on to the next step.
Installing create-react-app.
To save yourself the mind boggling steps involved in creating React applications, we’ll use react’s utility create-react-app for this post.
If you’d like to know how to do all the configurations witout utilities like create-react-app or any other similar ones, here’s a tutorial that could aid your learning.
Continuing with installing create-react-app, run the command
npm install create-react-app
If you face any issues with this command, you can reach out to me in the comment section and I might be able to help. And, you might as well find a solution online.
Creating the app
Now to create the app, switch directory to the folder in which you wish to create your application and type the command;
npx create-react-app myapp
The creates an app under the name myapp.
You can replace myapp with any other name of your choice, it doesn’t carry any significance. On running the command, you should get a response similar to this.
Listing the directiories in your current directory should now display a new folder under the name you specified in the previously ran command.
Switch to your newly created app directory and start your the app with;
npm start
Your default web browser should open app with a rendering of your first React application!
Cool, isn’t it! In this post;
You installed node js with nvm
You installed React’s create-react-app utility
You created your fist React application, probably.
Hope that helped and thanks for following along!
Did you learn something from this article? Do you have something you would like to add to it? Something to correct or anything else to say about this post? I’d be happy to know. Please leave a comment in the comment section and if you liked the post, don’t forget to like and share to anyone you think might need it.
