# Setting Up React App and Writing Your First Hello World.

Reactjs is one of the most famous libraries out there for the frontend, you might have already heard about it from your colleagues, friends or you may have heard about the buzz in the developer community.

Reactjs is an Open Source frontend library made by the Facebook engineering team.

There are three famous frontend frameworks that are built on React.

1 . Create React App

2 . Nextjs (this Hashnode blog is also made on this framework)

3 . Gatsby

Of course, they all are built differently and serve a purpose but we will be learning about them in the later articles. Today we will be learning about how to set up **Create-react-app** in our local and write our first code `HELLO WORLD` in React.

Let's first make a directory first open your command line terminal and write `mkdir my-react-project` or you can directly click on make a new folder and name it **my-react-project** or anything you want.

After this make sure you have npm installed on your computer if not follow the below step if yes skip directly to **creating a new react app**.

To check if npm is installed or not just go to the command line and type `npm -v` if you get a version like below then npm is installed if not just keep following the next step.

![npm version](https://cdn.hashnode.com/res/hashnode/image/upload/v1627722972659/klLUFclEm.png)

1 . Go to the [Nodejs.org](https://nodejs.org/en/)
2 . Download the LTS version of Node and Install it.

![Node js](https://cdn.hashnode.com/res/hashnode/image/upload/v1627723096309/EVaWNj3as.png)

3 . After finishing the installation the npm will automatically be installed just check by writing ` npm -v ` in your command line. You will be getting the version now.



### Creating a new React App

1. Navigate to the initially created folder ` cd my-react-project` or just go to this folder and fire up the terminal in this folder.
(p.s My favorite way to do the above process is  opening the project directory in VsCode and then opening the inbuilt terminal by using shortcut key **ctrl + `** )

2. After this in your terminal write `npx create-react-app [your app name]` in your app name you can write anything which has lower case e.g **myapp**.


![React directory](https://cdn.hashnode.com/res/hashnode/image/upload/v1627723750867/2mtZtpJsl.png)

You will be seeing something similar to below once the installation is finished. (Meanwhile, take a break drink some coffee Relax your mind.)


![While downloading](https://cdn.hashnode.com/res/hashnode/image/upload/v1627723834912/QEQvJMyVi.png)


3. You will be having a screen something like below now write the command `cd myapp`  to change the directory then ` npm start ` to start your react server.


![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627724525767/VnlDrkNr9.png)

4 . Got to the App.js and delete everything except the parent `div` and write ` <h1> Hello world </h1> ` inside the parent div save it and after that server will automatically restart then go to http://localhost:3000 and you will see your first react code **Hello world** on the screen.


![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627724734513/sswHqLTwV.png)

here are the result 

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627725167575/BW_yrKt4A.png)

**Voila!!!!  you just made your first React App. Up next Writing CRUD operations in React.**


