What you should Know:

Knowledge of Javascript
Basic knowledge of React
Basic knowledge of React Hooks, especially useState() & useEffect
React hooks are the modern way to deal with application state and lifecycle events within components. Hooks have been introduced to make React code cleaner.

React has multiple hooks to carry out different operations. We have majorly the useState and useEffect hooks. It’s necessary that every aspiring React developer should be knowledgeable in these hooks, especially these 2.

useState and useEffect are destructured from react.

import { useState, useEffect } from “react

We initialize our state by calling useState in our function component.

useState accepts an initial state and returns two values:

The current state.
A function that updates the state.
import { useState } from "react";

function newValue() {

const [value, setValue] = useState(0);

return (

{value}

//prints zero

)

}

The useEffect hook allows us to respond to changes in the component lifecycle. The component lifecycle refers to a set of events that occur from the time a component is mounted to the DOM until it is removed. It uses a dependency array to determine how many times it renders.

One of the benefits of useState is used to fetch data from an Api endpoint

We will be using the Github Api to create collage of Github contributors. (This idea is extracted from CoddingAddict).

If we open the link(https://api.github.com/users) on the web browser, You would get this:

[

{

"login": "mojombo",

"id": 1,

"node_id": "MDQ6VXNlcjE=",

"avatar_url": "https://avatars.githubusercontent.com/u/1?v=4",

"gravatar_id": "",

"url": "https://api.github.com/users/mojombo",

"html_url": "https://github.com/mojombo",