Environment Setup — For Your First Application In React.js

Aqsa Umar
3 min readFeb 25, 2020

--

React con via Wikimedia Commons

We are Going to cover today:

  1. Overview of ReactJs.
  2. Why to use ReactJs in your application.
  3. Setting up Enviroment for your first application using react.

1. ReactJs Overview

Before starting up, hopefully, you are somehow familiar with Html and JavaScript and If you are totally new to ReactJS, This tutorial is for you.
In this tutorial I will start from very basic overview of React application till to setting up environment for your first “Hellow World” application in React.

According to React Documentation, React is defined as

JavaScript library for building user interfaces.”

It enables developers to build creative and interactive UI’s for relatively complex applications, which require multiple, reusable components to be rendered on the page. It’s a view library that uses components to change content on the page without refreshing, the core principle behind single-page applications.

It was developed by Facebook in 2013 and can be used for mobile, web, and VR applications.

The reason why it’s so popular today is the strong community of developers who make open source packages for it, updating it with new and great features.

2. Why React?

There are so many advantages of using react in your application some are as follows:

  1. It uses declarative views:

Declarative views make your code more predictable and easier to debug.React applications make the code more predictable and easier to debug. Additionally, the application will know when to re-render the page, based on the changes in your data or the input.

2.It is built on components that manage their own states:

React build encapsulated components that manage their own state, then compose them to make complex UIs.Conceptually, components are somewhat like JavaScript functions that render different outputs depending on the input. The output, in this case, is the HTML that gets rendered on the page.

3. Reusablity of your code for different browsers and technologies:

We don’t make assumptions about the rest of your technology stack, so you can develop new features in React without rewriting existing code.React can also render on the server using Node and power mobile apps using React Native.

3. Enviroment Set up

For Installing setup for your first you need to have Node >=8.10 and Npm>= 5.6 on your machine.

To create your project run :

  1. npm create-react-app my-app (You can also Create by npx if you are having npm version > 5.2,You can check by the command npm -v)

2.cd my-app

3.npm start

You First Application in ReactJs

Application runing on http://localhost:3000/

In the next article, i will be explaining — Structure of Your first project in ReactJS. Thanks for reading :)

Keep sharing.

--

--