インポート'./App.css';

'./component/NavBar.component'からNavBarをインポートします;

'./component/main.component'からMainをインポートします。

'./component/foooter.component'からフッターをインポートします。

import {Routes、Route、Link} from "react-router-dom";

'./component/NavbarComponent/about.component'からAboutをインポートします。

'./component/NavbarComponent/hire.component'からHireをインポートします。

'./component/NavbarComponent/suport.component'からサポートをインポートします。

function App(){return(

  <Routes>
    <Route exact path="/" element={<Main />}/>

    <Route exact path="/about" element={<About />} />

    <Route exact path="/hire" element={<Hire/>} />

    <Route exact path="/support" element={<Support />} />

    <Route path="*" element={<h1>Page not Found</h1>} />

  </Routes>
  <Footer/>
</div>

); }

デフォルトのアプリをエクスポートします。

/* ウェブサイトへのリンク

https://iamniteshpandit.github.io/Chalo-deploy-karte-hain/

リポジトリリンク:-

https://github.com/IAMNITESHPANDIT/Chalo-deploy-karte-hain

それが私のコードを改善するなら、あなたがプルリクエストをすることもできるどんな提案でも、私は間違いなくそれを受け入れます:)

* /

応答

インポート'./App.css';

'./component/NavBar.component'からNavBarをインポートします;

'./component/main.component'からMainをインポートします。

'./component/foooter.component'からフッターをインポートします。

import {Routes、Route} from "react-router-dom";

'./component/NavbarComponent/about.component'からAboutをインポートします。

'./component/NavbarComponent/hire.component'からHireをインポートします。

'./component/NavbarComponent/suport.component'からサポートをインポートします。

function App(){return(

  <Routes>
    /**here path changed path='/' into path="/Chalo-deploy-karte-hain" in-order to application would able to work with github pages  */
   

<Routeexact path = "/ Chalo-deploy-karte-hain" element = {} />

    <Route exact path="/about" element={<About />} />

    <Route exact path="/hire" element={<Hire/>} />

    <Route exact path="/support" element={<Support />} />

    <Route path="*" element={<h1>Page not Found</h1>} />

  </Routes>

  <Footer/>

</div>

); }

デフォルトのアプリをエクスポートします。