How to Create a Simple React Application

One of the projects I have wanted to learn how to do for several years is creating a React application. However, due to a severe lack of free time I haven’t been able to. Until now. Having achieved my long awaited goal of creating my wonderful fledgling application, I now want to share that the steps to create that application with you 😀

Alrighty, first things first. The blissful materials list. For this project you will need:

  1. *whispers* A computer

That’s it! How convenient, right?!

Now, I personally will be walking through this tutorial on a Linux Operating System, but I will also accommodate Windows users as well.

Install On Windows

Alrighty. Windows users, you need to go to the NodeJS site and click the button that includes “LTS” in the name. LTS stands for Long Term Support and indicates that the software you are downloading will receive regular security updates and bug fixes.

You will then be redirected to a downloads screen. Next, you will download the .msi file (the x64 will work if you are on a newer model computer). Once the .msi file is downloaded, go ahead and run it. The .msi file will take you through the process of installing NodeJS on your computer. After NodeJS finishes installing, open Windows terminal. Run the command:

node -v

If you get a version number then viola! You’ve installed NodeJS!

Install On Linux

Linux users, you will need to go to the NodeJS binary distributions GitHub page. From there you will need to scroll down to the respective instruction set for the NodeJS version that you want to install.

Then run the commands listed for your respective distribution.

Finally run the command:

node -v

If you see a version number pop up on your terminal then you are good to go!

Create a React App

The next step is to create a React App. Windows and Linux users, go to your respective terminals and type:

npx create-react-app first-app

NodeJS will begin the process of creating a new ReactJS application.

Once the app is created, type in:

cd first-app

Now run:

npm start

If all goes well, your browser will open up and a page like this will appear:

Congratulations! You have built your first ReactJS application!!!

Posted in