Responsive Navigation Menu

This example shows a simple responsive navigation menu.

jsxCopy codeimport React, { useState } from 'react';
import ReactDOM from 'react-dom';

function NavBar() {
  const [isOpen, setIsOpen] = useState(false);

  const toggleMenu = () => setIsOpen(!isOpen);

  return (
    <nav>
      <button onClick={toggleMenu}>
        {isOpen ? 'Close Menu' : 'Open Menu'}
      </button>
      {isOpen && (
        <ul>
          <li>Home</li>
          <li>About</li>
          <li>Contact</li>
        </ul>
      )}
    </nav>
  );
}

ReactDOM.render(<NavBar />, document.getElementById('root'));

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *