feat(docs): add NavGrid/NavCard components and restructure stage pages

- Add NavGrid.vue and NavCard.vue components for better navigation layout - Restructure stage-0 index pages across languages into intro.md with new navigation components - Remove old stage-0 index.md files and update stage-3 pages similarly - Add new dependencies 'claude' and 'codex' to package.json - Improve code formatting in multiple Vue components for better readability - Update documentation content and structure for better user experience
2026-02-01 23:42:12 +08:00
parent a9a5c5c8a7
commit ad95658a11
171 changed files with 16366 additions and 7946 deletions
@@ -1,42 +0,0 @@
-# Appendix
-
-Knowledge base for AI, Frontend, Backend, and General Skills.
-
-## Content Overview
-
-### AI Basics
- [Prompt Engineering](/vi-vn/appendix/prompt-engineering)
- [AI Evolution](/vi-vn/appendix/ai-evolution)
- [LLM Introduction](/vi-vn/appendix/llm-intro)
- [VLM Introduction](/vi-vn/appendix/vlm-intro)
- [AI Image Generation](/vi-vn/appendix/image-gen-intro)
- [AI Audio Models](/vi-vn/appendix/audio-intro)
- [Context Engineering](/vi-vn/appendix/context-engineering)
- [AI Agents](/vi-vn/appendix/agent-intro)
- [AI Capability Dictionary](/vi-vn/appendix/ai-capability-dictionary)
-
-### Frontend Development
- [Web Basics (HTML/CSS/JS)](/vi-vn/appendix/web-basics)
- [Frontend Evolution](/vi-vn/appendix/frontend-evolution)
- [Frontend Performance](/vi-vn/appendix/frontend-performance)
- [Canvas 2D](/vi-vn/appendix/canvas-intro)
- [URL to Browser](/vi-vn/appendix/url-to-browser)
- [Browser DevTools](/vi-vn/appendix/browser-devtools)
-
-### Backend Development
- [Backend Evolution](/vi-vn/appendix/backend-evolution)
- [Backend Languages](/vi-vn/appendix/backend-languages)
- [Database Principles](/vi-vn/appendix/database-intro)
- [Cache Design](/vi-vn/appendix/cache-design)
- [Message Queues](/vi-vn/appendix/queue-design)
- [Authentication](/vi-vn/appendix/auth-design)
- [Tracking Design](/vi-vn/appendix/tracking-design)
- [Operations](/vi-vn/appendix/operations)
-
-### General Skills
- [API Introduction](/vi-vn/appendix/api-intro)
- [IDE Introduction](/vi-vn/appendix/ide-intro)
- [Terminal Introduction](/vi-vn/appendix/terminal-intro)
- [Git Introduction](/vi-vn/appendix/git-intro)
- [Computer Networks](/vi-vn/appendix/computer-networks)
- [Deployment](/vi-vn/appendix/deployment)
@@ -0,0 +1,186 @@
+# Phụ lục
+
+Chào mừng đến với phần **Phụ lục**! Đây là bộ sưu tập các nền tảng trí tuệ nhân tạo và các khái niệm cơ bản về phát triển full-stack, đóng vai trò là thư viện tham khảo quan trọng trong hành trình học tập của bạn.
+
+## Danh mục nội dung
+
+### Nền tảng AI
+
+Hiểu các khái niệm cốt lõi, lịch sử phát triển và các nguyên tắc kỹ thuật tiên tiến của trí tuệ nhân tạo:
+<NavGrid>
+  <NavCard
+    href="/vi-vn/appendix/prompt-engineering/"
+    title="Kỹ thuật Prompt"
+    description="Thành thạo nghệ thuật đối thoại hiệu quả với AI để khai thác tiềm năng của các mô hình lớn"
+  />
+  <NavCard
+    href="/vi-vn/appendix/ai-evolution"
+    title="Lịch sử tiến hóa AI"
+    description="Xem xét các cột mốc quan trọng trong phát triển AI và hiểu quỹ đạo tiến hóa công nghệ"
+  />
+  <NavCard
+    href="/vi-vn/appendix/llm-intro"
+    title="Mô hình ngôn ngữ lớn"
+    description="Giải thích sâu nhưng dễ tiếp cận về cách hoạt động của Mô hình Ngôn ngữ Lớn (LLM) và các ứng dụng của chúng"
+  />
+  <NavCard
+    href="/vi-vn/appendix/vlm-intro"
+    title="Mô hình đa phương thức lớn"
+    description="Khám phá các mô hình tiên tiến có khả năng xử lý nhiều phương thức dữ liệu như hình ảnh và âm thanh"
+  />
+  <NavCard
+    href="/vi-vn/appendix/image-gen-intro"
+    title="Nguyên tắc tạo hình ảnh AI"
+    description="Tiết lộ logic cơ bản và triển khai kỹ thuật của việc tạo hình ảnh AI"
+  />
+  <NavCard
+    href="/vi-vn/appendix/audio-intro"
+    title="Mô hình âm thanh AI"
+    description="Hiểu các ứng dụng AI trong tổng hợp giọng nói, nhận dạng và tạo âm nhạc"
+  />
+  <NavCard
+    href="/vi-vn/appendix/context-engineering"
+    title="Kỹ thuật Ngữ cảnh"
+    description="Học cách tối ưu hóa quản lý ngữ cảnh để cải thiện tính nhất quán dài hạn của các tác vụ AI"
+  />
+  <NavCard
+    href="/vi-vn/appendix/agent-intro"
+    title="Trí thông minh Tác nhân"
+    description="Khám phá các kiến trúc tác nhân AI với khả năng ra quyết định và thực thi tự chủ"
+  />
+  <NavCard
+    href="/vi-vn/appendix/ai-capability-dictionary"
+    title="Từ điển Khả năng AI"
+    description="Sổ tay tham khảo nhanh cho các thuật ngữ thường được sử dụng và các khái niệm cốt lõi trong lĩnh vực AI"
+  />
+</NavGrid>
+
+
+### Nền tảng Frontend
+
+Củng cố nền tảng kỹ thuật của phát triển frontend:
+<NavGrid>
+  <NavCard
+    href="/vi-vn/appendix/web-basics"
+    title="Cơ bản HTML/CSS/JS"
+    description="Ba trụ cột của việc xây dựng trang web, điều cần thiết cho ngườI mới bắt đầu phát triển frontend"
+  />
+  <NavCard
+    href="/vi-vn/appendix/frontend-evolution"
+    title="Lịch sử tiến hóa Frontend"
+    description="Hiểu sự tiến hóa của các stack công nghệ frontend và nắm bắt xu hướng phát triển công nghệ"
+  />
+  <NavCard
+    href="/vi-vn/appendix/frontend-performance"
+    title="Tối ưu hóa Hiệu suất Frontend"
+    description="Học các chiến lược chính để cải thiện tốc độ tải trang web và tính mượt mà của tương tác"
+  />
+  <NavCard
+    href="/vi-vn/appendix/canvas-intro"
+    title="Giới thiệu Canvas 2D"
+    description="Thành thạo API vẽ Canvas để đạt được hiệu ứng đồ họa và hoạt hình tuyệt vời"
+  />
+  <NavCard
+    href="/vi-vn/appendix/url-to-browser"
+    title="Từ URL đến Hiển thị Trình duyệt"
+    description="Phân tích chuỗi đầy đủ về toàn bộ quá trình trình duyệt render trang"
+  />
+  <NavCard
+    href="/vi-vn/appendix/browser-devtools/"
+    title="Công cụ Phát triển Trình duyệt"
+    description="Sử dụng thành thạo các công cụ phát triển để xác định và giải quyết hiệu quả các vấn đề frontend"
+  />
+</NavGrid>
+
+
+### Nền tảng Backend
+
+Thành thạo các khái niệm cốt lõi của phát triển backend:
+<NavGrid>
+  <NavCard
+    href="/vi-vn/appendix/backend-evolution"
+    title="Lịch sử tiến hóa Backend"
+    description="Từ đơn khối đến microservices, khám phá sự tiến hóa của kiến trúc backend"
+  />
+  <NavCard
+    href="/vi-vn/appendix/backend-languages"
+    title="Ngôn ngữ Lập trình Backend"
+    description="So sánh các đặc điểm và kịch bản ứng dụng của các ngôn ngữ backend hàng đầu để chọn stack công nghệ tốt nhất"
+  />
+  <NavCard
+    href="/vi-vn/appendix/database-intro"
+    title="Nguyên tắc Cơ sở dữ liệu"
+    description="Hiểu các nguyên tắc cốt lõi của cơ sở dữ liệu và thành thạo nghệ thuật lưu trữ và truy vấn dữ liệu"
+  />
+  <NavCard
+    href="/vi-vn/appendix/cache-design"
+    title="Thiết kế Bộ nhớ đệm Hệ thống"
+    description="Học các chiến lược bộ nhớ đệm để cải thiện khả năng xử lý đồng thời cao của hệ thống"
+  />
+  <NavCard
+    href="/vi-vn/appendix/queue-design"
+    title="Thiết kế Hàng đợi Tin nhắn"
+    description="Thành thạo vai trò then chốt của hàng đợi tin nhắn trong việc tách rời và cắt giảm đỉnh"
+  />
+  <NavCard
+    href="/vi-vn/appendix/auth-design"
+    title="Nguyên tắc và Thực hành Xác thực"
+    description="Xây dựng các hệ thống xác thực danh tính và quản lý quyền an toàn"
+  />
+  <NavCard
+    href="/vi-vn/appendix/tracking-design"
+    title="Thiết kế Theo dõi"
+    description="Thiết kế theo dõi dữ liệu một cách khoa học để cung cấp hỗ trợ dữ liệu cho quyết định sản phẩm"
+  />
+  <NavCard
+    href="/vi-vn/appendix/operations"
+    title="Vận hành Trực tuyến"
+    description="Thành thạo các kỹ năng vận hành cho việc triển khai, giám sát và khắc phục sự cố hệ thống"
+  />
+</NavGrid>
+
+
+### Kỹ năng Chung
+
+Kiến thức cơ bản về phát triển phần mềm:
+<NavGrid>
+  <NavCard
+    href="/vi-vn/appendix/api-intro"
+    title="Giới thiệu API"
+    description="Kiến thức cơ bản về thiết kế và phát triển giao diện API"
+  />
+  <NavCard
+    href="/vi-vn/appendix/ide-intro/"
+    title="Nguyên tắc IDE"
+    description="Hiểu cơ chế hoạt động bên trong của Môi trường Phát triển Tích hợp (IDE)"
+  />
+  <NavCard
+    href="/vi-vn/appendix/terminal-intro"
+    title="Giới thiệu Terminal"
+    description="Thành thạo các thao tác cơ bản của terminal dòng lệnh để cải thiện hiệu quả phát triển"
+  />
+  <NavCard
+    href="/vi-vn/appendix/git-intro"
+    title="Giới thiệu Chi tiết về Git"
+    description="Hiểu sâu các nguyên tắc quản lý phiên bản Git và cách sử dụng nâng cao"
+  />
+  <NavCard
+    href="/vi-vn/appendix/computer-networks"
+    title="Mạng máy tính"
+    description="Kiến thức cơ bản về giao thức mạng và nguyên tắc giao tiếp"
+  />
+  <NavCard
+    href="/vi-vn/appendix/deployment"
+    title="Triển khai và Ra mắt"
+    description="Quy trình đầy đủ và các thực hành tốt nhất cho việc triển khai và ra mắt ứng dụng"
+  />
+</NavGrid>
+
+
+## Gợi ý sử dụng
+
+- Sử dụng làm tài liệu tham khảo trong quá trình học tập, tham khảo khi cần
+- Khi gặp các khái niệm kỹ thuật không quen thuộc, tìm kiếm giải thích ở đây trước
+- Nên đọc một lần để thiết lập hệ thống kiến thức hoàn chỉnh
+
+Đây là kho báu kiến thức kỹ thuật của bạn, luôn chào đón tham khảo!