# Website Ngự Long Y Quán: đưa la bàn dưỡng sinh 3D và sơ đồ kinh lạc lên web

Website phòng khám Y học cổ truyền Ngự Long Y Quán với thẩm mỹ cuộn thư cổ phong, la bàn dưỡng sinh 12 canh giờ 3D, bản đồ huyệt vị tương tác và cổng MCP xuất bản bài viết.

Phần lớn website phòng khám tại Việt Nam hiện nay đều đi theo một khuôn mẫu giống nhau: nền trắng xanh bệnh viện, ảnh kho có sẵn và hàng loạt biểu mẫu giục để lại số điện thoại. Khi nhận bài toán xây dựng hệ thống website cho **Phòng khám chuyên khoa Y học cổ truyền Ngự Long Y Quán** (An Khánh, Hoài Đức, Hà Nội), mình chọn một hướng đi khác hẳn: làm sao để người đọc vừa mở trang ra đã cảm nhận được sự tĩnh tại, ấm áp của một y quán phương Đông mà vẫn tra cứu được kiến thức y lý rõ ràng, minh bạch.

Từ ý tưởng đó, toàn bộ giao diện [ngulongyquan.com](https://www.ngulongyquan.com) được thiết kế theo tinh thần **Y gia cổ phong**: nền giấy tuyên ấm (`#FAF6EE`), mực tàu trầm (`#1F1A17`), điểm xuyết sắc đỏ chu sa của ấn chương (`#8C1D18`) và đường viền vàng đồng cổ điển (`#C59B27`).

## La bàn Dưỡng sinh 12 canh giờ 3D và Bản đồ Kinh lạc tương tác

Để kiến thức dưỡng sinh Đông y không dừng lại ở những trang chữ dài khô khan, mình đưa vào website hai cụm tương tác trực quan ngay trên trình duyệt.

Cụm thứ nhất nằm trên trang chủ là **La bàn Dưỡng sinh Canh giờ 3D** viết bằng Three.js. Theo học thuyết Tý Ngọ Lưu Chú của Đông y, mỗi canh giờ (kéo dài 2 tiếng từ giờ Tý 23:00-01:00 đến giờ Hợi 21:00-23:00) tương ứng với thời điểm khí huyết thịnh nhất ở một tạng phủ trong 12 đường kinh chính.

![La bàn Dưỡng sinh Canh giờ 3D tương tác theo 12 canh giờ Tý - Hợi trên trang chủ Ngự Long Y Quán](/media/2026/11/ba84b38f7eb4-nlyq-la-ban-3d.jpg)

Khi người đọc mở trang vào bất kỳ giờ nào trong ngày, chiếc la bàn 3D tự động xoay về đúng canh giờ hiện tại, làm sáng quẻ kinh mạch tương ứng và hiển thị lời khuyên dưỡng sinh vừa sức cho khung giờ đó. Người dùng cũng có thể chạm vào từng cung giờ trên mặt la bàn hoặc bật nhịp thở dẫn khí ngay bên cạnh để thư giãn mắt và vai gáy.

Cụm thứ hai nằm ở chuyên mục [Phương pháp](https://www.ngulongyquan.com/phuong-phap): **Bản đồ Kinh lạc & Huyệt vị Đông y**.

![Bản đồ Kinh lạc và Huyệt vị Đông y tương tác theo 4 vùng cơ thể trên trang Phương pháp](/media/2026/11/06a502123d76-nlyq-phuong-phap.jpg)

Thay vì liệt kê tên huyệt rời rạc, mình chia sơ đồ cơ thể thành 4 vùng mà dân văn phòng và người lớn tuổi hay gặp tình trạng căng mỏi nhất:

1. **Vùng Cổ - Vai - Gáy** (Kinh Đởm, Kinh Bàng Quang, Đốc Mạch) với các mốc huyệt *Phong trì (GB20)*, *Đại chùy (GV14)* và *Kiên tỉnh (GB21)*.
2. **Vùng Đầu mặt & Mắt** (Đốc Mạch, Kinh Đởm) với *Bách hội (GV20)*, *Ấn đường (EX-HN3)* và *Thái dương (EX-HN5)*.
3. **Vùng Lưng eo & Chân** (Kinh Bàng Quang, Kinh Vị) với *Thận du (BL23)*, *Ủy trung (BL40)* và *Túc tam lý (ST36)*.
4. **Vùng Bàn chân** (Kinh Thận, Kinh Can) với *Dũng tuyền (KI1)* và *Thái xung (LR3)*.

![Sơ đồ 3 đường kinh và 3 mốc huyệt Phong trì, Đại chùy, Kiên tỉnh vùng cổ vai gáy của Ngự Long Y Quán](/media/2026/11/52be63f08def-nlyq-so-do-kinh-lac.jpg)

Khi bấm vào từng vùng hoặc từng điểm huyệt, sơ đồ sẽ hiển thị vị trí giải phẫu dễ tìm, cảm giác căng tức thường gặp, cách giữ ấm hoặc xoa bấm nhẹ tại nhà cùng các cảnh báo an toàn (ví dụ trường hợp nào cần tránh bấm mạnh hoặc phải đi khám chuyên khoa ngay).

## Bài viết có giọng đọc AI và chuẩn mực nội dung y tế (YMYL)

Vì lĩnh vực y tế thuộc nhóm nội dung ảnh hưởng trực tiếp tới sức khỏe người đọc (*Your Money Your Life*), mọi bài viết trên Ngự Long Y Quán đều tuân thủ quy tắc biên tập chặt chẽ:

- Hiển thị rõ thông tin giấy phép hoạt động khám chữa bệnh (**5258/HNO-GPHĐ** do Sở Y tế Hà Nội cấp) và bác sĩ chịu trách nhiệm chuyên môn (**BS. Nguyễn Thị Kim Tuyến**) ngay trên các trang dịch vụ và bài viết.
- Trình bày trung thực công dụng hỗ trợ lưu thông khí huyết, thư giãn cơ khớp của phương pháp bấm huyệt, cứu ngải và chườm thảo dược; tuyệt đối không dùng từ ngữ cam kết chữa khỏi 100% hay thay thế phác đồ cấp cứu.
- Tích hợp **trình nghe bài viết bằng giọng đọc ấm áp** (`audio/mp4`) ở đầu các bài cẩm nang dưỡng sinh để người đang mỏi mắt hoặc người lớn tuổi có thể bấm nghe thay vì phải nhìn màn hình lâu.

## Kiến trúc 4 tầng từ máy chủ EzyPlatform đến biên Cloudflare và cổng MCP

Ở phía sau giao diện cổ phong là một kiến trúc kết hợp giữa hệ thống quản trị nội dung ổn định và lớp xử lý tốc độ cao trên mạng biên:

- **Lõi ứng dụng và cơ sở dữ liệu**: chạy trên nền **EzyPlatform (Java + MySQL 8.0)** đóng gói trong Docker, kết nối ra ngoài qua đường hầm bảo mật **Cloudflare Tunnel** mà không mở cổng trực tiếp ra Internet.
- **Lớp Edge Worker SEO / GEO / AEO**: xử lý định tuyến, nén ảnh WebP tự động, gắn dữ liệu có cấu trúc JSON-LD (`MedicalClinic`, `Physician`, `MedicalWebPage`, `FAQPage`) và xuất bản đồng thời hệ thống tệp `/llms.txt`, `/llms-full.txt` cùng bản song sinh Markdown (`/*.md`) cho các công cụ tìm kiếm AI.
- **Cổng MCP Server riêng (`mcp.ngulongyquan.com/mcp`)**: một Cloudflare Worker thực thi giao thức *Model Context Protocol* với 12 công cụ chuyên biệt, cho phép AI Agent của mình trực tiếp kiểm tra danh mục ảnh, tạo bản nháp, điền thẻ SEO và xuất bản bài viết mới lên hệ thống một cách an toàn qua khóa xác thực riêng.

Nhờ tách bạch lớp hiển thị tĩnh tại biên và tải lười (*lazy-load*) các khung vẽ 3D khi cuộn tới, toàn bộ website vẫn đạt **97 điểm Lighthouse trên di động và 100/100 điểm trên máy tính** dù mang trên mình cả mô hình WebGL 3D lẫn bộ họa tiết giấy cổ.

- **Truy cập website**: [ngulongyquan.com](https://www.ngulongyquan.com)
- **Bản đồ kinh lạc & phương pháp**: [ngulongyquan.com/phuong-phap](https://www.ngulongyquan.com/phuong-phap)