From a42f827cf793bd0d3033a942bf2193da754266e0 Mon Sep 17 00:00:00 2001 From: "Wyatt J. Miller" Date: Thu, 10 Oct 2024 16:16:55 -0400 Subject: [PATCH] wip: added global layout, added posts route --- frontend/.gitignore | 1 + frontend/components/Footer.tsx | 3 + frontend/components/Header.tsx | 3 + frontend/deno.json | 10 ++- frontend/fresh.config.ts | 5 +- frontend/fresh.gen.ts | 10 ++- frontend/routes/_layout.tsx | 18 +++++ frontend/routes/api/joke.ts | 21 ----- frontend/routes/greet/[name].tsx | 5 -- frontend/routes/index.tsx | 41 +++++----- frontend/routes/posts/[id].tsx | 3 + frontend/routes/posts/index.tsx | 52 ++++++++++++ frontend/static/styles.css | 132 +------------------------------ frontend/tailwind.config.ts | 5 ++ 14 files changed, 126 insertions(+), 183 deletions(-) create mode 100644 frontend/components/Footer.tsx create mode 100644 frontend/components/Header.tsx create mode 100644 frontend/routes/_layout.tsx delete mode 100644 frontend/routes/api/joke.ts delete mode 100644 frontend/routes/greet/[name].tsx create mode 100644 frontend/routes/posts/[id].tsx create mode 100644 frontend/routes/posts/index.tsx create mode 100644 frontend/tailwind.config.ts diff --git a/frontend/.gitignore b/frontend/.gitignore index 5b4bdef..a376c99 100644 --- a/frontend/.gitignore +++ b/frontend/.gitignore @@ -7,5 +7,6 @@ # Fresh build directory _fresh/ + # npm dependencies node_modules/ diff --git a/frontend/components/Footer.tsx b/frontend/components/Footer.tsx new file mode 100644 index 0000000..c3ec6ea --- /dev/null +++ b/frontend/components/Footer.tsx @@ -0,0 +1,3 @@ +export default function Footer() { + return
THIS IS A FOOTER
; +} diff --git a/frontend/components/Header.tsx b/frontend/components/Header.tsx new file mode 100644 index 0000000..2721883 --- /dev/null +++ b/frontend/components/Header.tsx @@ -0,0 +1,3 @@ +export default function Header() { + return
THIS IS THE HEADER
; +} diff --git a/frontend/deno.json b/frontend/deno.json index 19a8233..0a97205 100644 --- a/frontend/deno.json +++ b/frontend/deno.json @@ -22,11 +22,15 @@ ], "imports": { "$fresh/": "https://deno.land/x/fresh@1.6.8/", - "preact": "https://esm.sh/preact@10.19.6", - "preact/": "https://esm.sh/preact@10.19.6/", + "$std/": "https://deno.land/std@0.216.0/", + "@preact-hooks/fetch": "jsr:@preact-hooks/fetch@^0.0.4", "@preact/signals": "https://esm.sh/*@preact/signals@1.2.2", "@preact/signals-core": "https://esm.sh/*@preact/signals-core@1.5.1", - "$std/": "https://deno.land/std@0.216.0/" + "preact": "https://esm.sh/preact@10.19.6", + "preact/": "https://esm.sh/preact@10.19.6/", + "tailwindcss": "npm:tailwindcss@3.4.1", + "tailwindcss/": "npm:/tailwindcss@3.4.1/", + "tailwindcss/plugin": "npm:/tailwindcss@3.4.1/plugin.js" }, "compilerOptions": { "jsx": "react-jsx", diff --git a/frontend/fresh.config.ts b/frontend/fresh.config.ts index e7b63d9..f50b17a 100644 --- a/frontend/fresh.config.ts +++ b/frontend/fresh.config.ts @@ -1,3 +1,6 @@ import { defineConfig } from "$fresh/server.ts"; +import tailwind from "$fresh/plugins/tailwind.ts"; -export default defineConfig({}); +export default defineConfig({ + plugins: [tailwind()], +}); diff --git a/frontend/fresh.gen.ts b/frontend/fresh.gen.ts index e2b0eb1..d73b3e5 100644 --- a/frontend/fresh.gen.ts +++ b/frontend/fresh.gen.ts @@ -4,9 +4,10 @@ import * as $_404 from "./routes/_404.tsx"; import * as $_app from "./routes/_app.tsx"; -import * as $api_joke from "./routes/api/joke.ts"; -import * as $greet_name_ from "./routes/greet/[name].tsx"; +import * as $_layout from "./routes/_layout.tsx"; import * as $index from "./routes/index.tsx"; +import * as $posts_id_ from "./routes/posts/[id].tsx"; +import * as $posts_index from "./routes/posts/index.tsx"; import * as $Counter from "./islands/Counter.tsx"; import { type Manifest } from "$fresh/server.ts"; @@ -14,9 +15,10 @@ const manifest = { routes: { "./routes/_404.tsx": $_404, "./routes/_app.tsx": $_app, - "./routes/api/joke.ts": $api_joke, - "./routes/greet/[name].tsx": $greet_name_, + "./routes/_layout.tsx": $_layout, "./routes/index.tsx": $index, + "./routes/posts/[id].tsx": $posts_id_, + "./routes/posts/index.tsx": $posts_index, }, islands: { "./islands/Counter.tsx": $Counter, diff --git a/frontend/routes/_layout.tsx b/frontend/routes/_layout.tsx new file mode 100644 index 0000000..1872aab --- /dev/null +++ b/frontend/routes/_layout.tsx @@ -0,0 +1,18 @@ +import { LayoutProps } from "$fresh/server.ts"; +import Footer from "../components/Footer.tsx"; +import Header from "../components/Header.tsx"; + +export default function Layout(props: LayoutProps) { + return ( + + + Wyatt J Miller | Home + + + +
+ +