Website

一款极简风格的个人主页

✨ 技术栈

• 🍔 Next.JS（React）
• 🥯 ISR（On-demand Revalidation）
• 🥪 TypeScript
• 🍟 Prisma（MySQL）
• 🍣 Docker

🖥 兼容环境

Edge	Firefox	Chrome	Safari
Edge	last 2 versions	last 2 versions	last 2 versions

👮 环境变量 Environment

# MYSQL
DATABASE_URL = mysql://root:xxx@@localhost:3306/website

# JWT SECRET
SECRET = xxx

# Next.js <Image/> component loading address prefix
# https://nextjs.org/docs/app/api-reference/components/image#remotepatterns
NEXT_PUBLIC_IMAGE_BASE_URL = http://127.0.0.1:3000

👷 本地开发 Development

# 注：npx prisma db push 是 Prisma初始化数据库表的命令，开发环境仅需运行一次
$ git clone https://github.com/world56/website.git
$ cd website
$ npm install
$ npx prisma db push
$ npm run dev

打开浏览器访问 http://127.0.0.1:3000

🧑‍💼 打包部署 Production

⚠️ next.js ISG页面是在构建(next build)时生成的，生产环境中，控制台页面的任意编辑操作，都会自动触发相关页面的ISR按需生成。

Docker

# 注：docker run 命令需要根据实际情况自行调整 数据卷、环境变量等参数。
$ npm run build
$ docker build -t website:0.1 .
$ docker run -d -p 1000:3000 --name website -v ~/app/website/resource:/app/resource -e DATABASE_URL=mysql://root:xxx@@localhost:3306/website -e SECRET=xxx -e NEXT_PUBLIC_IMAGE_BASE_URL=http://192.168.xx.xxx website:0.1

PM2

# 注：默认您已全局安装pm2
$ npm run build
$ pm2 start pm2.json

🙏 特别鸣谢 Special Thanks

本项目UI灵感来源于@codewithsadee，和他优秀的开源项目 vcard-personal-portfolio，感谢他的付出与开源精神。
The UI inspiration for this project come from @codewithsadee and his outstanding open-source project vcard-personal-portfolio. Grateful for his dedication and open-source spirit.