From f8d8ff781dc78a09c0f455313bf1782eb4fba962 Mon Sep 17 00:00:00 2001 From: realtradam Date: Thu, 27 Jun 2024 17:03:05 -0400 Subject: add react router --- react-frontend/package-lock.json | 41 +++++++++++++++++++++++++++++++- react-frontend/package.json | 3 ++- react-frontend/src/App.tsx | 37 +++------------------------- react-frontend/src/components/Layout.tsx | 11 +++++++++ react-frontend/src/pages/Home.tsx | 8 +++++++ react-frontend/src/routes/index.tsx | 16 +++++++++++++ 6 files changed, 80 insertions(+), 36 deletions(-) create mode 100644 react-frontend/src/components/Layout.tsx create mode 100644 react-frontend/src/pages/Home.tsx create mode 100644 react-frontend/src/routes/index.tsx diff --git a/react-frontend/package-lock.json b/react-frontend/package-lock.json index 922d70d..442b4e6 100644 --- a/react-frontend/package-lock.json +++ b/react-frontend/package-lock.json @@ -9,7 +9,8 @@ "version": "0.0.0", "dependencies": { "react": "^18.3.1", - "react-dom": "^18.3.1" + "react-dom": "^18.3.1", + "react-router-dom": "^6.24.0" }, "devDependencies": { "@types/react": "^18.3.3", @@ -599,6 +600,14 @@ "node": ">= 8" } }, + "node_modules/@remix-run/router": { + "version": "1.17.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.17.0.tgz", + "integrity": "sha512-2D6XaHEVvkCn682XBnipbJjgZUU7xjLtA4dGJRBVUKpEaDYOZMENZoZjAOSb7qirxt5RupjzZxz4fK2FO+EFPw==", + "engines": { + "node": ">=14.0.0" + } + }, "node_modules/@rollup/rollup-android-arm-eabi": { "version": "4.18.0", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.18.0.tgz", @@ -2553,6 +2562,36 @@ "react": "^18.3.1" } }, + "node_modules/react-router": { + "version": "6.24.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.24.0.tgz", + "integrity": "sha512-sQrgJ5bXk7vbcC4BxQxeNa5UmboFm35we1AFK0VvQaz9g0LzxEIuLOhHIoZ8rnu9BO21ishGeL9no1WB76W/eg==", + "dependencies": { + "@remix-run/router": "1.17.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, + "node_modules/react-router-dom": { + "version": "6.24.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.24.0.tgz", + "integrity": "sha512-960sKuau6/yEwS8e+NVEidYQb1hNjAYM327gjEyXlc6r3Skf2vtwuJ2l7lssdegD2YjoKG5l8MsVyeTDlVeY8g==", + "dependencies": { + "@remix-run/router": "1.17.0", + "react-router": "6.24.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "react": ">=16.8", + "react-dom": ">=16.8" + } + }, "node_modules/resolve-from": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz", diff --git a/react-frontend/package.json b/react-frontend/package.json index 30456dc..48b99b3 100644 --- a/react-frontend/package.json +++ b/react-frontend/package.json @@ -11,7 +11,8 @@ }, "dependencies": { "react": "^18.3.1", - "react-dom": "^18.3.1" + "react-dom": "^18.3.1", + "react-router-dom": "^6.24.0" }, "devDependencies": { "@types/react": "^18.3.3", diff --git a/react-frontend/src/App.tsx b/react-frontend/src/App.tsx index b2ba1e4..92de410 100644 --- a/react-frontend/src/App.tsx +++ b/react-frontend/src/App.tsx @@ -1,36 +1,5 @@ -import { useState } from 'react' -import reactLogo from './assets/react.svg' -import viteLogo from '/vite.svg' -import './App.css' +import Routes from "./routes" -function App() { - const [count, setCount] = useState(0) - - return ( - <> -
- - Vite logo - - - React logo - -
-

Game Holster

-

Temp Page

-
- -

- Edit src/App.tsx and save to test HMR -

-
-

- Click on the Vite and React logos to learn more -

- - ) +export default function App() { + return (); } - -export default App diff --git a/react-frontend/src/components/Layout.tsx b/react-frontend/src/components/Layout.tsx new file mode 100644 index 0000000..9221687 --- /dev/null +++ b/react-frontend/src/components/Layout.tsx @@ -0,0 +1,11 @@ +import { Outlet } from "react-router-dom"; + +export default function Layout() +{ + return( + <> +
sidebar
+ + + ); +} diff --git a/react-frontend/src/pages/Home.tsx b/react-frontend/src/pages/Home.tsx new file mode 100644 index 0000000..631adda --- /dev/null +++ b/react-frontend/src/pages/Home.tsx @@ -0,0 +1,8 @@ + +export default function Home() { + return( + <> +

Welcome to Game Holster

+ + ); +} diff --git a/react-frontend/src/routes/index.tsx b/react-frontend/src/routes/index.tsx new file mode 100644 index 0000000..5fcae2b --- /dev/null +++ b/react-frontend/src/routes/index.tsx @@ -0,0 +1,16 @@ +import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; +import Home from "../pages/Home"; +import Layout from "../components/Layout"; + +export default function Index() +{ + return (<> + + + }> + } /> + + + + ); +} -- cgit v1.2.3