hoelee
f4008d9e8b
Deploy / build (push) Failing after 13m52s
Found a real bug while verifying the nav search: /pagefind/pagefind.js is an ES
module that defines no window.Pagefind, but Search.astro loaded it with a classic
<script src> and read window.Pagefind — so every query answered "Search is
unavailable." (confirmed live before the fix). Now a dynamic import; the specifier
must be a variable or Rollup resolves it at build time and the build fails.
Measured before/after in a real browser:
- archive /posts/ + /zh/posts/: 18,220px -> 3,788px (71 rows at 44px, grouped by
year) with a client-side filter (title/tags/description text, category chips,
14 tag chips, zero requests). Tested: "nginx" -> 6 rows, chip devops -> 28.
- tag pages for tags with >= 3 posts. Measured 235 distinct tags (an earlier brief
claimed 74), 156 used exactly once — pages only where a topic exists: 40 tags ->
80 pages, build 165 -> 245 pages. Pills link only when a page exists.
- homepage + ZH homepage: hero (288px) with the real scale claim, three CTAs, a
fixed Featured 4 (scale -> automation -> observability -> a delivered result),
Latest 10 -> 6. ZH hero had linked "关于我" to the English /about/.
- long code blocks collapse above 420px with an Expand button + gradient, copy
button still copies the whole block (verified on the 1010px block).
- search is visible ("⌕ Search /" pill, "/" plus the existing Ctrl/Cmd+K) and the
zero-result screen offers topic chips instead of a dead end.
Docs: project-state B3 entry, ops-runbook Pagefind gotcha.
67 lines
2.6 KiB
Plaintext
67 lines
2.6 KiB
Plaintext
---
|
|
import BaseLayout from '../layouts/BaseLayout.astro';
|
|
import PostList from '../components/PostList.astro';
|
|
import { getCollection } from 'astro:content';
|
|
import { isEn } from '../lib/lang';
|
|
import { SITE } from '../config';
|
|
import { sortForListing } from '../lib/sort';
|
|
|
|
const posts = sortForListing(await getCollection('posts', isEn));
|
|
|
|
// Featured picks: fixed slugs, not "newest 4", so the front page stays stable after a
|
|
// publish and keeps answering "who is this and what has he actually run" (scale →
|
|
// automation → observability → a delivered business result). Falls back to the newest
|
|
// posts if a slug ever disappears.
|
|
const FEATURED_SLUGS = [
|
|
'running-production-infrastructure-solo',
|
|
'loop-engineering-without-a-coding-agent',
|
|
'one-prometheus-for-unraid-synology-and-a-vps',
|
|
'self-healing-digital-goods-entitlements',
|
|
];
|
|
const bySlug = new Map(posts.map((p) => [p.slug, p]));
|
|
const featured = FEATURED_SLUGS.map((s) => bySlug.get(s)).filter(Boolean);
|
|
const featuredPosts = featured.length === 4 ? featured : posts.slice(0, 4);
|
|
---
|
|
|
|
<BaseLayout title={SITE.title} description={SITE.description} altLocaleUrl={`${SITE.url}/zh/`}>
|
|
<section class="hero">
|
|
<h1>{SITE.author} — full-stack developer & DevOps engineer</h1>
|
|
<p class="hero-sub">
|
|
I run <strong>162 containers across three self-managed hosts</strong> — client sites, a
|
|
mail platform, CI/CD, workflow automation and this blog — and I build web systems for
|
|
Malaysian SMEs. I write up what broke, what the evidence said, and how I fixed it.
|
|
</p>
|
|
<p class="hero-cta">
|
|
<a class="btn btn-primary" href="#featured">Read the engineering case studies ↓</a>
|
|
<a class="btn" href="/about/">Hiring? Profile & stack →</a>
|
|
<a class="btn" href={SITE.website} target="_blank" rel="noopener">Malaysian SME? How I work ↗</a>
|
|
</p>
|
|
<p class="hero-note">
|
|
{posts.length} posts in English and 中文 · <a href="/rss.xml">RSS</a>
|
|
</p>
|
|
</section>
|
|
|
|
<section id="featured">
|
|
<h2>Featured</h2>
|
|
<div class="featured-grid">
|
|
{featuredPosts.map((p) => (
|
|
<a class="featured-card" href={`/posts/${p.slug}/`}>
|
|
<span class="featured-badge">{p.data.category}</span>
|
|
<h3>{p.data.title}</h3>
|
|
<p>{p.data.description}</p>
|
|
</a>
|
|
))}
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>Latest posts</h2>
|
|
{posts.length === 0 ? (
|
|
<p><em>No posts yet — check back soon.</em></p>
|
|
) : (
|
|
<PostList posts={posts} limit={6} />
|
|
)}
|
|
<p class="archive-meta"><a href="/posts/">All {posts.length} posts</a> · <a href="/tags/docker/">tag pages</a></p>
|
|
</section>
|
|
</BaseLayout>
|