DEV Community

Cover image for An Introduction To React && Hooks
Edmund Adjei
Edmund Adjei

Posted on

An Introduction To React && Hooks

Introduction To React

React is a JavaScript library that is typically used to create the user interfaces of websites and applications. As a matter of fact, it makes it easier for software developers like myself to create interactive and responsive user interfaces. It efficiently updates the state of your application using "hooks" and renders just the right components whenever your data changes.

Image description

Rendering Data

To render, react components implement a render function that takes input data(which could possibly be a prop passed down) and returns what is displayed which could very well be JSX. JSX is what is known to be a combination of HTML and JavaScript languages together.

What are Hooks?
Image description

Hooks are a new addition in React which came alongside the version 16.8 of react. They allow you to use and update state and other React features such as effect without writing a class as shown in the image above.

Below depicts an example of using state

Image description

Image description

Benefits Of Using Hooks

In using Hooks, you can extract data from a component so as to make your code more dynamic. They allow you to reuse stateful logic without changing the hierarchy of your components. React is relatively a new library but definitely makes the lives of software developers much easier. I 100% recommend to all relevant parties to learn it.

Top comments (0)