How to get started with react.js

What is react.js?

---

In this blog, we will discuss what Javascript is and What a library is and we will take a look at react The most famous Javascript Library in javascript.

JavaScript often abbreviated as JS, is a high-level, just in time compiled, object-oriented programming language that conforms to the ECMAScript specifications. according to Wikipedia. Javascript is very different from other programming languages like Java ( which inspired Javascript ) and c++ Because it runs in browsers.

But after a couple of attempts, javascript was hugely accepted as a server-side language starting from 2009 with the first release of node Js. This was a huge Game Changer for programmers who knew the language (working in browsers), Because now without learning a new language they can write server-side applications also.

This was not the only breakthrough we have seen with Javascript but also Javascript is used to work with mobile applications, Desktop applications, Tv applications and much more. Now it is true to say javascript can be used to build anything.

So as you might have guessed learning javascript is very important in the tech world right now. Not only that Javascript has a huge number of frameworks and libraries to get you rolling quickly and neatly. One of them being React.

React is a library for javascript that has the view layer in the famous MVC architecture. Before we dive into React, let’s discuss what a library is and the difference it has with a framework.

What is a Library

---

A library is a collection of resources ( in our case code ) written by someone to help roll quickly. The concept is pretty simple, Library is someone’s code to help you with a problem or issues that you can bring to your code to solve similar issues or problems. The code is reusable so you don’t have to write it on your own. for example, if you have worked with java, you know you have to import the String package to access the functions or resources in that package. library is the same, you reuse the code someone has written for a similar problem that you are facing.

SO, What is the difference with framework ?

---

well, A framework and library are similar things, they are codes written by someone that you bring to your project or code to solve similar issues. Well, what a library does is give you certain tools to deal with the problem at hand, well Framework seems to go beyond. Library gives you the furniture, Framework can build you the whole house.

well Technically speaking, if you are using a framework the framework also tells or influences the flow of your app, the design and also the architectures in some cases. But a library doesn’t force any flow on you. Instead gives you full control and will take care of little details you don’t have to bother about.

What is react.js

---

simply react.js is a javascript library that enables you to make your development and application fast and painless.

Things to dive in deeply when learning react.js

• Virtual DOM
• JSX
• Context
• State
• Component
• High-order components
• Component Life cycles ( if you are learning react 5.9 or less )
• Hooks

How to setup react

---

First install and setup Nodejs

React expects node js installed, install node js here node website

If you are using Linux make sure to install NPM separately.

Setup your first react project

run the following command

$ npx create-react-app my-app
// or if you have a template use
$ npx create-react-app my-app --template [template-name]
//then
$ cd my-app
//going into the project directory
$ npm start
//starting the application
//now you should see localhost:3000 loads your new app

you can now change your app.js in src directory with the code below

import React from react
function App() {
 return(
    <div>
     <h1> welcome to react.js </h1>
    </div>
     )
}
export default App

with that code, you officially are a React starter! ??

Where to go from here?

The first choice to learn to react would be the official react website here and also we would be writing about react here at addis software website. You can ask any question on the comment below.

How we use react.js in Addis Software

Here in Addis Software, We use React.js to build frontEnd web applications and also Cross-Platform Mobile Applications. Building a cross-platform Mobile application is very helpful, as it enables you to achieve the development speed and also gives you a native speed for your app.