React or unreact, things you need to know about the framework

omar meharab
3 min readMay 7, 2021
react image

Before learning about the many things of the “React” that we are going to talk about today, it is important to first learn what exactly react is. Let the show begin.

01. What is React?

There many frameworks and libraries in the world of web development. Frameworks are somewhat rigid tools that are used to create web applications. But if you want to build something simple, using a framework can be problematic as even though you do not need to utilize the whole framework, it will be there in the background.

But for a library, this is different. Libraries do one thing and they do it well. React is one of those libraries. The primary purpose of the react library is to create user interfaces and it does it really well.

02. JSX

You may have already seen that you do not right direct JavaScript in the react components, rather you write HTML in JavaScript and JavaScript in those HTML codes. This is made possible because of JSX. You could write your code in JavaScript too but it would be too much of a hassle and JSX makes writing the code much reasonable and safer.

03. React is Declarative

In react you do not need to tell the code how t do things, you just declare what the output should look like, and react take care of the rest. When mapping you do not need to use for loop to repeat the task. Only mapping the data is enough and react will do the rest.

04. Passing Data

In react, you use props to send data from one component to another. You the data to a child component, not the other way around. You can restructure the props to take out relevant data to display on the UI. The data passing is done this way because data goes down.

05. State

If you are displaying something changeable or something that is not constant then you use to. This asynchronous function helps to show changing results on the UI. You import useState from react and then use it.

06. Events in Parent elements

You keep the changing in the Parent element and event in the child to send back data. This way the parent component gets data and can use it in other components.

07. Virtual DOM

In other frameworks or libraries, the DOM will need to be rendered for every change you make. But there is Virtual DOM in React. Whenever a change is made, react creates a Virtual DOM and compares it with the original DOM and makes the small changes as compared to the virtual DOM. That is another reason that makes react so great.

08. Build file

In react you use the npm “run build command” to make a build file. This creates a more optimized and lighter version so that the performance of your app is not hampered.

09. More optimization

If you want to optimize the web application more, you can use other libraries like Browserify, Rollup, Webpack, Brunch, etc. Similar to this, you have many libraries for React about animation, effects, calendar picker, and many more.

10. React Native

Another powerful thing about react is the React Native library which lets you build mobile apps, both for android and ios. You will be able to adapt to React Native if you are comfortable using React library.

I am sure you have pretty much grasped the versatility react brings in the development sector and why so many people like using it. I hope it gave a small refresher. See you again.

--

--

omar meharab

React web developer. Love to learn and love to love