--- title: "phatdev.net" url: https://phatdev.net/vi/projects/phatdev-portfolio lang: vi alternate: en: https://phatdev.net/en/projects/phatdev-portfolio markdown: https://phatdev.net/vi/projects/phatdev-portfolio.md --- # phatdev.net > Portfolio song ngữ viết bằng Next.js 14 với CMS riêng trên MySQL, hệ tài liệu plugin, máy chủ cập nhật plugin và endpoint MCP để AI agent tra cứu dự án và tài liệu. - Vai trò: Full-stack · Next.js · CMS - Trạng thái: Đang chạy production - Công nghệ: Next.js, TypeScript, MySQL, MCP, SEO - Bản chạy thật: https://phatdev.net - Tài liệu và changelog: https://phatdev.net/docs/phatdev-portfolio - Tất cả dự án: https://phatdev.net/vi/projects.md ## Thông tin dự án - Vai trò: Thiết kế, phát triển, vận hành - Nền tảng: Next.js 14, MySQL, PM2, Nginx - Ngôn ngữ: Tiếng Việt, English - Cho AI: MCP (12 công cụ), WebMCP (7 công cụ), llms.txt ## Số liệu - 99 / 100: PageSpeed mobile / desktop, đo ngày 19/10/2026 - 12: công cụ MCP chỉ đọc cho AI agent - 18: bài blog kỹ thuật song ngữ vi / en - 2: ngôn ngữ render tại server, có hreflang ## Điểm nổi bật - **MCP cho AI agent**: Endpoint /api/mcp theo chuẩn Model Context Protocol: AI tra hồ sơ, dự án, tìm và đọc tài liệu plugin; chỉ đọc, có giới hạn tần suất. - **SEO song ngữ**: Render tại server, canonical và hreflang cho từng trang, sitemap tự sinh, dữ liệu có cấu trúc Person, CreativeWork, TechArticle. - **CMS và tài liệu tự viết**: Quản trị hồ sơ, dự án, kỹ năng, liên hệ và tài liệu plugin trên MySQL, không phụ thuộc CMS bên ngoài. - **Máy chủ cập nhật plugin**: Phát hành bản cập nhật cho các plugin và theme nội bộ, có license và thống kê lượt tải. - **Sáng, tối và ảnh theo ngữ cảnh**: Theo cài đặt thiết bị, ảnh dự án đổi theo ngôn ngữ và theme, bản gốc 4K mở trong lightbox. ## Phân tích chi tiết ### Mục tiêu Một nơi duy nhất giới thiệu năng lực và sản phẩm, đồng thời là hạ tầng phục vụ các plugin: tài liệu, cập nhật và license. Mã nguồn tự chủ hoàn toàn, không dùng template dựng sẵn. ### Kiến trúc #### Ứng dụng Next.js 14 (App Router) chạy bằng PM2 sau Nginx; dữ liệu trên MySQL với tài khoản chỉ có quyền đọc ghi dữ liệu, không có quyền đổi cấu trúc bảng. #### CMS Trang quản trị riêng cho hồ sơ, dự án, bộ ảnh, kỹ năng, liên hệ và tài liệu plugin; đăng nhập bằng JWT, giới hạn tần suất đăng nhập. #### Tài liệu và cập nhật Mỗi plugin có trang tài liệu và changelog; máy chủ cập nhật phát hành bản mới cho các site đang dùng. ### Cho máy tìm kiếm và AI - Render tại server, canonical và hreflang vi / en cho từng trang. - Sitemap và robots.txt tự sinh, dữ liệu có cấu trúc schema.org. - llms.txt mô tả nội dung cho mô hình ngôn ngữ. - Endpoint MCP chỉ đọc để AI agent tra cứu dự án và tài liệu. ### Giao diện Hai chế độ sáng và tối theo cài đặt thiết bị, font tự host có đủ dấu tiếng Việt, ảnh dự án đổi theo ngôn ngữ và theme. ### So sánh với cách làm portfolio khác | Tiêu chí | phatdev.net | Template Framer / WordPress | Linktree | |---|---|---|---| | Tự chủ mã nguồn | ✓ | ~ | ✗ | | CMS riêng trên MySQL | ✓ | ✓ | ✗ | | SEO song ngữ render tại server | ✓ | ~ | ✗ | | Tài liệu plugin tích hợp | ✓ | ✗ | ✗ | | MCP cho AI agent | ✓ | ✗ | ✗ | ## Giấy phép Mã nguồn không công khai, bảo lưu mọi quyền. Dự án chưa khai báo giấy phép nào trong mã (không có tệp LICENSE và không có trường license). ## Thư viện và tài nguyên bên thứ ba (34) | Tên | Loại | Phiên bản | Giấy phép | Nguồn | |---|---|---|---|---| | @types/bcryptjs | Thư viện (kiểu dữ liệu TypeScript) | 2.4.6 | MIT | https://github.com/DefinitelyTyped/DefinitelyTyped | | @types/node | Thư viện (kiểu dữ liệu TypeScript) | 20.16.10 | MIT | https://github.com/DefinitelyTyped/DefinitelyTyped | | @types/nodemailer | Thư viện (kiểu dữ liệu TypeScript) | 6.4.16 | MIT | https://github.com/DefinitelyTyped/DefinitelyTyped | | @types/qrcode | Thư viện (kiểu dữ liệu TypeScript) | 1.5.6 | MIT | https://github.com/DefinitelyTyped/DefinitelyTyped | | @types/react | Thư viện (kiểu dữ liệu TypeScript) | 18.3.11 | MIT | https://github.com/DefinitelyTyped/DefinitelyTyped | | @types/react-dom | Thư viện (kiểu dữ liệu TypeScript) | 18.3.0 | MIT | https://github.com/DefinitelyTyped/DefinitelyTyped | | bcryptjs | Thư viện | 2.4.3 | MIT | https://github.com/dcodeIO/bcrypt.js | | dompurify | Thư viện | 3.4.3 | (MPL-2.0 OR Apache-2.0) | https://github.com/cure53/DOMPurify | | framer-motion | Thư viện | 11.11.0 | MIT | https://github.com/framer/motion/ | | isomorphic-dompurify | Thư viện | 3.13.0 | MIT | https://github.com/kkomelin/isomorphic-dompurify | | jose | Thư viện | 5.9.4 | MIT | https://github.com/panva/jose | | marked | Thư viện | 18.0.3 | MIT | https://github.com/markedjs/marked | | mysql2 | Thư viện | 3.11.3 | MIT | https://github.com/sidorares/node-mysql2 | | next | Thư viện | 14.2.35 | MIT | https://github.com/vercel/next.js | | nodemailer | Thư viện | 8.0.5 | MIT-0 | https://github.com/nodemailer/nodemailer | | qrcode | Thư viện | 1.5.4 | MIT | https://github.com/soldair/node-qrcode | | react | Thư viện | 18.3.1 | MIT | https://github.com/facebook/react | | react-dom | Thư viện | 18.3.1 | MIT | https://github.com/facebook/react | | sharp | Thư viện | 0.35.5 | Apache-2.0 | https://github.com/lovell/sharp | | zod | Thư viện | 3.23.8 | MIT | https://github.com/colinhacks/zod | | autoprefixer | Thư viện (dùng khi phát triển) | 10.4.20 | MIT | https://github.com/postcss/autoprefixer | | jsdom | Thư viện (dùng khi phát triển) | 29.0.2 | MIT | https://github.com/jsdom/jsdom | | playwright-core | Thư viện (dùng khi phát triển) | 1.48.1 | Apache-2.0 | https://github.com/microsoft/playwright | | postcss | Thư viện (dùng khi phát triển) | 8.4.47 | MIT | https://github.com/postcss/postcss | | tailwindcss | Thư viện (dùng khi phát triển) | 3.4.13 | MIT | https://github.com/tailwindlabs/tailwindcss | | typescript | Thư viện (dùng khi phát triển) | 5.6.2 | Apache-2.0 | https://github.com/microsoft/TypeScript | | Inter | Font (trang quản trị) | - | OFL-1.1 | https://rsms.me/inter/ | | JetBrains Mono | Font (trang công khai) | - | OFL-1.1 | https://www.jetbrains.com/lp/mono/ | | Space Grotesk | Font (trang công khai) | - | OFL-1.1 | https://fonts.google.com/specimen/Space+Grotesk | | Font Awesome Free. Chỉ dùng đường vẽ SVG của một số biểu tượng, không nạp CSS và font. | Biểu tượng (trang công khai) | 6.7.2 | CC-BY-4.0 AND OFL-1.1 AND MIT | https://fontawesome.com/license/free | | Font Awesome Free. Trang quản trị. | Biểu tượng (trang quản trị) | 6.5.2 | CC-BY-4.0 AND OFL-1.1 AND MIT | https://fontawesome.com/license/free | | Ảnh minh hoạ trong bài blog (36). Ảnh do AI tạo, không có người thật. | Ảnh | - | Tạo bằng mô hình tạo ảnh của OpenAI qua ChatGPT, theo điều khoản sử dụng của OpenAI | - | | Real-ESRGAN (mô hình realesrgan-x4plus). Phóng to ảnh blog lên 4K. | Công cụ (công cụ dựng) | - | BSD-3-Clause | https://github.com/xinntao/Real-ESRGAN | | Real-ESRGAN-ncnn-vulkan (chương trình chạy mô hình) | Công cụ (công cụ dựng) | - | MIT | https://github.com/xinntao/Real-ESRGAN-ncnn-vulkan | Ghi công: Font Awesome Free by @fontawesome, https://fontawesome.com. Biểu tượng: CC BY 4.0, font: SIL OFL 1.1, mã: MIT. Copyright Fonticons, Inc. - Ảnh bìa bài blog (18): SVG tự vẽ (hoạ tiết 3D và vector), kết xuất sang WebP. - Ảnh chụp màn hình và ảnh bìa dự án (152): Do mình chụp từ bản chạy thật của từng dự án; ảnh bìa được dựng lại từ ảnh chụp. Xem trang Giấy phép và ghi nguồn: https://phatdev.net/vi/licenses.md