Overview
yaokai.me 是我的个人网站，也是一套小型内容系统。它负责展示简历、真实项目、文章和联系入口，后台可以管理文章、项目、动态和留言。
Loading content
Personal site / CMS
yaokai.me Personal Site and CMS
The site you are reading. Built with Next.js 16 and Prisma, with three languages, writing, work, resume, contact form and admin CMS.
This siteInformation architecture, visual design, full-stack implementation, CMS, deploy scripts and operations
Tech Stack
Next.js 16ReactTypeScriptPrismaTailwind CSSi18nNginxLightsail
My Role
Information architecture, visual design, full-stack implementation, CMS, deploy scripts and operations
Problem
The site needed to support job search, project proof, writing and contact in one place, with reliable language switching.
Solution
I built the frontend and CMS with Next.js + Prisma, simplified navigation, and centered the story on Machi and Shangence.
Result
A maintainable personal site and CMS with public source code and room for ongoing writing.
My Role
- 首页重构
- 三语文案
- 作品与简历整合
- 后台 CMS
- 部署脚本
- SEO 与 sitemap
Problem
- 语言切换状态
- 真实作品取舍
- 后台与前台边界
- 生产部署安全
Solution
- 基于路径和 cookie 的 locale
- 保留文章后台
- 隐藏不必要页面入口
- 部署时保留生产数据
Architecture
Next.js App Router 负责页面；Prisma 管理内容；proxy 根据语言前缀写入请求头；部署脚本打包上传到服务器并保留生产环境变量和数据库。
- Next.js 16
- React
Background
yaokai.me is my personal site and a small CMS I use myself. It brings together my resume, projects, writing and contact flow.
Stack
- Next.js 16 / React / TypeScript
- Prisma CMS
- Tailwind CSS
- Path + cookie based language switching
- Deployment scripts
Takeaway
This redesign was less about adding pages and more about removing noise: I wanted the site to clearly say that I build Machi and Shangence, and that I can carry a Web product from idea to production.
