This brief tutorial shows students and new users how to install React or ReactJS on Ubuntu 20.04 | 18.04.
React was developed and is managed by Facebook and open-source developers.
To get started with installing React on Ubuntu, follow the steps below:
For this post, we will install Node.js version 14 and npm. You can install other versions that will suit your environment.
sudo apt install curl curl -sL https://deb.nodesource.com/setup_14.x | sudo bash - sudo apt install nodejs
After running the commands above, Node.js and npm should be installed and ready to use. To verify that it’s installed, run the commands below:
That should display the Node.js version.
When that is installed go ahead and install the Yarn package manager. The commands below can install it.
sudo npm install -g yarn
Create React App
At this point, you should be able to create apps in React. Run the commands below to create your first React app called myfirstproject.
yarn create react-app myfirstproject
You can also use either of the commands below to create a project in React.
npx create-react-app myfirstproject npm init react-app myfirstproject
After a successful build, you should get a similar message as below:
Success! Created myfirstproject at /home/richard/myfirstproject Inside that directory, you can run several commands: yarn start Starts the development server. yarn build Bundles the app into static files for production. yarn test Starts the test runner. yarn eject Removes this tool and copies build dependencies, configuration files and scripts into the app directory. If you do this, you can’t go back! We suggest that you begin by typing: cd myfirstproject yarn start Happy hacking! Done in 94.57s.
Next, change into the project folder and start it.
cd myfirstproject yarn start
After the app is started, you should get a message below:
Compiled successfully! You can now view myfirstproject in the browser. Local: http://localhost:3000 On Your Network: http://10.0.2.10:3000 Note that the development build is not optimized. To create a production build, use yarn build.
A page should also open up to the app index.
That should start up the project so you can start working on it. When you’re done and wish to deploy to projection, use the commands below:
All your project files should be built and uploaded to the directory index.
That should do it!
This post showed you how to install ReactJs on Ubuntu 20.04 | 18.04. If you find any error above, please use the comment form below to report.