React returning blank page when accessed directly from browser address bar

This is My App.js file where all the routes is defined.

import React, { useState, useEffect, createContext } from 'react'
import { Route, Switch } from 'react-router-dom'
import Posts from './components/Posts'
import Login from './components/Login'
import { Home } from './components/Home'
import './assets/css/style.css'
import Layout from './components/Layout'
import Account from './components/Account'
import AppliedJobs from './components/AppliedJobs'
import About from './components/About'
import Contact from './components/Contact'
import { MultiStepForm } from './components/MultiStepForm'
import ForgotPassword from './components/ForgotPassword'
import ResetPassword from './components/ResetPassword'
import PrivacyPolicy from './components/PrivacyPolicy'
import { toast } from 'react-toastify'
import 'react-toastify/dist/ReactToastify.css'
export const userContext = createContext() 
toast.configure()
const App = (props) =>{
  const [auth, setAuth] = useState();
  useEffect(() => {
    if (sessionStorage.getItem('token') !== null) {
      setAuth(true);
    } else {
      setAuth(false);
    }
  }, []);

  console.log('Auth Status',auth)
  
  let routes = (
    <Switch>
      <Route exact path='/' component={()=> <Home auth={auth} />}/>
      <Route exact path='/job/:id' component={Posts}/>
      <Route exact path='/login' component={() => <Login setAuth={setAuth}/>}/>
      <Route exact path='/accout' component={Account}/>
      <Route exact path='/appliedjobs' component={AppliedJobs}/>
      <Route exact path='/about' component={()=> <About/>}/>
      <Route exact path='/contact' component={Contact}/>
      <Route exact path='/Registration' component={MultiStepForm}/>
      <Route exact path='/forgot' component={ForgotPassword}/>
      <Route exact path='/reset/:id' component={ResetPassword}/>
      <Route exact path='/privacypolicy' component={PrivacyPolicy}/>
    </Switch>
  )
  return(
          <div>
            <Layout auth={auth} >{routes}</Layout>
          </div>
  )
}


export default App

When I try to access any route from direct URL, it shows me Blank Page. I have did tones of research on this but any solution didnt worked for me..............................................................