video1.0<iframe src="https://www.loom.com/embed/0f3ee78215104e7faaffc6c352bdd407" frameborder="0" width="1728" height="1296" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>12961728Loomhttps://www.loom.com12961728https://cdn.loom.com/sessions/thumbnails/0f3ee78215104e7faaffc6c352bdd407-00001.gif567Common Interview for ReactJS// TODO(s):
// update this code so that when you click on a user, they are removed from the screen
// add a number dropdown to fetch a dynamic number of users - for example, now we only fetch 5 users at a time - make it so we can fetch 5, 10 or 15 users based on the dropdown
import { useEffect, useState } from "react";
import "./styles.css";
export default function App() {
const [users, setUsers] = useState([]);
const API_URL = "https://randomuser.me/api/?results=5";
const fetchData = async () => {
const res = await window.fetch(API_URL);
const json = await res.json();
setUsers(json.results);
};
useEffect(() => {
fetchData();
}, []);
return (
<>
Users
{users.map((user) => (
{user.name.first}
))}
);
}