kris/reacord
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

set up routing

Browse Source
This commit is contained in:
MapleLeaf
2021-12-31 12:58:03 -06:00
committed by Darius
parent 235775f84a
commit ba6f9b1698
8 changed files with 62 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/docs-new/src/document-page.tsx Normal file
View File

@@ -0,0 +1,7 @@
export function DocumentPage() {
return (
<>
<h1>Docs</h1>
</>
)
}

11
packages/docs-new/src/entry.client.tsx
View File

@@ -1,4 +1,13 @@
import { hydrate } from "react-dom"
import { BrowserRouter } from "react-router-dom"
import { Root } from "./root"
import { AppRoutes } from "./routes"
hydrate(<Root />, document)
hydrate(
<Root>
<BrowserRouter>
<AppRoutes />
</BrowserRouter>
</Root>,
document,
)

10
packages/docs-new/src/entry.server.tsx
View File

@@ -1,5 +1,13 @@
import { StaticRouter } from "react-router-dom/server"
import { Root } from "./root"
import { AppRoutes } from "./routes"
export async function render(url: string) {
return <Root />
return (
<Root>
<StaticRouter location={url}>
<AppRoutes />
</StaticRouter>
</Root>
)
}

7
packages/docs-new/src/landing-page.tsx Normal file
View File

@@ -0,0 +1,7 @@
export function LandingPage() {
return (
<>
<h1>Landing</h1>
</>
)
}

9
packages/docs-new/src/root.tsx
View File

@@ -1,6 +1,4 @@
import { Counter } from "./counter"
export function Root() {
export function Root({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<head>
@@ -16,10 +14,7 @@ export function Root() {
}
/>
</head>
<body>
<h1>hi</h1>
<Counter />
</body>
<body>{children}</body>
</html>
)
}

20
packages/docs-new/src/routes.tsx Normal file
View File

@@ -0,0 +1,20 @@
import { Route, Routes } from "react-router"
import { Link } from "react-router-dom"
import { DocumentPage } from "./document-page"
import { LandingPage } from "./landing-page"
export function AppRoutes() {
return (
<>
<nav>
<Link to="/">Home</Link>
<Link to="docs/getting-started">Getting Started</Link>
<Link to="docs/api">API Reference</Link>
</nav>
<Routes>
<Route path="/" element={<LandingPage />} />
<Route path="docs/*" element={<DocumentPage />} />
</Routes>
</>
)
}