Merge pull request #475 from mloberg/build/hugo

build: switch to hugo

.github/workflows/publish.yaml

@@ -0,0 +1,64 @@
+name: Publish
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: config
+        id: config
+        run: |
+          name=$(basename "${{ github.head_ref || github.ref }}")
+          echo "name=$name" >> "$GITHUB_OUTPUT"
+
+          if [ "$name" != "main" ]; then
+            echo "hugo=--baseURL \"https://${name}.mloberg.pages.dev\"" >> "$GITHUB_OUTPUT"
+            echo "wrangler=--branch=${name}" >> "$GITHUB_OUTPUT"
+          fi
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0 # for .GitInfo and .Lastmod
+      - uses: actions/setup-node@v4
+        with:
+          node-version-file: package.json
+          cache: npm
+      - run: npm ci
+      - run: npm run lint
+      - uses: peaceiris/actions-hugo@v3
+        with:
+          hugo-version: '0.141.0'
+          extended: true
+      - run: hugo build --gc --minify ${{ steps.config.outputs.hugo }}
+      - uses: actions/upload-artifact@v4
+        with:
+          name: site
+          path: public/
+      - uses: anishathalye/proof-html@v2
+        with:
+          directory: ./public
+          swap_urls: |
+            {"^https:\\/\\/mlo\\.io\\/": "/", "^https:\\/\\/.*\\.pages\\.dev\\/": "/"}
+    outputs:
+      wrangler: ${{ steps.config.outputs.wrangler }}
+  deploy:
+    runs-on: ubuntu-latest
+    needs: build
+    permissions:
+      contents: read
+      deployments: write
+    steps:
+      - uses: actions/download-artifact@v4
+        with:
+          name: site
+          path: public
+      - uses: cloudflare/wrangler-action@v3
+        with:
+          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          gitHubToken: ${{ secrets.GITHUB_TOKEN }}
+          command: pages deploy public --project-name=mloberg ${{ needs.build.outputs.wrangler }}

.gitignore

@@ -15,3 +15,10 @@
 # Infra
 /infra/.terraform
 /infra/.tfplan
+
+# Hugo
+/public/
+/resources/_gen/
+/assets/jsconfig.json
+hugo_stats.json
+/.hugo_build.lock

.prettierignore

@@ -1,11 +1,4 @@
 dist
-vendor
-
+public
+src
 *.md
-
-src/assets
-src/feed.json
-src/_layouts/archive.html
-src/_layouts/category.html
-src/_layouts/compress.html
-src/_layouts/home.html

README.md

@@ -1,18 +1,3 @@
 # mlo.io
 
-Jekyll site for [mlo.io](https://mlo.io)
-
-## development
-
-    make setup
-    make dev
-
-## writing a new post
-
-1. `make draft`
-2. Write
-3. Find a hero image (usually from [Unsplash](https://unsplash.com/))
-4. Generate hero images (`bin/hero IMAGE`)
-5. Optimize images (`npm run optimize`)
-6. Publish the draft (`bin/publish [path]`)
-7. Commit & push
+My personal website built with [Hugo](https://gohugo.io/).

assets/css/app.css → assets/css/main.css

@@ -8,8 +8,8 @@
   src:
     local('Raleway'),
     local('Raleway-Regular'),
-    url('/assets/fonts/raleway.woff2') format('woff2'),
-    url('/assets/fonts/raleway.woff') format('woff');
+    url('/fonts/raleway.woff2') format('woff2'),
+    url('/fonts/raleway.woff') format('woff');
 }
 
 @font-face {
@@ -20,8 +20,8 @@
   src:
     local('Montserrat Regular'),
     local('Montserrat-Regular'),
-    url('/assets/fonts/montserrat.woff2') format('woff2'),
-    url('/assets/fonts/montserrat.woff') format('woff');
+    url('/fonts/montserrat.woff2') format('woff2'),
+    url('/fonts/montserrat.woff') format('woff');
 }
 
 h6 {
@@ -70,7 +70,7 @@ h1 {
 }
 
 .old-post-warning {
-  @apply mt-6 border-l-4 border-amber-700 bg-amber-300 py-4 px-6 italic text-amber-900;
+  @apply mt-6 border-l-4 border-amber-700 bg-amber-300 px-6 py-4 italic text-amber-900;
 }
 
 @tailwind components;

assets/js/names.js → assets/js/name.js

@@ -807,9 +807,10 @@ const right = [
   'zhukovsky',
 ];
 
-window.generateName = () => {
+(() => {
+  const dom = document.getElementById('js-generated-name');
   const li = Math.floor(Math.random() * left.length);
   const ri = Math.floor(Math.random() * right.length);
 
-  return `${left[li]}.${right[ri]}`;
-};
+  dom.innerHTML = `${left[li]}.${right[ri]}`;
+})();