feat: move to templ

Signed-off-by: jolheiser <john.olheiser@gmail.com>

.eleventy.js

@@ -1,17 +0,0 @@
-const icons = require('simple-icons');
-
-module.exports = function(eleventyConfig) {
-
-  eleventyConfig.addShortcode("icon", (name) => {
-    const iconName = "si" + name.charAt(0).toUpperCase() + name.substr(1).toLowerCase();
-    const icon = icons[iconName];
-    return `<title>${icon.title}</title><path fill="#${icon.hex}" d="${icon.path}"></path>`
-  });
-  
-  return {
-    dir: {
-      input: "src",
-      output: "dist"
-    }
-  }
-};

.gitignore

@@ -1,3 +1 @@
-node_modules/
 dist/
-yarn-error.log

flake.lock

@@ -33,10 +33,32 @@
         "type": "github"
       }
     },
+    "nur": {
+      "inputs": {
+        "nixpkgs": [
+          "nixpkgs"
+        ]
+      },
+      "locked": {
+        "lastModified": 1694739610,
+        "narHash": "sha256-8uaewp23kpGZtCF2vjuZR0QJRC0iXC6nyoxI/+7s6sg=",
+        "ref": "refs/heads/main",
+        "rev": "337275b6dd4514ee7dd0dd0858dccbdbca7853c2",
+        "revCount": 166,
+        "type": "git",
+        "url": "https://git.jojodev.com/jolheiser/nur"
+      },
+      "original": {
+        "type": "git",
+        "url": "https://git.jojodev.com/jolheiser/nur"
+      }
+    },
     "root": {
       "inputs": {
         "flake-utils": "flake-utils",
-        "nixpkgs": "nixpkgs"
+        "nixpkgs": "nixpkgs",
+        "nur": "nur",
+        "tailwind-ctp": "tailwind-ctp"
       }
     },
     "systems": {
@@ -53,6 +75,26 @@
         "repo": "default",
         "type": "github"
       }
+    },
+    "tailwind-ctp": {
+      "inputs": {
+        "nixpkgs": [
+          "nixpkgs"
+        ]
+      },
+      "locked": {
+        "lastModified": 1695841587,
+        "narHash": "sha256-fgiZd5AV+hi8Ne0bJ8SyAx5nppseW4aXJQEIDSr0VNA=",
+        "ref": "refs/heads/main",
+        "rev": "afca060674b20e0ccecde2d6fe88c887790219a5",
+        "revCount": 1,
+        "type": "git",
+        "url": "https://git.jojodev.com/jolheiser/tailwind-ctp"
+      },
+      "original": {
+        "type": "git",
+        "url": "https://git.jojodev.com/jolheiser/tailwind-ctp"
+      }
     }
   },
   "root": "root",

flake.nix

@@ -2,38 +2,50 @@
   inputs = {
     nixpkgs.url = "github:nixos/nixpkgs";
     flake-utils.url = "github:numtide/flake-utils";
+    nur = {
+      url = "git+https://git.jojodev.com/jolheiser/nur";
+      inputs.nixpkgs.follows = "nixpkgs";
+    };
+    tailwind-ctp = {
+      url = "git+https://git.jojodev.com/jolheiser/tailwind-ctp";
+      inputs.nixpkgs.follows = "nixpkgs";
+    };
   };
 
   outputs = {
     self,
     flake-utils,
     nixpkgs,
-  }:
+    nur,
+    tailwind-ctp,
+  } @ inputs:
     flake-utils.lib.eachDefaultSystem (
       system: let
         pkgs = nixpkgs.legacyPackages.${system};
+        nur = inputs.nur.packages.${system};
+        tailwind-ctp = inputs.tailwind-ctp.packages.${system}.default;
       in {
-        packages.default = pkgs.stdenv.mkDerivation rec {
+        packages.default = pkgs.buildGoModule {
           pname = "jolheiser.com";
           version = "site";
           src = ./.;
-          offlineCache = pkgs.fetchYarnDeps {
-            yarnLock = "${src}/yarn.lock";
-            sha256 = "sha256-IF30H3ZXlKoyap7xJOD6tnZjCZ/U/VgWrCjj4fh6zyM=";
-          };
-
-          nativeBuildInputs = with pkgs; [yarn fixup_yarn_lock nodejs-slim];
-          postPatch = ''
-            export HOME=$NIX_BUILD_TOP/fake_home
-            yarn config --offline set yarn-offline-mirror $offlineCache
-            fixup_yarn_lock yarn.lock
-            yarn install --offline --frozen-lockfile --ignore-scripts --no-progress --non-interactive
-            patchShebangs node_modules/
+          vendorHash = "sha256-Go0L0GFpQj7lQt7z8+iHIyq6bmZkLH/H7iy6vXtYrUg=";
+          nativeBuildInputs = [nur.templ tailwind-ctp];
+          excludedPackages = ".";
+          postBuild = ''
+            go generate
+            mv dist $out
           '';
+        };
+        packages.default1 = pkgs.stdenv.mkDerivation {
+          pname = "jolheiser.com";
+          version = "site";
+          src = ./.;
+          nativeBuildInputs = with pkgs; [go nur.templ tailwind-ctp];
           buildPhase = ''
             runHook preBuild
 
-            yarn --offline build
+            go generate
             mv dist $out
 
             runHook postBuild
@@ -41,8 +53,9 @@
         };
         devShells.default = pkgs.mkShell {
           nativeBuildInputs = with pkgs; [
-            yarn
-            nodePackages.vscode-langservers-extracted
+            go
+            nur.templ
+            tailwind-ctp
           ];
         };
       }

go.mod

@@ -0,0 +1,9 @@
+module jolheiser.com
+
+go 1.20
+
+require (
+	git.jojodev.com/jolheiser/simpleicons v0.0.2
+	github.com/a-h/templ v0.2.334
+	gopkg.in/yaml.v3 v3.0.1
+)

go.sum

@@ -0,0 +1,9 @@
+git.jojodev.com/jolheiser/simpleicons v0.0.2 h1:F6RL6EEPimqNrxGC64i1R4nBLpBse/wyaAHf4DhC0fI=
+git.jojodev.com/jolheiser/simpleicons v0.0.2/go.mod h1:NIhFsYI7rALmUX37teVRzf8BJAv1XtZC1OGeVjmB/No=
+github.com/a-h/templ v0.2.334 h1:/mKupkgHGeSSeC0KiGRvmUoRGQJuku9VGVhRP1CeWgY=
+github.com/a-h/templ v0.2.334/go.mod h1:6Lfhsl3Z4/vXl7jjEjkJRCqoWDGjDnuKgzjYMDSddas=
+github.com/google/go-cmp v0.5.9 h1:O2Tfq5qg4qc4AmwVlvv0oLiVAGB7enBSJ2x2DqQFi38=
+gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405 h1:yhCVgyC4o1eVCa2tZl7eS0r+SDo693bJlVdllGtEeKM=
+gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
+gopkg.in/yaml.v3 v3.0.1 h1:fxVm/GzAzEWqLHuvctI91KS9hhNmmWOoWu0XTYJS7CA=
+gopkg.in/yaml.v3 v3.0.1/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=

justfile

@@ -1,3 +1,6 @@
 build:
 	@git add .
 	@nix build
+
+generate:
+	@go generate

links.yaml

@@ -0,0 +1,19 @@
+links:
+  - name: GitHub
+    url: https://github.com/jolheiser
+    icon: github
+  - name: Gitea
+    url: https://gitea.com/jolheiser
+    icon: gitea
+  - name: JoJoDev
+    url: https://git.jojodev.com/jolheiser
+    icon: gitea
+  - name: Mastodon
+    url: https://social.gitea.io/@jolheiser
+    icon: mastodon
+  - name: Bluesky
+    url: https://bsky.app/profile/jolheiser.com
+    icon: twitter
+  - name: LinkedIn
+    url: https://linkedin.com/in/jolheiser
+    icon: linkedin

main.go

@@ -0,0 +1,76 @@
+package main
+
+import (
+	"context"
+	"io"
+	"os"
+
+	"git.jojodev.com/jolheiser/simpleicons"
+	"github.com/a-h/templ"
+	"gopkg.in/yaml.v3"
+)
+
+type Link struct {
+	Name     string `yaml:"name"`
+	URL      string `yaml:"url"`
+	IconName string `yaml:"icon"`
+}
+
+func (l Link) Icon() simpleicons.Icon {
+	return simpleicons.Icons[l.IconName]
+}
+
+var tailwindCSS = `
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+`
+
+//go:generate templ generate
+//go:generate go run .
+//go:generate tailwind-ctp -i ./dist/styles.css -o ./dist/styles.css --minify
+func main() {
+	var links struct {
+		Links []Link `yaml:"links"`
+	}
+
+	fi, err := os.Open("links.yaml")
+	if err != nil {
+		panic(err)
+	}
+	defer fi.Close()
+	if err := yaml.NewDecoder(fi).Decode(&links); err != nil {
+		panic(err)
+	}
+
+	if err := os.MkdirAll("dist", os.ModePerm); err != nil {
+		panic(err)
+	}
+
+	html, err := os.Create("dist/index.html")
+	if err != nil {
+		panic(err)
+	}
+	defer html.Close()
+
+	err = index(links.Links).Render(context.Background(), html)
+	if err != nil {
+		panic(err)
+	}
+
+	css, err := os.Create("dist/styles.css")
+	if err != nil {
+		panic(err)
+	}
+	defer css.Close()
+	if _, err := css.WriteString(tailwindCSS); err != nil {
+		panic(err)
+	}
+}
+
+func SafeHTML(html string) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
+		_, err = io.WriteString(w, html)
+		return
+	})
+}

package.json

@@ -1,51 +0,0 @@
-{
-  "links": [
-    {
-      "name": "GitHub",
-      "url": "https://github.com/jolheiser",
-      "icon": "github"
-    },
-    {
-      "name": "Gitea",
-      "url": "https://gitea.com/jolheiser",
-      "icon": "gitea"
-    },
-    {
-      "name": "JoJoDev",
-      "url": "https://git.jojodev.com/jolheiser",
-      "icon": "gitea"
-    },
-    {
-      "name": "Mastodon",
-      "url": "https://social.gitea.io/@jolheiser",
-      "icon": "mastodon"
-    },
-    {
-      "name": "Bluesky",
-      "url": "https://bsky.app/profile/jolheiser.com",
-      "title": "Yes, I know that's the Twitter icon",
-      "icon": "twitter"
-    },
-    {
-      "name": "LinkedIn",
-      "url": "https://linkedin.com/in/jolheiser",
-      "icon": "linkedin"
-    }
-  ],
-  "scripts": {
-    "build:tailwind": "yarn tailwindcss -i ./src/styles.css -o ./dist/styles.css --minify",
-    "build:eleventy": "yarn eleventy",
-    "dev:tailwind": "yarn build:tailwind --watch",
-    "dev:eleventy": "yarn build:eleventy --serve",
-    "dev": "yarn run-p dev:*",
-    "build": "rm -rf dist; mkdir dist; cp src/* dist/; rm dist/styles.css; yarn build:tailwind; yarn build:eleventy"
-  },
-  "devDependencies": {
-    "@11ty/eleventy": "^2.0.1",
-    "@catppuccin/tailwindcss": "^0.1.6",
-    "npm-run-all": "^4.1.5",
-    "simple-icons": "^9.10.0",
-    "tailwindcss": "^3.3.3"
-  },
-  "license": "MIT"
-}

site.templ

@@ -0,0 +1,36 @@
+package main
+
+templ head() {
+	<head>
+		<title>jolheiser</title>
+		<meta charset="utf-8"/>
+		<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+		<link rel="shortcut icon" href="https://www.gravatar.com/avatar/7f4dd86f017ff289cf05a013e22357ef253d1ed6a52bdefca8f965af1080a965?s=16"/>
+		<meta name="author" content="jolheiser"/>
+		<link rel="stylesheet" href="styles.css"/>
+	</head>
+}
+
+func fill(hex string) string {
+	return "#" + hex
+}
+
+templ body(links []Link) {
+	<body class="latte dark:mocha bg-base">
+		<header class="relative w-full pt-16 pb-10">
+			<img class="mx-auto rounded-full" alt="avatar" src="https://www.gravatar.com/avatar/7f4dd86f017ff289cf05a013e22357ef253d1ed6a52bdefca8f965af1080a965?s=125"/>
+			<p class="mt-2 text-xl text-center text-lavender">{ `@` }jolheiser</p>
+		</header>
+		<nav class="relative max-w-screen-sm mx-auto">
+			for _, link := range links {
+				<a class="flex relative px-3 py-2 my-6 h-16 text-lg items-center justify-center text-text bg-surface0 cursor-pointer rounded border-solid border-2 border-overlay0 hover:bg-surface2 hover:border-lavender hover:text-blue transition" href={ templ.SafeURL(link.URL) } rel="me noopener noreferrer" title={ link.Name } target="_blank"><svg class="absolute left-5 w-10 h-10" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>{ link.Icon().Title }</title><path fill={ fill(link.Icon().Hex) } d={ link.Icon().Path }></path></svg><span>{ link.Name }</span></a>
+			}
+		</nav>
+	</body>
+}
+
+templ index(links []Link) {
+	@head()
+	@body(links)
+}
+

site_templ.go

@@ -0,0 +1,174 @@
+// Code generated by templ@(devel) DO NOT EDIT.
+
+package main
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import "context"
+import "io"
+import "bytes"
+
+func head() templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
+		templBuffer, templIsBuffer := w.(*bytes.Buffer)
+		if !templIsBuffer {
+			templBuffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templBuffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		var_1 := templ.GetChildren(ctx)
+		if var_1 == nil {
+			var_1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, err = templBuffer.WriteString("<head><title>")
+		if err != nil {
+			return err
+		}
+		var_2 := `jolheiser`
+		_, err = templBuffer.WriteString(var_2)
+		if err != nil {
+			return err
+		}
+		_, err = templBuffer.WriteString("</title><meta charset=\"utf-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><link rel=\"shortcut icon\" href=\"https://www.gravatar.com/avatar/7f4dd86f017ff289cf05a013e22357ef253d1ed6a52bdefca8f965af1080a965?s=16\"><meta name=\"author\" content=\"jolheiser\"><link rel=\"stylesheet\" href=\"styles.css\"></head>")
+		if err != nil {
+			return err
+		}
+		if !templIsBuffer {
+			_, err = templBuffer.WriteTo(w)
+		}
+		return err
+	})
+}
+
+func fill(hex string) string {
+	return "#" + hex
+}
+
+func body(links []Link) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
+		templBuffer, templIsBuffer := w.(*bytes.Buffer)
+		if !templIsBuffer {
+			templBuffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templBuffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		var_3 := templ.GetChildren(ctx)
+		if var_3 == nil {
+			var_3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		_, err = templBuffer.WriteString("<body class=\"latte dark:mocha bg-base\"><header class=\"relative w-full pt-16 pb-10\"><img class=\"mx-auto rounded-full\" alt=\"avatar\" src=\"https://www.gravatar.com/avatar/7f4dd86f017ff289cf05a013e22357ef253d1ed6a52bdefca8f965af1080a965?s=125\"><p class=\"mt-2 text-xl text-center text-lavender\">")
+		if err != nil {
+			return err
+		}
+		var var_4 string = `@`
+		_, err = templBuffer.WriteString(templ.EscapeString(var_4))
+		if err != nil {
+			return err
+		}
+		var_5 := `jolheiser`
+		_, err = templBuffer.WriteString(var_5)
+		if err != nil {
+			return err
+		}
+		_, err = templBuffer.WriteString("</p></header><nav class=\"relative max-w-screen-sm mx-auto\">")
+		if err != nil {
+			return err
+		}
+		for _, link := range links {
+			_, err = templBuffer.WriteString("<a class=\"flex relative px-3 py-2 my-6 h-16 text-lg items-center justify-center text-text bg-surface0 cursor-pointer rounded border-solid border-2 border-overlay0 hover:bg-surface2 hover:border-lavender hover:text-blue transition\" href=\"")
+			if err != nil {
+				return err
+			}
+			var var_6 templ.SafeURL = templ.SafeURL(link.URL)
+			_, err = templBuffer.WriteString(templ.EscapeString(string(var_6)))
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString("\" rel=\"me noopener noreferrer\" title=\"")
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString(templ.EscapeString(link.Name))
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString("\" target=\"_blank\"><svg class=\"absolute left-5 w-10 h-10\" role=\"img\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><title>")
+			if err != nil {
+				return err
+			}
+			var var_7 string = link.Icon().Title
+			_, err = templBuffer.WriteString(templ.EscapeString(var_7))
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString("</title><path fill=\"")
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString(templ.EscapeString(fill(link.Icon().Hex)))
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString("\" d=\"")
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString(templ.EscapeString(link.Icon().Path))
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString("\"></path></svg><span>")
+			if err != nil {
+				return err
+			}
+			var var_8 string = link.Name
+			_, err = templBuffer.WriteString(templ.EscapeString(var_8))
+			if err != nil {
+				return err
+			}
+			_, err = templBuffer.WriteString("</span></a>")
+			if err != nil {
+				return err
+			}
+		}
+		_, err = templBuffer.WriteString("</nav></body>")
+		if err != nil {
+			return err
+		}
+		if !templIsBuffer {
+			_, err = templBuffer.WriteTo(w)
+		}
+		return err
+	})
+}
+
+func index(links []Link) templ.Component {
+	return templ.ComponentFunc(func(ctx context.Context, w io.Writer) (err error) {
+		templBuffer, templIsBuffer := w.(*bytes.Buffer)
+		if !templIsBuffer {
+			templBuffer = templ.GetBuffer()
+			defer templ.ReleaseBuffer(templBuffer)
+		}
+		ctx = templ.InitializeContext(ctx)
+		var_9 := templ.GetChildren(ctx)
+		if var_9 == nil {
+			var_9 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		err = head().Render(ctx, templBuffer)
+		if err != nil {
+			return err
+		}
+		err = body(links).Render(ctx, templBuffer)
+		if err != nil {
+			return err
+		}
+		if !templIsBuffer {
+			_, err = templBuffer.WriteTo(w)
+		}
+		return err
+	})
+}

src/index.html

@@ -1,35 +0,0 @@
-<html>
-
-<head>
-  <title>jolheiser</title>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <link rel="shortcut icon"
-    href="https://www.gravatar.com/avatar/7f4dd86f017ff289cf05a013e22357ef253d1ed6a52bdefca8f965af1080a965?s=16" />
-
-  <meta name="author" content="jolheiser" />
-
-  <link rel="stylesheet" href="styles.css" />
-
-</head>
-
-<body class="latte dark:mocha bg-base">
-
-  <header class="relative w-full pt-16 pb-10">
-    <img class="mx-auto rounded-full" alt="avatar"
-      src="https://www.gravatar.com/avatar/7f4dd86f017ff289cf05a013e22357ef253d1ed6a52bdefca8f965af1080a965?s=125" />
-    <p class="mt-2 text-xl text-center text-lavender">@jolheiser</p>
-  </header>
-
-  <nav class="relative max-w-screen-sm mx-auto">
-    {% for link in pkg.links %}
-    <a class="flex relative px-3 py-2 my-6 h-16 text-lg items-center justify-center text-text bg-surface0 cursor-pointer rounded border-solid border-2 border-overlay0 hover:bg-surface2 hover:border-lavender hover:text-blue transition"
-      href="{{ link.url }}" rel="me noopener noreferrer" {% if link.title %}title="{{ link.title }}" {% endif %}
-      target="_blank"><svg class="absolute left-5 w-10 h-10" role="img" viewBox="0 0 24 24"
-        xmlns="http://www.w3.org/2000/svg">{% icon link.icon
-        %}</svg><span>{{ link.name }}</span></a>
-    {% endfor %}
-  </nav>
-</body>
-
-</html>

src/styles.css

@@ -1,4 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-

tailwind.config.js

@@ -1,6 +1,6 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: ["./src/*.html"],
+  content: ["./dist/*.html"],
   theme: {
     extend: {},
   },