Refactor -> Migrate from NextJS to Astro

.gitignore

@@ -1,46 +1,28 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+# build output
+dist/
+.vercel/
 
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# next.js
-/.next/
-/out/
-
-# production
-/build
+# generated types
+.astro/
 
-# misc
-.DS_Store
-*.pem
+# dependencies
+node_modules/
 
-# debug
+# logs
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+pnpm-debug.log*
 
-# local env files
+# environment variables
 .env
-.env*
+.env.production
 
-# vercel
-.vercel
-
-# typescript
-*.tsbuildinfo
-next-env.d.ts
+# macOS-specific files
+.DS_Store
 
-# feeds
-public/feed
+# blank tags file
+tags.json
 
-# next-video
-videos/*
-!videos/*.json
-!videos/*.js
-!videos/*.ts
-public/_next-video
+# Allow vercel.json
+!vercel.json

.prettierrc.mjs

@@ -0,0 +1,13 @@
+// .prettierrc.mjs
+/** @type {import("prettier").Config} */
+export default {
+  plugins: ["prettier-plugin-astro"],
+  overrides: [
+    {
+      files: "*.astro",
+      options: {
+        parser: "astro",
+      },
+    },
+  ],
+};

.vscode/extensions.json

@@ -0,0 +1,4 @@
+{
+  "recommendations": ["astro-build.astro-vscode"],
+  "unwantedRecommendations": []
+}

.vscode/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "command": "./node_modules/.bin/astro dev",
+      "name": "Development server",
+      "request": "launch",
+      "type": "node-terminal"
+    }
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib"
+}

README.md

@@ -1,33 +1,38 @@
 ```
-   ___   ___
-      / /
-     / /           ___        _   __
-    / /          //   ) )   // ) )  ) )
-   / /          //   / /   // / /  / /
-__/ /___       ((___( (   // / /  / /
-
-
-    /|    //| |
-   //|   // | |     ___     __  ___  __  ___    / __       ( )      ___        ___
-  // |  //  | |   //   ) )   / /      / /      //   ) )   / /     //   ) )   ((   ) )
- //  | //   | |  //   / /   / /      / /      //   / /   / /     //   / /     \ \
-//   |//    | | ((___( (   / /      / /      //   / /   / /     ((___( (   //   ) )
+      :::::::::::            :::          :::   :::
+         :+:              :+: :+:       :+:+: :+:+:
+        +:+             +:+   +:+     +:+ +:+:+ +:+
+       +#+            +#++:++#++:    +#+  +:+  +#+
+      +#+            +#+     +#+    +#+       +#+
+     #+#            #+#     #+#    #+#       #+#
+###########        ###     ###    ###       ###
+
+        :::   :::           :::    :::::::::::   :::::::::::       :::    :::       :::::::::::           :::        ::::::::
+      :+:+: :+:+:        :+: :+:      :+:           :+:           :+:    :+:           :+:             :+: :+:     :+:    :+:
+    +:+ +:+:+ +:+      +:+   +:+     +:+           +:+           +:+    +:+           +:+            +:+   +:+    +:+
+   +#+  +:+  +#+     +#++:++#++:    +#+           +#+           +#++:++#++           +#+           +#++:++#++:   +#++:++#++
+  +#+       +#+     +#+     +#+    +#+           +#+           +#+    +#+           +#+           +#+     +#+          +#+
+ #+#       #+#     #+#     #+#    #+#           #+#           #+#    #+#           #+#           #+#     #+#   #+#    #+#
+###       ###     ###     ###    ###           ###           ###    ###       ###########       ###     ###    ########
 ```
 
 ### hi
 
-The current iteration of my personal website is a multi-tenant experiment.
+After a few years on NextJS with various content backends (Contentful, Hygraph, Sanity, Tina, etc.), I've embraced a new approach.
 
-One code base, one deployment, multiple websites with unique content.
+The front-end is built with [Astro](https://astro.build/), and the content is authored in [Obsidian](https://obsidian.md/). The markdown files are stored in a private repo on Github, and pulled into the Astro site through the Github GraphQL API.
 
-- iammatthias.com
-- iammatthias.xyz
-- iammatthias.art
+Images that are added to the markdown in Obsidian are uploaded to a [Cloudflare R2](https://www.cloudflare.com/developer-platform/r2/) bucket, and the URLs are replaced in the markdown files. In Astro, these images are optimized and cached through [WSRV](https://wsrv.nl/).
 
-The beauty of this system is that I can add new `tenants` at any point. Specific endpoints tied to specific domains for specific content.
+The site is hosted on [Vercel](https://vercel.com/), and I'm using [PostHog](https://posthog.com/) for some basic analytics.
 
-It is rough around the edges, but perfectly serviceable for my needs at the moment.
+> The code is provided as-is, and I'm not planning to provide support for this setup. Feel free to use it as inspiration for your own projects.
 
-### how it works
+### built with
 
-Within our root `page.tsx` we are checking the `host` header and rendering the appropriate tenant dynamically. This adds a slight delay to the initial load, but in practice it is not noticeable due to caching. Downstream data fetching is handled within `<Suspense />`.
+- [Astro](https://astro.build/)
+- [Obsidian](https://obsidian.md/)
+- [PostHog](https://posthog.com/)
+- [Vercel](https://vercel.com/)
+- [WSRV](https://wsrv.nl/)
+- [Cloudflare R2](https://www.cloudflare.com/developer-platform/r2/)

additional.d.ts

@@ -1,7 +1,7 @@
-declare module "uuid";
+declare module "alpinejs-masonry";
 
-declare module "lodash.debounce";
-
-declare module "rss";
-
-declare module "@mapbox/rehype-prism";
+interface ImportMetaEnv {
+  readonly github: string;
+  readonly r2_key: string;
+  readonly r2_secret: string;
+}

astro.config.mjs

@@ -0,0 +1,53 @@
+import { defineConfig } from "astro/config";
+import alpine from "@astrojs/alpinejs";
+import vercel from "@astrojs/vercel/serverless";
+
+// https://astro.build/config
+export default defineConfig({
+  integrations: [alpine()],
+  output: "server",
+  adapter: vercel({
+    isr: {
+      // F16
+      bypassToken: "01123581321345589144233377610987",
+      expiration: 60 * 60 * 24 * 30, // cache for 30 days
+    },
+  }),
+  prefetch: {
+    prefetchAll: true,
+  },
+  redirects: {
+    "./post/1563778800000": {
+      status: 302,
+      destination: "./notes/1563778800000-flatframe",
+    },
+    "./post/1587970800000": {
+      status: 302,
+      destination: "./notes/1587970800000-sourdough",
+    },
+    "./post/1687071600000": {
+      status: 302,
+      destination: "./notes/1687071600000-feels-like-summer",
+    },
+    "./post/1681369200000": {
+      status: 302,
+      destination: "./posts/1681369200000-ai-legion-on-bluesky",
+    },
+    "./post/1670659200001": {
+      status: 302,
+      destination: "./posts/1670659200001-obsidian-as-a-cms",
+    },
+    "./post/1691436904927": {
+      status: 302,
+      destination: "./posts/1691436904927-deploy-html-on-replit",
+    },
+    "./post/1699332127006": {
+      status: 302,
+      destination: "./posts/1699332127006-revisiting-obsidian-as-a-cms",
+    },
+    "./post/*": {
+      status: 302,
+      destination: "./posts",
+    },
+  },
+});