How to create your ReactJs First App in Visual Studio Code(VS Code)

ReactJS First App

My name is Sardius and I am a frontend developer. If you are a frontend developer and you have gone through the process of learning Javascript and moving on to learning its framework, or probably after reading my previous article on the Framework or library to use after learning Javascript. I am going to walk you through the step on how to start with ReactJs

Let's begin.

REACTJS

React, sometimes referred to as a frontend JavaScript framework, is a JavaScript library created by Facebook. React is a tool for building UI components. and some people also call it a Framework or Library...... But Understand that ReactJs is a frontend JavaScript framework for building UI Component to build interactive elements on websites

How To get started with ReactJs

To use React you must first consider installing Node.js

nodejs.png After you are done installing, oh!!!! you can make use of code directly instead of downloading manually online and for the advantage of those using Linux

sudo apt install nodejs
node -v or node –version
sudo apt install npm
npm -v or npm –version
sudo apt-get update
sudo apt-get upgrade

The code above will help you install and update and even check if it is installed or not...

Using React Directly in HTML

The quickest way to start learning React is to write React directly in your HTML files because your journey started with HTML before moving to JavaScript

don't forget to learn about JSX before coming to ReactJs.. Smile......

Setting up ReactJS Environment

If you have npx and Node.js installed, you can create a React application by using create-react-app, but if you have create-react-app installed before no need of installing it again

to create-react-app, run

npx create-react-app my-react-app

The create-react-app will set up everything needed on your React Application, Then you have to create a new folder in your directory naming it my-react-app and Run the command to move to the my-react-app directory:

cd my-react-app
npm start

A new browser window will pop up with your newly created React App! If not, open your browser and type localhost:3000 in the address bar.

The result:

reactfirst.png

Yeah!!! We have created our first ReactJS AppπŸ˜€πŸ˜€πŸ˜€πŸ˜€

Did you find this article valuable?

Support Abidoye Oluwatobi's Blog by becoming a sponsor. Any amount is appreciated!

Β