❒ @inksafari/engawa

@inksafari's personal, rarely-updated blog.

backlog

• cjk
  • webfont
• description
• chat bubbles
• page transitions
• unit/e2e tests
• fonts optimization at build time (subfont).
• image manipulation ( w/ Picture component )
  • resizing
  • lazy loading with blurred placeholders
  • zoom
• post series
• style guide ( 參考 / 程式碼 )
• embeds
• shelf
• callouts

(back to top)

Features

• Built with Astro and JavaScript.
  • Component Framework: Svelte
• Uses Content Collections with Zod schemas.
• Markdown & MDX support.
• Atom/JSON Feed support.
• Pagefind static search library integration.
• Uses Expressive Code via remark-expressive-code (with default themes) for syntax highlighting.

(back to top)

Commands

All commands are run from the root of the project, from a terminal:

Command	Action
bunx astro telemetry disable	Disable data collection
bun install	Installs dependencies
bun dev	Starts local dev server at localhost:8081
bun build:prod	Build your production site to ./dist/
bun preview	Preview your build locally, before deploying
bun fmt	Format your code with Biome

(back to top)

Configuration

• .env
• consts.ts
• Me.astro
• Header.astro
• Footer.astro
  • Year.svelte
• emailDisplay.svelte
• Favicon.astro
• generateRssFeed.js
• get-updatetime.mjs
• new.mjs
• readImage.mjs
• generateLqip.mjs
• Modify the files in the /public folder:
  • favicon
  • robots.txt -> update the Sitemap url to your own domain

Setup .env

VITE_SITE_DOMAIN="example.net"
VITE_SITE_URL="https://example.net"
VITE_SITE_PORT=8081

(back to top)

Frontmatter

In src/content/then/yyyy-MM-dd_slug.mdx:

---
title: "Title of the Post"
excerpt: "This blog post is not yet ready to be seen by the world"
slug: "hello_world"
publishDate: 2021-09-07T06:59:48+09:00
updatedDate: 2022-05-10T11:01:01+08:00
isIndex: false
isDraft: true
---

title, slug and publishDate are required for all posts.

(back to top)

Credits

• Inspired by
  • boucheron.org
  • tonydang.blog (layouts & now page)
  • Silvia Maggi (colophon page)
  • naiyerasif/site (syntax highlighting)
• Watercolor texture by Freepik.
• SVG icons:
  • SVG Repo
  • Feather icons
• Demo content generate with ChatGPT
• Images for demo content from Unsplash

(back to top)

License

• All images and media are copyright to their respective owners.
• Font licenses: Open Font License (OFL)
  • LXGW Bright TC (Chinese and English font)
  • Lotion (monospaced code font)