solid start
This commit is contained in:
parent
4dc0ddabbb
commit
967033ba4d
29 changed files with 3707 additions and 0 deletions
24
solid_start/.gitignore
vendored
Normal file
24
solid_start/.gitignore
vendored
Normal file
|
@ -0,0 +1,24 @@
|
||||||
|
|
||||||
|
dist
|
||||||
|
.solid
|
||||||
|
.output
|
||||||
|
.vercel
|
||||||
|
.netlify
|
||||||
|
netlify
|
||||||
|
|
||||||
|
# dependencies
|
||||||
|
/node_modules
|
||||||
|
|
||||||
|
# IDEs and editors
|
||||||
|
/.idea
|
||||||
|
.project
|
||||||
|
.classpath
|
||||||
|
*.launch
|
||||||
|
.settings/
|
||||||
|
|
||||||
|
# Temp
|
||||||
|
gitignore
|
||||||
|
|
||||||
|
# System Files
|
||||||
|
.DS_Store
|
||||||
|
Thumbs.db
|
27
solid_start/package.json
Normal file
27
solid_start/package.json
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
{
|
||||||
|
"name": "solid_start",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "solid-start dev",
|
||||||
|
"build": "solid-start build",
|
||||||
|
"start": "solid-start start"
|
||||||
|
},
|
||||||
|
"type": "module",
|
||||||
|
"devDependencies": {
|
||||||
|
"autoprefixer": "^10.4.14",
|
||||||
|
"postcss": "^8.4.24",
|
||||||
|
"solid-start-node": "^0.2.26",
|
||||||
|
"tailwindcss": "^3.3.2",
|
||||||
|
"typescript": "^4.9.5",
|
||||||
|
"vite": "^4.3.9"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@solidjs/meta": "^0.28.5",
|
||||||
|
"@solidjs/router": "^0.8.2",
|
||||||
|
"solid-js": "^1.7.6",
|
||||||
|
"solid-start": "^0.2.26",
|
||||||
|
"undici": "^5.22.1"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=16"
|
||||||
|
}
|
||||||
|
}
|
3267
solid_start/pnpm-lock.yaml
generated
Normal file
3267
solid_start/pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load diff
6
solid_start/postcss.config.cjs
Normal file
6
solid_start/postcss.config.cjs
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
module.exports = {
|
||||||
|
plugins: {
|
||||||
|
tailwindcss: {},
|
||||||
|
autoprefixer: {},
|
||||||
|
},
|
||||||
|
}
|
6
solid_start/public/about.txt
Normal file
6
solid_start/public/about.txt
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
This favicon was generated using the following graphics from Twitter Twemoji:
|
||||||
|
|
||||||
|
- Graphics Title: 1f37b.svg
|
||||||
|
- Graphics Author: Copyright 2020 Twitter, Inc and other contributors (https://github.com/twitter/twemoji)
|
||||||
|
- Graphics Source: https://github.com/twitter/twemoji/blob/master/assets/svg/1f37b.svg
|
||||||
|
- Graphics License: CC-BY 4.0 (https://creativecommons.org/licenses/by/4.0/)
|
BIN
solid_start/public/android-chrome-192x192.png
Normal file
BIN
solid_start/public/android-chrome-192x192.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 12 KiB |
BIN
solid_start/public/android-chrome-512x512.png
Normal file
BIN
solid_start/public/android-chrome-512x512.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 38 KiB |
BIN
solid_start/public/apple-touch-icon.png
Normal file
BIN
solid_start/public/apple-touch-icon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 10 KiB |
BIN
solid_start/public/favicon-16x16.png
Normal file
BIN
solid_start/public/favicon-16x16.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 685 B |
BIN
solid_start/public/favicon-32x32.png
Normal file
BIN
solid_start/public/favicon-32x32.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.5 KiB |
BIN
solid_start/public/favicon.ico
Normal file
BIN
solid_start/public/favicon.ico
Normal file
Binary file not shown.
After Width: | Height: | Size: 15 KiB |
1
solid_start/public/site.webmanifest
Normal file
1
solid_start/public/site.webmanifest
Normal file
|
@ -0,0 +1 @@
|
||||||
|
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
|
9
solid_start/readme.md
Normal file
9
solid_start/readme.md
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
# Doordesk
|
||||||
|
|
||||||
|
`pnpm install`
|
||||||
|
|
||||||
|
`pnpm run dev`
|
||||||
|
|
||||||
|
`pnpm run build`
|
||||||
|
|
||||||
|
`pnpm run start`
|
13
solid_start/src/components/Counter.tsx
Normal file
13
solid_start/src/components/Counter.tsx
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
import { createSignal } from "solid-js";
|
||||||
|
|
||||||
|
export default function Counter() {
|
||||||
|
const [count, setCount] = createSignal(0);
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
class="w-[200px] rounded-full bg-gray-700 border-2 border-gray-300 focus:border-gray-400 active:border-gray-400 px-[2rem] py-[1rem]"
|
||||||
|
onClick={() => setCount(count() + 1)}
|
||||||
|
>
|
||||||
|
Clicks: {count()}
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
}
|
18
solid_start/src/components/Post.tsx
Normal file
18
solid_start/src/components/Post.tsx
Normal file
|
@ -0,0 +1,18 @@
|
||||||
|
import type { Article } from "~/routes";
|
||||||
|
|
||||||
|
export default function Post(props: Article) {
|
||||||
|
console.log(props)
|
||||||
|
return (
|
||||||
|
<main class="bg-zinc-900 mx-auto text-zinc-300 p-4 my-5 max-w-prose">
|
||||||
|
<p class="text-right">
|
||||||
|
{props.article.date}
|
||||||
|
</p>
|
||||||
|
<h1 class="max-6-xs text-4xl text-red-600 font-thin uppercase">
|
||||||
|
{props.article.title}
|
||||||
|
</h1>
|
||||||
|
<p class="my-4">
|
||||||
|
{props.article.url}
|
||||||
|
</p>
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
}
|
3
solid_start/src/entry-client.tsx
Normal file
3
solid_start/src/entry-client.tsx
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
import { mount, StartClient } from "solid-start/entry-client";
|
||||||
|
|
||||||
|
mount(() => <StartClient />, document);
|
9
solid_start/src/entry-server.tsx
Normal file
9
solid_start/src/entry-server.tsx
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
import {
|
||||||
|
StartServer,
|
||||||
|
createHandler,
|
||||||
|
renderAsync,
|
||||||
|
} from "solid-start/entry-server";
|
||||||
|
|
||||||
|
export default createHandler(
|
||||||
|
renderAsync((event) => <StartServer event={event} />)
|
||||||
|
);
|
3
solid_start/src/root.css
Normal file
3
solid_start/src/root.css
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
@tailwind base;
|
||||||
|
@tailwind components;
|
||||||
|
@tailwind utilities;
|
68
solid_start/src/root.tsx
Normal file
68
solid_start/src/root.tsx
Normal file
|
@ -0,0 +1,68 @@
|
||||||
|
// @refresh reload
|
||||||
|
import { Suspense } from "solid-js";
|
||||||
|
import {
|
||||||
|
useLocation,
|
||||||
|
A,
|
||||||
|
Body,
|
||||||
|
ErrorBoundary,
|
||||||
|
FileRoutes,
|
||||||
|
Head,
|
||||||
|
Html,
|
||||||
|
Meta,
|
||||||
|
Routes,
|
||||||
|
Scripts,
|
||||||
|
Title,
|
||||||
|
} from "solid-start";
|
||||||
|
import "./root.css";
|
||||||
|
|
||||||
|
export default function Root() {
|
||||||
|
const location = useLocation();
|
||||||
|
const active = (path: string) =>
|
||||||
|
path == location.pathname
|
||||||
|
? "border-sky-600"
|
||||||
|
: "border-transparent hover:border-sky-600";
|
||||||
|
return (
|
||||||
|
<Html lang="en">
|
||||||
|
<Head>
|
||||||
|
<Title>doordesk</Title>
|
||||||
|
<Meta charset="utf-8" />
|
||||||
|
<Meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
</Head>
|
||||||
|
<Body class="bg-zinc-950">
|
||||||
|
<Suspense>
|
||||||
|
<ErrorBoundary>
|
||||||
|
<nav class="bg-gradient-to-b from-zinc-800 to-zinc-900">
|
||||||
|
<ul class="container flex items-center p-3 text-gray-200">
|
||||||
|
<li class={`border-b-2} mx-1.5 sm:mx-6`}>
|
||||||
|
DoorDesk
|
||||||
|
</li>
|
||||||
|
<li class={`border-b-2 ${active("/")} mx-1.5 sm:mx-6`}>
|
||||||
|
<A href="/">Home</A>
|
||||||
|
</li>
|
||||||
|
<li class={`border-b-2 ${active("/blog")} mx-1.5 sm:mx-6`}>
|
||||||
|
<A href="/blog">Blog</A>
|
||||||
|
</li>
|
||||||
|
<li class={`border-b-2 ${active("/projects")} mx-1.5 sm:mx-6`}>
|
||||||
|
<A href="/projects">Projects</A>
|
||||||
|
</li>
|
||||||
|
<li class={`border-b-2 ${active("/games")} mx-1.5 sm:mx-6`}>
|
||||||
|
<A href="/games">Games</A>
|
||||||
|
</li>
|
||||||
|
<li class={`border-b-2 ${active("/cartman")} mx-1.5 sm:mx-6`}>
|
||||||
|
<A href="/cartman">Cartman</A>
|
||||||
|
</li>
|
||||||
|
<li class={`border-b-2 ${active("/about")} mx-1.5 sm:mx-6`}>
|
||||||
|
<A href="/about">About</A>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
<Routes>
|
||||||
|
<FileRoutes />
|
||||||
|
</Routes>
|
||||||
|
</ErrorBoundary>
|
||||||
|
</Suspense>
|
||||||
|
<Scripts />
|
||||||
|
</Body>
|
||||||
|
</Html>
|
||||||
|
);
|
||||||
|
}
|
31
solid_start/src/routes/[...404].tsx
Normal file
31
solid_start/src/routes/[...404].tsx
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
import { A } from "solid-start";
|
||||||
|
|
||||||
|
export default function NotFound() {
|
||||||
|
return (
|
||||||
|
<main class="text-center mx-auto text-gray-700 p-4">
|
||||||
|
<h1 class="max-6-xs text-6xl text-sky-700 font-thin uppercase my-16">
|
||||||
|
Not Found
|
||||||
|
</h1>
|
||||||
|
<p class="mt-8">
|
||||||
|
Visit{" "}
|
||||||
|
<a
|
||||||
|
href="https://solidjs.com"
|
||||||
|
target="_blank"
|
||||||
|
class="text-sky-600 hover:underline"
|
||||||
|
>
|
||||||
|
solidjs.com
|
||||||
|
</a>{" "}
|
||||||
|
to learn how to build Solid apps.
|
||||||
|
</p>
|
||||||
|
<p class="my-4">
|
||||||
|
<A href="/" class="text-sky-600 hover:underline">
|
||||||
|
Home
|
||||||
|
</A>
|
||||||
|
{" - "}
|
||||||
|
<A href="/about" class="text-sky-600 hover:underline">
|
||||||
|
About Page
|
||||||
|
</A>
|
||||||
|
</p>
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
}
|
31
solid_start/src/routes/about.tsx
Normal file
31
solid_start/src/routes/about.tsx
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
import { A } from "solid-start";
|
||||||
|
import Counter from "~/components/Counter";
|
||||||
|
|
||||||
|
export default function About() {
|
||||||
|
return (
|
||||||
|
<main class="text-center mx-auto text-gray-700 p-4">
|
||||||
|
<h1 class="max-6-xs text-6xl text-sky-700 font-thin uppercase my-16">
|
||||||
|
About!
|
||||||
|
</h1>
|
||||||
|
<Counter />
|
||||||
|
<p class="mt-8">
|
||||||
|
Visit{" "}
|
||||||
|
<a
|
||||||
|
href="https://solidjs.com"
|
||||||
|
target="_blank"
|
||||||
|
class="text-sky-600 hover:underline"
|
||||||
|
>
|
||||||
|
solidjs.com
|
||||||
|
</a>{" "}
|
||||||
|
to learn how to build Solid apps.
|
||||||
|
</p>
|
||||||
|
<p class="my-4">
|
||||||
|
<A href="/" class="text-sky-600 hover:underline">
|
||||||
|
Home
|
||||||
|
</A>
|
||||||
|
{" - "}
|
||||||
|
<span>About Page</span>
|
||||||
|
</p>
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
}
|
31
solid_start/src/routes/blog.tsx
Normal file
31
solid_start/src/routes/blog.tsx
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
import { A } from "solid-start";
|
||||||
|
import Counter from "~/components/Counter";
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
|
return (
|
||||||
|
<main class="text-center mx-auto text-gray-700 p-4">
|
||||||
|
<h1 class="max-6-xs text-6xl text-sky-700 font-thin uppercase my-16">
|
||||||
|
Blog!
|
||||||
|
</h1>
|
||||||
|
<Counter />
|
||||||
|
<p class="mt-8">
|
||||||
|
Visit{" "}
|
||||||
|
<a
|
||||||
|
href="https://solidjs.com"
|
||||||
|
target="_blank"
|
||||||
|
class="text-sky-600 hover:underline"
|
||||||
|
>
|
||||||
|
solidjs.com
|
||||||
|
</a>{" "}
|
||||||
|
to learn how to build Solid apps.
|
||||||
|
</p>
|
||||||
|
<p class="my-4">
|
||||||
|
<span>Home</span>
|
||||||
|
{" - "}
|
||||||
|
<A href="/about" class="text-sky-600 hover:underline">
|
||||||
|
About Page
|
||||||
|
</A>{" "}
|
||||||
|
</p>
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
}
|
31
solid_start/src/routes/cartman.tsx
Normal file
31
solid_start/src/routes/cartman.tsx
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
import { A } from "solid-start";
|
||||||
|
import Counter from "~/components/Counter";
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
|
return (
|
||||||
|
<main class="text-center mx-auto text-gray-700 p-4">
|
||||||
|
<h1 class="max-6-xs text-6xl text-sky-700 font-thin uppercase my-16">
|
||||||
|
Cartman!
|
||||||
|
</h1>
|
||||||
|
<Counter />
|
||||||
|
<p class="mt-8">
|
||||||
|
Visit{" "}
|
||||||
|
<a
|
||||||
|
href="https://solidjs.com"
|
||||||
|
target="_blank"
|
||||||
|
class="text-sky-600 hover:underline"
|
||||||
|
>
|
||||||
|
solidjs.com
|
||||||
|
</a>{" "}
|
||||||
|
to learn how to build Solid apps.
|
||||||
|
</p>
|
||||||
|
<p class="my-4">
|
||||||
|
<span>Home</span>
|
||||||
|
{" - "}
|
||||||
|
<A href="/about" class="text-sky-600 hover:underline">
|
||||||
|
About Page
|
||||||
|
</A>{" "}
|
||||||
|
</p>
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
}
|
31
solid_start/src/routes/games.tsx
Normal file
31
solid_start/src/routes/games.tsx
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
import { A } from "solid-start";
|
||||||
|
import Counter from "~/components/Counter";
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
|
return (
|
||||||
|
<main class="text-center mx-auto text-gray-700 p-4">
|
||||||
|
<h1 class="max-6-xs text-6xl text-sky-700 font-thin uppercase my-16">
|
||||||
|
Games!
|
||||||
|
</h1>
|
||||||
|
<Counter />
|
||||||
|
<p class="mt-8">
|
||||||
|
Visit{" "}
|
||||||
|
<a
|
||||||
|
href="https://solidjs.com"
|
||||||
|
target="_blank"
|
||||||
|
class="text-sky-600 hover:underline"
|
||||||
|
>
|
||||||
|
solidjs.com
|
||||||
|
</a>{" "}
|
||||||
|
to learn how to build Solid apps.
|
||||||
|
</p>
|
||||||
|
<p class="my-4">
|
||||||
|
<span>Home</span>
|
||||||
|
{" - "}
|
||||||
|
<A href="/about" class="text-sky-600 hover:underline">
|
||||||
|
About Page
|
||||||
|
</A>{" "}
|
||||||
|
</p>
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
}
|
36
solid_start/src/routes/index.tsx
Normal file
36
solid_start/src/routes/index.tsx
Normal file
|
@ -0,0 +1,36 @@
|
||||||
|
import { For, Accessor, createResource } from "solid-js"
|
||||||
|
import { useRouteData } from "solid-start";
|
||||||
|
import Post from "~/components/Post"
|
||||||
|
|
||||||
|
|
||||||
|
export type Article = {
|
||||||
|
content_type: string;
|
||||||
|
title: string;
|
||||||
|
date: string;
|
||||||
|
url: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
export function routeData() {
|
||||||
|
const [blogPosts] = createResource(async () => {
|
||||||
|
const response = await fetch("http://127.0.0.1:9696/dennis/blog")
|
||||||
|
return await response.json() as Article[];
|
||||||
|
});
|
||||||
|
|
||||||
|
return { blogPosts };
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
|
const { blogPosts } = useRouteData<typeof routeData>();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<ul>
|
||||||
|
<For each={blogPosts()}>
|
||||||
|
{(post) => <li><Post article={post} /></li>}
|
||||||
|
</For>
|
||||||
|
</ul>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
};
|
31
solid_start/src/routes/projects.tsx
Normal file
31
solid_start/src/routes/projects.tsx
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
import { A } from "solid-start";
|
||||||
|
import Counter from "~/components/Counter";
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
|
return (
|
||||||
|
<main class="text-center mx-auto text-gray-700 p-4">
|
||||||
|
<h1 class="max-6-xs text-6xl text-sky-700 font-thin uppercase my-16">
|
||||||
|
Projects!
|
||||||
|
</h1>
|
||||||
|
<Counter />
|
||||||
|
<p class="mt-8">
|
||||||
|
Visit{" "}
|
||||||
|
<a
|
||||||
|
href="https://solidjs.com"
|
||||||
|
target="_blank"
|
||||||
|
class="text-sky-600 hover:underline"
|
||||||
|
>
|
||||||
|
solidjs.com
|
||||||
|
</a>{" "}
|
||||||
|
to learn how to build Solid apps.
|
||||||
|
</p>
|
||||||
|
<p class="my-4">
|
||||||
|
<span>Home</span>
|
||||||
|
{" - "}
|
||||||
|
<A href="/about" class="text-sky-600 hover:underline">
|
||||||
|
About Page
|
||||||
|
</A>{" "}
|
||||||
|
</p>
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
}
|
8
solid_start/tailwind.config.cjs
Normal file
8
solid_start/tailwind.config.cjs
Normal file
|
@ -0,0 +1,8 @@
|
||||||
|
/** @type {import('tailwindcss').Config} */
|
||||||
|
module.exports = {
|
||||||
|
content: ["./src/**/*.{html,js,jsx,ts,tsx}"],
|
||||||
|
theme: {
|
||||||
|
extend: {}
|
||||||
|
},
|
||||||
|
plugins: []
|
||||||
|
};
|
17
solid_start/tsconfig.json
Normal file
17
solid_start/tsconfig.json
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"allowSyntheticDefaultImports": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"target": "ESNext",
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "node",
|
||||||
|
"jsxImportSource": "solid-js",
|
||||||
|
"jsx": "preserve",
|
||||||
|
"strict": true,
|
||||||
|
"types": ["solid-start/env"],
|
||||||
|
"baseUrl": "./",
|
||||||
|
"paths": {
|
||||||
|
"~/*": ["./src/*"]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
6
solid_start/vite.config.ts
Normal file
6
solid_start/vite.config.ts
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
import solid from "solid-start/vite";
|
||||||
|
import { defineConfig } from "vite";
|
||||||
|
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [solid()],
|
||||||
|
});
|
Loading…
Add table
Reference in a new issue