Sitemap

A Quick Look into (REACT.JS). What is React JS

3 min readDec 6, 2022

Today we are going to learn about what React JS is.

Press enter or click to view image in full size

React.Js
React.js is a JavaScript library built by Meta (formerly Facebook) for building user interfaces.
It’s based on components, which help us to reuse your code without duplicating it. It has an HTML look-alike syntax known as JSX.

Prerequisites
To start with React.js, we need to have a good knowledge of HTML, CSS, and JavaScript with some advanced topics that include:
☛Classes
☛Objects & arrays
☛ES6 functions
☛Basic understanding of npm
This is the least minimum we need to know to start working on React.js.

Press enter or click to view image in full size

Initiate a Project

React.js uses webpack, babel, and other npm packages to compile the source code. Setting up a project from scratch is a lot of work, but an easy solution to this is to use an npm package, create-react-app that sets up everything for us.
npx create-react-app cd my-app
npm start

Press enter or click to view image in full size

Folder Structure

When we use the npm package, it creates a folder with some files (as shown in the image). The src file is the source folder where we add our files. The public folder has the root HTML file and some configuration (e.g. manifest.json)

Press enter or click to view image in full size

The JSX

If we go to src > app.js, you’ll see a function with a return statement and a syntax that looks like HTML called JSX. Anything that the function returns here will be shown on the screen. The JSX is self-explanatory here.

Press enter or click to view image in full size

Start the Server

We can start the server with a simple npm command that is preconfigured, thanks to the create-react-app.
By default, the URL is localhost:3000.
> npm start

Press enter or click to view image in full size

If you have any confusion about anything. Just me on INSTAGRAM or you can email me at codeculturepro@gmail.com.

--

--

Tasadduq Ali
Tasadduq Ali

Written by Tasadduq Ali

I am MERN Stack developer working in UAE Govt to digitize their massive services. I will help you to become highly skilled Coder 😉