Technical Architecture
Core Stack
- Framework: Next.js 15 (App Router)
- Language: TypeScript
- Styling: Tailwind CSS 4
- CMS: Notion Database
Cloud & AI
- Hosting: Cloudflare Pages
- Serverless: Cloudflare Pages Functions
- AI Model: Llama-3-8b-instruct
- Comments: Giscus (GitHub Discussions)
System Architecture
Key Features Implementation
🤖 AI-Powered Translation
The blog uses Cloudflare Workers AI to automatically translate articles. When triggered, a serverless function fetches the content from Notion, processes it with Llama-3, and creates a new localized entry in a dedicated Notion database. This ensures high performance as translations are statically generated.
⚡ Static Site Generation (SSG)
To ensure maximum speed and SEO performance, the entire blog is pre-rendered at build time. Dynamic features like search and comments are handled client-side, while content delivery is instant via Cloudflare's CDN.
🔄 Intelligent Synchronization
Content is managed entirely in Notion. A custom build script fetches data, optimizes images, and generates the necessary static files. This separation allows for a user-friendly writing experience with a developer-friendly deployment pipeline.