Before you create any component, create a component subfolder inside the src folder, then create a NAv.js component inside the component subfolder

In addition, create an images subfolder inside the src folder, download the following images, and put them there:



Our Nav components codes look as shown in the snippet below:

import KanteHead from "../images/kantehead.png";

// Reloads the windo any thime invoked
const handleClick = () => {
  return window.location.reload();

const Nav = () => {
  return (
      <nav className="navbar">
        <div className="logo">
          <a href="#" onClick={handleClick}>
            <img src={KanteHead} alt="N'golo Kante" className="kante-pic" />
          <a href="#">
            <h1 className="logo-text">
              KANTE <br /> QUOTES

            <a href="#"> Random Quote</a>

export default Nav;