Prerequisites

Before we get started on the super awesome react course, you need to make sure you have 2 main things, listed below:

• Node.js (Node.js (nodejs.org))
• Any Code Editor (We’ll be using VS code for this tutorial

Creating our React app

There are 2 main ways to create a new react app:

1. Using create-react-app
2. Using Vite

Using create-react-app

1. With npm installed, type into a vscode terminal Npx create-react-app hello-world

   • Hello-world is the name of the folder to which react will be installed.

2. cd into your newly created folder

3. Once in, open it up in VS Code and run npm start

   • That will open up a local host session at port 3000
   • You will be greeted with something like this, on your browser

   

Using Vite

1. With npm installed, type the following into a vscode terminal: Npm create vite@latest

2. Now you’ll be prompted to fill in some information in the terminal:

   • Project Name: Name it whatever you’d like
   • Package Name (kind of like a sub folder inside the project, where all your code will go): Name it whatever you’d like as well!
   • Now here’s our real config:

   

   • Make sure to select React with your arrow keys, and hit enter once you are done

1. Here select Javascript, since that will be the focus of this course, once again using the arrow keys and hit enter at Javascript.
   • The main difference between Javascript and Typescript in this case is the file type that will be used for components.