Cẩm Nang Vibe Coding

Cách các phần mềm giao tiếp với nhau. REST API cơ bản dùng GET (lấy dữ liệu), POST (tạo mới), PUT (thay thế/cập nhật), PATCH (cập nhật một phần), DELETE (xóa) — tương ứng CRUD.

Khóa cho phép app truy cập dịch vụ khác (OpenAI, Google Maps, email service...).

Async/await là cú pháp xử lý bất đồng bộ (non-blocking) trong JavaScript; fetch là API chuẩn để gọi HTTP request.

Authentication xác định AI đang đăng nhập (email+mật khẩu, Google Login, OTP, Social Login...). Authorization xác định người đó được phép làm gì (Admin/Nhân viên/Khách). Hiện có nhiều dịch vụ quản lý sẵn (Auth-as-a-Service) giúp triển khai nhanh mà không tự xây backend auth.

Phần xử lý phía server: kiểm tra dữ liệu, xử lý nghiệp vụ, phân quyền, đọc/ghi database, gửi email, xử lý file, gọi AI/API khác.

Bản sao dữ liệu để phục hồi sau sự cố — quan trọng nhất là PostgreSQL, file upload, cấu hình cần thiết.

Branch: nhánh riêng để phát triển tính năng (main, feature-login...). Pull Request: đề nghị đưa thay đổi từ branch vào branch chính.

Quá trình biến source code thành dạng sẵn sàng chạy/deploy (vd: next build → Production build).

CI/CD (Continuous Integration / Continuous Delivery/Deployment) là tập hợp thực tiễn tự động hóa vòng đời phần mềm: từ khi developer push code → tự động build, chạy test, kiểm tra chất lượng → đóng gói artifact → triển khai lên môi trường staging/production. CI tập trung vào tích hợp mã thường xuyên và kiểm tra tự động; CD mở rộng sang việc phát hành tự động hoặc bấm một nút.

Quy tắc kiểm soát website/domain nào được phép gọi tài nguyên từ server khác.

CPU: sức mạnh xử lý. RAM: bộ nhớ làm việc tạm thời. Disk: dung lượng lưu lâu dài.

Ngôn ngữ quyết định giao diện trông như thế nào: màu, kích thước, khoảng cách, bố cục, responsive.

Lưu tạm kết quả đã có để lần sau trả nhanh hơn (Request → Cache → Response thay vì → Database → xử lý).

Web server/reverse proxy khác, điểm mạnh là tự động cấu hình HTTPS rất đơn giản.

Client: thiết bị/phần mềm gửi yêu cầu (trình duyệt). Server: máy/phần mềm nhận và xử lý yêu cầu.

Công việc tự động chạy theo lịch định kỳ, giống 'đồng hồ hẹn giờ của server'.

Tổng quan các khái niệm cốt lõi khi xây dựng giao diện người dùng web: DOM, Component, State, Props, Virtual DOM, Hydration, SSR/CSR/SSG, Responsive Design, Accessibility. Bổ sung thuật ngữ thiết kế: Design System, Design Tokens, Component Library, Atomic Design, Visual Hierarchy, White Space, Typography Scale, Color Palette, Breakpoints, Grid System, Micro-interactions, Motion Design, Design Handoff, Figma/Sketch, Pixel Perfect, Design QA.

Tập hợp các khái niệm cốt lõi (Workflow, Node, Trigger, Expression, Credentials...) cấu thành nên một quy trình tự động hóa trong n8n.

Nơi lưu dữ liệu lâu dài. Khái niệm nền tảng: Table (giống sheet Excel), Row (bản ghi), Column (trường dữ liệu), Primary Key (mã duy nhất), Foreign Key (liên kết giữa bảng), Index (tìm kiếm nhanh), Constraint (quy tắc bảo vệ dữ liệu). Phân loại chính: 2 nhóm lớn là SQL (Relational: PostgreSQL, MySQL, SQL Server) và NoSQL (Document: MongoDB, Key-Value: Redis, Wide-column: Cassandra, Graph: Neo4j). ACID là bộ 4 tính chất đảm bảo độ tin cậy của transaction: Atomicity (toàn vẹn – tất cả hoặc không có gì), Consistency (nhất quán – dữ liệu luôn hợp lệ trước/sau transaction), Isolation (độc lập – các transaction không can thiệp lẫn nhau), Durability (bền vững – dữ liệu đã commit không mất khi sự cố).

Cơ chế quản lý thay đổi cấu trúc database (schema) theo phiên bản, cho phép áp dụng, rollback và theo dõi lịch sử các thay đổi (tạo bảng, thêm cột, index, constraint, seed data) một cách có kiểm soát, lặp lại được và an toàn cho production.

Thư viện mà app phụ thuộc vào (React, Prisma, Zod, Tailwind...).

Quá trình đưa ứng dụng từ môi trường phát triển lên môi trường sản xuất hoặc staging để người dùng có thể truy cập.

Development: môi trường đang code. Staging: môi trường thử gần giống thật. Production: môi trường người dùng thật đang dùng.

Framework web lớn, đầy đủ của Python — có sẵn ORM, Authentication, Admin, Routing, Form, Security.

Đóng gói app cùng môi trường chạy thành container. Dockerfile = công thức tạo image; Image = khuôn mẫu; Container = instance đang chạy; Volume = dữ liệu bền vững; Network = mạng giữa container.

Quản lý nhiều container trong cùng một hệ thống (App, PostgreSQL, Redis, Nginx...) được mô tả trong file compose.yaml.

Cho phép container giao tiếp qua network nội bộ (vd: Next.js → postgres:5432, 'postgres' là tên service, không phải IP).

Domain: tên dễ nhớ của website (app.example.vn). DNS: hệ thống trỏ domain đến IP hoặc dịch vụ khác.

Chứa cấu hình thay đổi giữa các môi trường và các bí mật (DATABASE_URL, API_KEY, AUTH_SECRET).

FastAPI là framework Python hiện đại, hiệu năng cao để xây dựng API RESTful, dựa trên Starlette (cho async) và Pydantic (cho validation dữ liệu), tự động sinh tài liệu OpenAPI và giao diện Swagger UI.

Dịch vụ lưu trữ file dạng đối tượng (object) — mỗi file là một 'object' có ID duy nhất, metadata và dữ liệu nhị phân. Khác với file system truyền thống, object storage không có thư mục thực sự, dùng key (đường dẫn) để tổ chức, mở rộng gần như không giới hạn.

Phần người dùng nhìn thấy và tương tác trực tiếp: trang đăng nhập, dashboard, danh sách, form, bộ lọc, biểu đồ.

Cách xây dựng ứng dụng bao gồm cả phần giao diện người dùng (Frontend) và phần xử lý logic, dữ liệu phía máy chủ (Backend) trong cùng một dự án hoặc bởi một lập trình viên.

Quản lý lịch sử thay đổi source code: Repository, Commit, Branch, Merge, Diff, Revert.

Nơi lưu Git repository trên Internet. Git = công nghệ quản lý phiên bản, GitHub = dịch vụ lưu và cộng tác trên Git.

Ngôn ngữ lập trình do Google phát triển, chạy nhanh, nhẹ RAM, build ra file thực thi.

Ngôn ngữ đánh dấu tạo cấu trúc nội dung trang web (tiêu đề, đoạn văn, form, nút, bảng, ảnh).

Mã trạng thái phản hồi HTTP: 200 thành công, 201 tạo thành công, 400 request không hợp lệ, 401 chưa xác thực, 403 không có quyền, 404 không tìm thấy, 500 lỗi server.

Các hàm đặc biệt của React (useState, useEffect...) cho phép dùng state và lifecycle trong functional component; Next.js mở rộng thêm các hook riêng (useRouter, usePathname, useSearchParams...) để tương tác với routing và rendering.

Viết tắt của Input/Output — quá trình trao đổi dữ liệu giữa chương trình và thế giới bên ngoài (bàn phím, màn hình, ổ cứng, mạng, v.v.).

IP: địa chỉ máy trên mạng. Port: cửa của một dịch vụ trên máy đó (22 SSH, 80 HTTP, 443 HTTPS, 5432 PostgreSQL, 3000 Next.js dev).

Định dạng dữ liệu cực phổ biến khi API giao tiếp — không phải database, chỉ là định dạng biểu diễn dữ liệu.

Cú pháp mở rộng JavaScript cho phép viết HTML/XML trực tiếp trong file .js/.tsx, được Next.js (dựa trên React) biên dịch thành React.createElement.

Ngôn ngữ lập trình quan trọng nhất của web. Ban đầu chỉ chạy trong trình duyệt, nhờ Node.js nay chạy được cả ở server.

Nhật ký hoạt động của app (Login success, Database connection failed, API 500...).

Thư viện icon SVG nhẹ, tối ưu cho React, fork từ Feather Icons với hàng nghìn biểu tượng nhất quán.

Một cửa sổ con nổi lên trên giao diện chính, yêu cầu người dùng tương tác trước khi quay lại trang.

Theo dõi sức khỏe hệ thống: CPU, RAM, Disk, Network, Container, Database, Uptime.

Monolith: nhiều chức năng nằm trong một ứng dụng. Microservice: chia hệ thống thành nhiều service độc lập.

Thành phần giao diện người dùng dạng thanh chứa logo, liên kết điều hướng và các nút chức năng, thường đặt ở đầu trang.

Framework xây ứng dụng web dựa trên React, có thể làm cả Frontend lẫn Backend trong cùng một app.

Web server/reverse proxy: có thể làm reverse proxy, SSL termination, chuyển domain đến app, serve static file, load balancing.

Môi trường chạy JavaScript/TypeScript phía server, xây dựng trên engine V8 của Chrome, dùng mô hình event-driven, non-blocking I/O để xử lý nhiều kết nối đồng thời với ít thread.

Lớp trung gian giúp code làm việc với database mà không phải viết SQL cho mọi thao tác (Application → ORM → PostgreSQL).

Công cụ cài và quản lý thư viện. JS/TS: npm, pnpm, yarn. Python: pip, uv. package.json mô tả tên project, script, dependency, version; node_modules chứa package đã cài (không commit lên GitHub).

Hệ quản trị cơ sở dữ liệu quan hệ đối tượng (ORDBMS) mã nguồn mở, mạnh mẽ, hỗ trợ ACID, mở rộng cao, hỗ trợ JSON, full-text search, GIS (PostGIS), và nhiều kiểu dữ liệu tùy chỉnh.

Prisma là ORM (Object-Relational Mapping) mã nguồn mở cho Node.js và TypeScript, giúp tương tác với cơ sở dữ liệu quan hệ (PostgreSQL, MySQL, SQLite, SQL Server, MongoDB) thông qua một schema khai báo. Nó tự động sinh ra Prisma Client – một thư viện type-safe để truy vấn dữ liệu, đồng thời cung cấp Prisma Migrate để quản lý migration và Prisma Studio để duyệt dữ liệu trực quan.

Ngôn ngữ lập trình nổi tiếng vì dễ đọc và hệ sinh thái mạnh.

Queue là hàng đợi công việc; Worker là tiến trình lấy việc trong queue ra xử lý (Backend → Queue → Worker → Hoàn thành).

Giới hạn số request trong một khoảng thời gian.

Thư viện JavaScript dùng để xây giao diện, chia UI thành các khối nhỏ gọi là component (vd: Header, Sidebar, DataTable). Ví dụ: `function Button({label}) { return <button>{label}</button>; }`

Kho dữ liệu dạng key-value chạy trong RAM, hỗ trợ nhiều cấu trúc dữ liệu như string, hash, list, set, sorted set.

Đứng trước các app và chuyển request đến đúng service (vd: app1.example.vn → localhost:3001).

Ngôn ngữ chú trọng hiệu năng và an toàn bộ nhớ, phù hợp phần mềm hệ thống.

Ngôn ngữ dùng để làm việc với database quan hệ: SELECT (lấy), INSERT (thêm), UPDATE (sửa), DELETE (xóa), JOIN (nối bảng).

Giao thức mạng cho phép truy cập và điều khiển máy chủ từ xa qua kênh mã hóa an toàn.

HTTPS mã hóa dữ liệu giữa trình duyệt và server bằng TLS, khác với HTTP không mã hóa đầy đủ.

CSR: trang dựng nhiều ở trình duyệt. SSR: server dựng HTML trước khi gửi về. React Server Component: component chạy phía server trong kiến trúc React/Next.js hiện đại.

Trong Next.js, cho phép một thao tác từ giao diện chạy code trực tiếp phía server mà không cần tự tạo REST API riêng.

Cookie: dữ liệu nhỏ trình duyệt lưu lại. Session: thông tin phiên đăng nhập. JWT: token chứa thông tin xác thực có chữ ký.

Tập hợp công nghệ dùng chung để xây app.

Hệ thống class CSS tiện dụng (utility-first), viết style ngay trong class thay vì file CSS riêng.

JavaScript có thêm hệ thống kiểm tra kiểu dữ liệu (type checking).

Máy chủ ảo riêng, chạy 24/7, có CPU, RAM, ổ SSD, địa chỉ IP và hệ điều hành (thường là Linux) hoàn toàn riêng cho bạn.

Kiểm tra dữ liệu có hợp lệ không (email đúng định dạng, ngày hết hạn không nhỏ hơn ngày cấp, không để trống, không trùng mã).

Giữ dữ liệu lâu dài cho container, vì container có thể bị xóa và tạo lại (đặc biệt quan trọng với PostgreSQL container).

Giữ kết nối hai chiều liên tục giữa client và server.

Cách một hệ thống chủ động báo cho hệ thống khác khi có sự kiện (vd: Stripe gọi webhook sau khi thanh toán thành công). Khác với API thông thường, webhook là callback HTTP do server gửi đi; N8n là nền tảng tự động hóa workflow thường dùng webhook làm trigger để kích hoạt các luồng xử lý.

Bộ component UI không có runtime (headless) được xây dựng trên Radix UI + Tailwind CSS. Code component được copy thẳng vào repo (không cài package), cho phép tùy biến hoàn toàn mọi dòng CSS/JS.