As some people have mentioned before you are not utilising the React library correctly.

The (untested) code below should suit you better. As you can see a state has been used instead of directly changing style properties. I have tried to comment the code as clearly as possible but for more in depth instructions i recommend reading the React docs.

import React, { useState } from 'react';
import assets from './assets';
import { FaBars, FaFacebook, FaRegHeart, FaInstagram, FaLinkedin, FaStar, FaStarHalf, FaTimes, FaTwitter } from 'react-icons/fa';

export const Home = () => {

    // Set state value to keep track of menu open or closed status
    const [navOpen, setNavOpen] = useState(false)

    // Open the active menu
    const open = () => {
        setNavOpen(true)
    }

    // Close the active menu
    const close = () => {
        setNavOpen(false)
    }

    return (
        <>
            <section class="header">
                <nav>
                    <a href="/"><img src={assets.logo} alt='Logo' width='100%' /></a>
                    <div id='navLinks' class='nav-links'>
                        <button onClick={open}>
                            <FaTimes class='fa' />
                        </button>

                        {
                            // Only render the UL node when the navOpen variable is true
                            navOpen && (
                                <ul>
                                    <li><a href="/">HOME</a></li>
                                    <li><a href="/About">ABOUT</a></li>
                                    <li><a href="/Course">COURSE</a></li>
                                    <li><a href="/Blog">BLOG</a></li>
                                    <li><a href="/Contact">CONTACT</a></li>
                                </ul>
                            )
                        }
                        
                    </div>
                    <button onClick={close}>
                        <FaBars class='fa' />
                    </button>
                </nav>
    
                <div class="text-box">
                    <h1>World's Biggest University</h1>
                    <p>Making website is now one of the easiest thing in the world. You just need to learn HTML, CSS,<br />Javascript and you are good to go.</p>
                    <a href="/Contact" class="hero-btn">Visit Us to Know More</a>
                </div>
            </section>
        </>
    )
}