How to catch failed to fech errors in javascript? [closed]

I was trying to fetch data from my backend then I notice whenever my server was down it keeps showing big red error on screen which is annoying. I want my user to keep using website even if failed to fech and just show it on DOM. How do you make error not show on website, is there a trick to it?

import React, { useEffect, useState } from 'react'
export default function Home() {
    const [fechError, setFecherror] = useState()
    const fechData = async () => {
        console.log('j')
        let data;
        try {
            data = await fetch('http://localhost:3000/home')
        } catch (err) {
            console.clear()
            setFecherror("fail to fech data please try again")
        }
        if (data) {
            const user = await data.json()
            console.log(user)
        } else {
            console.log('no')

        }

    }

    useEffect(() => {
        fechData()
    })
    return (
        <div className='maintainHeight'>
            this is home
            {fechError}
        </div>
    )
}

I tried using try and catch but it’s not going away. I can’t find any docs to solve it.