Tóm tắt và Luyện tập

Những điểm chính cần nhớ

• Mọi ứng dụng đều gồm bốn phần: một frontend (những gì người dùng nhìn thấy), một backend (các quy tắc và logic), một database (nơi dữ liệu tồn tại lâu dài), và hosting (nơi mọi thứ chạy). Frontend không bao giờ chạm trực tiếp vào database — nó luôn đi qua backend.
• Trong trình duyệt, HTML là cấu trúc, CSS là kiểu dáng, và JavaScript là hành vi; mã lệnh thay đổi trang bằng cách thay đổi DOM.
• Bạn không tự viết mọi thứ — package (được quản lý bởi npm qua package.json và một lockfile) cung cấp các bài toán đã được giải quyết sẵn dưới dạng dependency.
• Biến môi trường giữ bí mật ra ngoài mã lệnh và cho phép cùng một mã lệnh hoạt động đúng ở cả dev lẫn prod.
• Một yêu cầu di chuyển theo hướng frontend → hosting → backend → database rồi quay ngược lại; gọi tên đúng lớp chứa vấn đề là đã xong một nửa việc giải quyết nó.

Hãy thử làm

Chọn một ứng dụng bạn dùng hằng ngày và kể lại một hành động qua từng lớp bằng lời: "Tôi bấm gửi (frontend) → nó đi tới máy chủ của họ (backend) → nơi kiểm tra xem tôi có được phép không và lưu tin nhắn (database) → và cuộc trò chuyện được cập nhật (frontend)." Sau đó thử đoán xem mỗi vấn đề nằm ở lớp nào: cái nút trông bị lệch; ứng dụng báo "bạn chưa đăng nhập"; một tin nhắn từ hôm qua biến mất. Thành thạo cách gọi tên này chính là kỹ năng mà phần còn lại của cuốn sách được xây dựng dựa trên đó.

Câu lệnh của chương này

I'm learning how apps fit together. Here is a feature I want:
<one sentence describing what the user should be able to do>

Before writing any code, break it down by layer for me:
- Frontend: what the user sees and what gets sent
- Backend: what rules/checks must run, and where
- Database: what data needs to be stored or read
- Any env vars or config (especially secrets) involved

Then describe the request flow from click to result in numbered steps.
Keep it in plain language — I want to understand the shape before the code.