🪟 Frontend là gì?
Phần bạn nhìn và trực tiếp bấm vào.
1
Hiểu nó là gì
Frontend là giao diện website hoặc ứng dụng chạy trước mắt người dùng.
Nói theo đời thường:
Đây là sảnh, menu và nút bấm của một cửa hàng — thứ khách thấy và tương tác.
Đây là sảnh, menu và nút bấm của một cửa hàng — thứ khách thấy và tương tác.
⚠ Chỗ ẩn dụ này hỏng
Mặt tiền cửa hàng thì chỉ để trưng bày. Frontend hiện đại chứa rất nhiều logic thật — tính tiền, kiểm tra dữ liệu, lưu tạm khi mất mạng.
Hệ quả quan trọng với người test: mọi thứ ở frontend đều sửa được bằng F12. Kiểm tra dữ liệu ở frontend chỉ để người dùng đỡ bực, không phải để bảo mật. Backend vẫn phải kiểm lại tất cả.
2
Code trông thế nào
<!-- Nhìn thấy được, sửa được bằng F12 --> <button disabled>Mua ngay</button> // Gõ dòng này trong Console là nút bấm được ngay document.querySelector('button').disabled = false
Đây là lý do không bao giờ được tin dữ liệu do frontend gửi lên.
3
Khi nào bạn dùng nó
✓ Dùng khi
- Mọi thứ người dùng nhìn thấy và bấm vào
- Phản hồi tức thì không cần chờ server
✗ Đừng dùng khi
- Kiểm tra bảo mật hoặc quyền hạn
- Tính toán liên quan tới tiền bạc (làm lại ở backend)
Chưa cần biết: React/Vue, quản lý trạng thái, render phía máy chủ, đóng gói.
Để dành tới Mốc 2 — Đọc hiểu được: Nhìn một sơ đồ hệ thống hoặc một log lỗi, bạn đoán được chỗ nào đang hỏng.
Dấu hiệu bạn đã cần học nó: Khi bạn cần biết vì sao trang hiện dữ liệu cũ dù server đã trả về dữ liệu mới.
4
Đi đâu tiếp
- BackendNửa còn lại, nơi kiểm tra thật sự diễn ra.
- UI/UXPhần quyết định frontend có dễ dùng hay không.
- LocatorCách automation bám vào frontend.