Responsive game UI: bàn phím, cảm ứng và màn hình mobile
Gom phím và chạm vào cùng một action, rồi chỉnh vùng bấm, safe area và touch-action cho màn nhỏ.
SAVE_POINT // PERSONAL DEV LOG
Viết code. Gỡ lỗi. Ghi lại đường đi.
BloodyCoTech là góc làm việc cá nhân của mình: ghi chú frontend đã tự kiểm tra, bài luyện phỏng vấn đang dùng và những game nhỏ còn nằm trên bàn làm việc. Không phải một “studio” bóng bẩy—chỉ là nơi mình làm nghề công khai hơn một chút.
- 08
- ghi chú
- 04
- chủ đề
- VI/EN
- giao diện
PLAYER_01 // ONLINE
// QUEST_LOG
Bắt đầu từ đây
React và Next.js: khác biệt và cách lựa chọn
Phân biệt thư viện React với framework Next.js, rồi chọn SPA, App Router hoặc static export theo sản phẩm.
TanStack Query: quản lý server state đúng cách
Dùng TanStack Query v5 cho dữ liệu từ server: query key, staleTime, và chỗ không nên dùng nó.
NEW_MODE // INTERVIEW PREP
Ôn Frontend theo một JD thật
Mình vừa gom lại lộ trình cho vị trí ReactJS từ 2 năm kinh nghiệm: JavaScript, TypeScript, React, state, REST API, responsive, performance, Git và cách phối hợp trong dự án outsourcing Nhật. Có câu hỏi tự kiểm tra, ví dụ và bài tập thực hành.
Mở bộ ôn tậpBUILD_QUEUE
Sản phẩm chưa cần giả vờ đã xong
Trang dự án sẽ có cả bản thử nghiệm và bản phát hành. Mỗi mục phải nói rõ trạng thái, điều đang học và đường dẫn có thể kiểm chứng.
Xem hàng đợi// RECENT_DROPS
Ghi chú gần đây
LocalStorage: lưu trạng thái ứng dụng và game web
Đọc và ghi localStorage an toàn: JSON hỏng, phiên bản save, và những thứ không được lưu ở đây.
Quản lý state trong React: Context, Jotai và Zustand
Chọn useState, Context, Zustand hoặc Jotai theo tần suất đổi và phạm vi dùng, không theo độ phổ biến.
Triển khai website tĩnh lên Cloudflare Pages
Cấu hình Next.js static export và các mục build của Cloudflare Pages, gồm những gì host tĩnh không chạy.
TypeScript trong React: các pattern hữu ích
Các kiểu hay dùng cho props React: union phân biệt, component generic, và satisfies cho cấu hình.
Web Audio API: tạo âm thanh tương tác trong trình duyệt
Tạo tiếng ngắn bằng AudioContext: chờ cử chỉ người dùng, nối gain, và tránh ramp tới 0.
// SKILL_TREE