Routes
Only React, not Next.js.
Prerequisite
- npm
- Yarn
npm install react-router-dom
npm install -D @types/react-router-dom
yarn add react-router-dom
yarn add -D @types/react-router-dom
Code
src/components/Routes/index.tsx
import pages from 'pages'
import { Route, BrowserRouter, Routes } from 'react-router-dom'
export default () => {
return (
<BrowserRouter>
<Routes>
{pages.map(({ path, element: Element }, key) => (
<Route key={key} path={path} element={<Element.default />} />
))}
</Routes>
</BrowserRouter>
)
}
src/pages/index.ts
import type { RouteProps } from 'react-router-dom'
const pages: RouteProps[] = [
{ path: '/', element: require('./_') },
{ path: '/login', element: require('./login') },
{ path: '/signup', element: require('./signup') }
]
export default pages