diff --git a/package.json b/package.json index a65c351..12fd86e 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,8 @@ }, "dependencies": { "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "react-router-dom": "^6.22.3" }, "devDependencies": { "@types/react": "^18.2.66", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 8c2d10e..864b79a 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,6 +11,9 @@ dependencies: react-dom: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) + react-router-dom: + specifier: ^6.22.3 + version: 6.22.3(react-dom@18.2.0)(react@18.2.0) devDependencies: '@types/react': @@ -402,6 +405,11 @@ packages: dev: true optional: true + /@remix-run/router@1.15.3: + resolution: {integrity: sha512-Oy8rmScVrVxWZVOpEF57ovlnhpZ8CCPlnIIumVcV9nFdiSIrus99+Lw78ekXyGvVDlIsFJbSfmSovJUhCWYV3w==} + engines: {node: '>=14.0.0'} + dev: false + /@rollup/rollup-android-arm-eabi@4.14.3: resolution: {integrity: sha512-X9alQ3XM6I9IlSlmC8ddAvMSyG1WuHk5oUnXGw+yUBs3BFoTizmG1La/Gr8fVJvDWAq+zlYTZ9DBgrlKRVY06g==} cpu: [arm] @@ -1837,6 +1845,29 @@ packages: scheduler: 0.23.0 dev: false + /react-router-dom@6.22.3(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-7ZILI7HjcE+p31oQvwbokjk6OA/bnFxrhJ19n82Ex9Ph8fNAq+Hm/7KchpMGlTgWhUxRHMMCut+vEtNpWpowKw==} + engines: {node: '>=14.0.0'} + peerDependencies: + react: '>=16.8' + react-dom: '>=16.8' + dependencies: + '@remix-run/router': 1.15.3 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + react-router: 6.22.3(react@18.2.0) + dev: false + + /react-router@6.22.3(react@18.2.0): + resolution: {integrity: sha512-dr2eb3Mj5zK2YISHK++foM9w4eBnO23eKnZEDs7c880P6oKbrjz/Svg9+nxqtHQK+oMW4OtjZca0RqPglXxguQ==} + engines: {node: '>=14.0.0'} + peerDependencies: + react: '>=16.8' + dependencies: + '@remix-run/router': 1.15.3 + react: 18.2.0 + dev: false + /react@18.2.0: resolution: {integrity: sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==} engines: {node: '>=0.10.0'} diff --git a/src/app.tsx b/src/app.tsx index 2ab7b21..d1cd2f7 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -1,3 +1,5 @@ +import { Router } from "./router"; + export function App() { - return

hello, world!

; + return ; } diff --git a/src/pages/episode.tsx b/src/pages/episode.tsx new file mode 100644 index 0000000..f97c851 --- /dev/null +++ b/src/pages/episode.tsx @@ -0,0 +1,3 @@ +export function Episode() { + return

Episode page

; +} diff --git a/src/pages/home.tsx b/src/pages/home.tsx new file mode 100644 index 0000000..51250d9 --- /dev/null +++ b/src/pages/home.tsx @@ -0,0 +1,3 @@ +export function Home() { + return

Home page

; +} diff --git a/src/pages/podcast.tsx b/src/pages/podcast.tsx new file mode 100644 index 0000000..82f6ec6 --- /dev/null +++ b/src/pages/podcast.tsx @@ -0,0 +1,3 @@ +export function Podcast() { + return

Podcast page

; +} diff --git a/src/router.tsx b/src/router.tsx new file mode 100644 index 0000000..b4960e7 --- /dev/null +++ b/src/router.tsx @@ -0,0 +1,23 @@ +import { createBrowserRouter, RouterProvider } from "react-router-dom"; +import { Home } from "./pages/home"; +import { Podcast } from "./pages/podcast"; +import { Episode } from "./pages/episode"; + +const router = createBrowserRouter([ + { + path: "/", + element: , + }, + { + path: "/podcast/:podcastId", + element: , + }, + { + path: "/podcast/:podcastId/episode/:episodeId", + element: , + }, +]); + +export function Router() { + return ; +}