Next.jsReact后台

afro-hair-salon-website — Next.js 后台模板

作者 therealodineye

Constance's Hair Art 的 Next.js 14 生产网站模板，包含 AI 聊天机器人、在线预约、Google 日历同步、Instagram 动态、管理后台与基于 Markdown 的知识库，使用 SQLite/Prisma 存储数据，通过 Docker Compose 部署。

打开源站下载源码 ZIP

看看你的网站会是什么样

浏览真实页面截图，比较内容排版与手机效果。点击下方缩略图切换，放大查看整页细节。

3 个预览视图

桌面端首页1 / 3

访问演示网站在新标签页打开

桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 3

截图用于了解视觉与布局，交互效果请以实际项目为准。

采集于 2026-10-14查看来源

值得关注的模板亮点

从已有项目资料中，快速了解它的特点。

AI 聊天机器人基于 Google Gemini 2.0 Flash，支持挪威语与英语自动识别，并可转接至 Telegram 人工客服

在线预约系统带邮件确认，并通过 Google Calendar API 实现双向同步

管理后台位于 /admin，首次登录后需立即修改密码

RAG 知识库由 /data 下的 Markdown 文件驱动，可编辑后通过 docker cp 热更新，无需完整重建

技术栈包括 Next.js 14 App Router、TypeScript、Tailwind CSS、SQLite/Prisma 7、NextAuth.js v4

通过 Docker Compose 部署，站点运行在 8081 端口，凭据存放于 gitignore 的 .env 中

模板详细介绍

该仓库是位于挪威斯塔万格的非洲发型沙龙 Constance's Hair Art 的私有生产网站，同时公开了不含凭据的开源模板。README 说明其技术栈为 Next.js 14（App Router）、TypeScript、Tailwind CSS、SQLite（通过 Prisma 7）、NextAuth.js v4、Google Gemini 2.0 Flash、Telegram Bot API、Nodemailer（Gmail SMTP）、Google Calendar API，并以 Docker 与 Docker Compose 容器化。功能包括：支持挪威语与英语自动识别的 AI 聊天机器人，可将对话转接至 Telegram 人工客服；带邮件确认的在线预约系统；Google 日历双向同步；Instagram 动态集成；位于 /admin 的管理后台；以及位于 /data 的 Markdown RAG 知识库。README 还提到速率限制、安全响应头和 httpOnly 会话 Cookie。

部署方面，README 给出 docker compose up -d --build 构建启动、docker compose restart 重启以及 docker logs hair-art -f 查看日志的命令，并说明站点运行在 8081 端口。所有凭据放在被 gitignore 的 .env 中，可参考 .env.example 填写所需变量。Telegram Webhook 需在部署或域名变更后通过 curl 注册一次，客服可在 Telegram 中使用 /reply <session-id-8-chars> 回复客户。知识库可直接编辑 /data 下的 services.md、prices.md、faq.md、opening_hours.md、contact.md，并通过 docker cp 热更新单个文件而无需完整重建。本地开发步骤为 npm install、复制 .env.example 为 .env 并填写、npx prisma migrate dev、npm run db:seed、npm run dev。管理后台位于 /admin，首次登录后应立即修改密码。

README 未提供关于性能、可扩展性、测试覆盖、浏览器兼容性或生产就绪程度的说明，也未列出具体依赖版本号（除框架与库的主版本外）。预览截图仅证明桌面端与移动端页面存在，不代表具体功能。

Next.js后台

适合你的项目吗？

适用场景

为非洲发型沙龙搭建包含在线预约与 AI 客服的网站
需要将聊天机器人无法处理的问题转接至 Telegram 人工客服的场景
希望用 Markdown 文件维护服务、价格、FAQ 等知识库内容，避免改代码
需要将预约与 Google 日历双向同步的沙龙或工作室
使用 Docker Compose 在自有服务器上部署 Next.js 应用

适合人群

熟悉 Next.js、TypeScript 与 Docker 的开发者
需要预约、AI 客服与人工转接功能的沙龙或服务型商家
希望以 Markdown 维护知识库内容、减少代码改动的运营团队
需要将预约同步至 Google 日历的商家

上手与定制指南

结合仓库当前版本的说明，按下面的资料检查内容、配置与运行要求。

1
本地开发：npm install，复制 .env.example 为 .env 并填写，执行 npx prisma migrate dev、npm run db:seed、npm run dev
2
部署：docker compose up -d --build 构建并启动，docker compose restart 重启，docker logs hair-art -f 查看日志，站点运行在 8081 端口
3
所有凭据放在 .env（已被 gitignore），参考 .env.example 填写所需变量
4
部署或域名变更后需通过 curl 向 Telegram 注册 Webhook，并设置 secret_token 与 allowed_updates
5
知识库修改 /data 下的 Markdown 文件后，可用 docker cp 更新单个文件而无需完整重建；管理后台首次登录后应立即修改密码

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本；免费范围为该版本代码，不代表外部服务或第三方素材免费。

使用时需要遵守

允许免费使用、修改、商用和分发该版本代码。
分发代码副本或实质性部分时，保留原作者版权声明和完整 MIT 许可声明。
代码按现状提供；担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

演示图片、字体、图标及其他第三方素材需按各自许可核对，不能仅凭代码的 MIT 许可判断。
域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
所有凭据必须放在 .env 文件中，该文件已被 gitignore，不会提交到仓库；需自行准备并填写所需的环境变量。
需参考 .env.example 填写所需的环境变量，缺少这些凭据将无法正常运行。
部署或域名变更后，必须通过 curl 向 Telegram 注册 Webhook 才能使用人工客服转接功能。
首次登录管理后台后应立即修改默认密码。
本地开发需将 .env.example 复制为 .env 并填写实际值。

查看原文依据

Permission is hereby granted, free of charge
许可证原文

All credentials are in `.env` (gitignored — never committed).
README 原文

Copy `.env.example` for reference on required variables.
README 原文

Register once after deploy or domain change:
README 原文

Change password immediately after first login.
README 原文

cp .env.example .env # fill in values
README 原文

https://github.com/therealodineye/afro-hair-salon-website/blob/main/LICENSE https://github.com/therealodineye/afro-hair-salon-website/blob/main/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-14。结果仅覆盖已读取资料，依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台: GitHub
资料与维护参考分: 资料较完整 · 80 / 100
技术栈: Next.js · React
网站类型: 后台

这个分数如何计算

本站按许可资料（最高30分）、演示链接（12分）、预览图（10分）、Star数（15分）、记录的维护时间（15分）、描述完整度（8分）、功能记录（5分）和分类资料（5分）计算。它不是代码、安全或性能测试，也不是 Google 评分；有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间: 2026-09-08
截图检查日期: 2026-10-14

已收录演示链接。请用你的内容与屏幕尺寸检查；有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Next.js。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料，不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

审核声明: codex-user-requested-batch-review-20261015 · 2026-10-15

查看当时使用的来源资料

SHA-256: e04c0d97092c8b43d97da47d31e8313549af173eb505d3bce6625dd98c588240

2026-10-14T19:03:12.542Z

来源文件 / 仓库

# Constance's Hair Art — Production Website

> **Live site:** [constancehairart.com](https://constancehairart.com)

Private production repository for **Constance's Hair Art** — a premium African hair salon in Stavanger, Norway.

**Developed by [TheRealOdinEYE](https://github.com/TheRealOdinEYE)**

> Public open-source template (no credentials): [afro-hair-salon-website](https://github.com/therealodineye/afro-hair-salon-website)

---

## Stack

| Layer | Technology |
|---|---|
| Framework | Next.js 14 (App Router) |
| Language | TypeScript |
| Styling | Tailwind CSS |
| Database | SQLite via Prisma 7 |
| Auth | NextAuth.js v4 |
| AI Chatbot | Google Gemini 2.0 Flash |
| Human Handoff | Telegram Bot API |
| Email | Nodemailer (Gmail SMTP) |
| Calendar | Google Calendar API |
| Container | Docker + Docker Compose |

---

## Features

- AI chatbot (Norwegian + English auto-detect) with human handoff to Telegram
- Online booking system with email confirmations
- Google Calendar two-way sync
- Instagram feed integration
- Admin panel at `/admin`
- RAG knowledge base (markdown files in `/data`)
- Rate limiting, security headers, httpOnly session cookies

---

## Deployment

```bash
# Build and start
docker compose up -d --build

# Restart without rebuild
docker compose restart

# View logs
docker logs hair-art -f
```

Site runs on **port 8081**.

---

## Environment

All credentials are in `.env` (gitignored — never committed).  
Copy `.env.example` for reference on required variables.

---

## Telegram Webhook

Register once after deploy or domain change:

```bash
curl -X POST "https://api.telegram.org/bot<TOKEN>/setWebhook" \
  -d "url=https://constancehairart.com/api/chat/telegram-webhook" \
  -d "secret_token=<TELEGRAM_WEBHOOK_SECRET>" \
  -d "allowed_updates=[\"message\"]"
```

Reply to customers from Telegram:
```
/reply <session-id-8-chars> Your message here
```

---

## Knowledge Base

Edit markdown files in `/data` — no code changes needed:

| File | Contents |
|---|---|
| `data/services.md` | Services and descriptions |
| `data/prices.md` | Pricing table |
| `data/faq.md` | FAQ (Norwegian + English) |
| `data/opening_hours.md` | Hours and booking policy |
| `data/contact.md` | Address and directions |

Apply changes without full rebuild:
```bash
docker cp data/services.md hair-art:/app/data/services.md
```

---

## Admin Panel

URL: `/admin`  
Change password immediately after first login.

---

## Local Development

```bash
npm install
cp .env.example .env   # fill in values
npx prisma migrate dev
npm run db:seed
npm run dev
```

---

## License

MIT © [TheRealOdinEYE](https://github.com/TheRealOdinEYE)

反馈内容错误