mirror of
https://git.solarpunk.moe/Fries/fries-website.git
synced 2024-11-22 05:52:20 +00:00
add a projects page
this projects page uses dynamic routes to let me use markdown files inside the projects astro content collection.
This commit is contained in:
parent
5d14a6cc08
commit
3f866e5a77
8 changed files with 521 additions and 450 deletions
2
.prettierignore
Normal file
2
.prettierignore
Normal file
|
@ -0,0 +1,2 @@
|
||||||
|
.astro
|
||||||
|
dist
|
5
.prettierrc.json
Normal file
5
.prettierrc.json
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
{
|
||||||
|
"singleQuote": false,
|
||||||
|
"useTabs": true,
|
||||||
|
"tabWidth": 4
|
||||||
|
}
|
|
@ -12,5 +12,8 @@
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@fontsource/atkinson-hyperlegible": "^4.5.11",
|
"@fontsource/atkinson-hyperlegible": "^4.5.11",
|
||||||
"astro": "^2.1.0"
|
"astro": "^2.1.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"prettier": "3.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
905
pnpm-lock.yaml
905
pnpm-lock.yaml
File diff suppressed because it is too large
Load diff
|
@ -2,8 +2,10 @@ import { defineCollection } from "astro:content";
|
||||||
|
|
||||||
const homepageCollection = defineCollection({});
|
const homepageCollection = defineCollection({});
|
||||||
const friendsCollection = defineCollection({});
|
const friendsCollection = defineCollection({});
|
||||||
|
const projectsCollection = defineCollection({});
|
||||||
|
|
||||||
export const collections = {
|
export const collections = {
|
||||||
'homepage': homepageCollection,
|
homepage: homepageCollection,
|
||||||
'friends': friendsCollection
|
friends: friendsCollection,
|
||||||
}
|
projects: projectsCollection,
|
||||||
|
};
|
||||||
|
|
14
src/content/projects/meowy.md
Normal file
14
src/content/projects/meowy.md
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
---
|
||||||
|
title: "Meowy Webring"
|
||||||
|
description: "a little webring project me and my friends are making in rust :3!"
|
||||||
|
---
|
||||||
|
# [Meowy Webring](https://git.solarpunk.moe/Solarpunk/meowy-webring)
|
||||||
|
a little webring project me and my friends are making in rust :3!
|
||||||
|
|
||||||
|
this webring works by having a server that reads from a json file containing the url of the site and an optional name.
|
||||||
|
|
||||||
|
you can go to the next or previous site with just pointing a link in your page to next or previous http routes on the webrings url which will redirect to that page.
|
||||||
|
|
||||||
|
there is also a names api you can GET request and it will return json with the names of the previous or next site or if the sites don't have a name, it will return the url of the site.
|
||||||
|
|
||||||
|
the reason i made this an api is so you don't have to use javascript if you don't want to, you can just point a link to the previous or next routes and it will work. but, if you want to showcase the names of the site, you can either use javascript or if you're using a server side rendered webpage, you can use that too.
|
|
@ -1,8 +1,19 @@
|
||||||
---
|
---
|
||||||
import WorkInProgress from "../components/WorkInProgress.astro";
|
|
||||||
import Layout from "../layouts/Layout.astro";
|
import Layout from "../layouts/Layout.astro";
|
||||||
|
import { getCollection, getEntryBySlug } from "astro:content";
|
||||||
|
|
||||||
|
const projects = await getCollection("projects");
|
||||||
---
|
---
|
||||||
|
|
||||||
<Layout title="fries gay projects">
|
<Layout title="fries gay projects">
|
||||||
<WorkInProgress />
|
<main>
|
||||||
|
<h1>Projects</h1>
|
||||||
|
<p>a page where i show off my projects!</p>
|
||||||
|
{projects.map(project => (
|
||||||
|
<section>
|
||||||
|
<h2><a href={`/projects/${project.slug}`}>{project.data.title}</a></h2>
|
||||||
|
<p>{project.data.description}</p>
|
||||||
|
</section>
|
||||||
|
))}
|
||||||
|
</main>
|
||||||
</Layout>
|
</Layout>
|
||||||
|
|
19
src/pages/projects/[page].astro
Normal file
19
src/pages/projects/[page].astro
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
---
|
||||||
|
import Layout from "../../layouts/Layout.astro";
|
||||||
|
import { getCollection } from "astro:content";
|
||||||
|
|
||||||
|
export async function getStaticPaths() {
|
||||||
|
const projects = await getCollection("projects");
|
||||||
|
return projects.map(project => ({
|
||||||
|
params: {page: project.slug}, props: {project}
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
const { project } = Astro.props;
|
||||||
|
const { Content } = await project.render();
|
||||||
|
---
|
||||||
|
<Layout title={project.data.title}>
|
||||||
|
<article>
|
||||||
|
<Content />
|
||||||
|
</article>
|
||||||
|
</Layout>
|
Loading…
Reference in a new issue