Movie Browser – Ứng dụng khám phá phim bằng React & TypeScript (dự án cá nhân)
Dự án cá nhân do mình tự thiết kế, lập trình và triển khai (không phải dự án cho khách hàng).
Movie Browser là ứng dụng web giúp người dùng khám phá phim: xem danh sách phim thịnh hành, phổ biến, đang chiếu và sắp chiếu, tìm kiếm theo tên phim và lưu phim yêu thích. Dữ liệu lấy từ TMDB API.
Những việc tôi đã làm:
- Xây dựng giao diện responsive bằng React, TypeScript và Tailwind CSS; có giao diện sáng/tối, hiệu ứng animation bật/tắt theo cài đặt giảm hiệu ứng của hệ thống
- Tìm kiếm có trì hoãn (debounce), từ khóa được lưu trên URL để dễ dàng chia sẻ liên kết và dùng nút Back/Forward của trình duyệt đúng cách.
- Trang phim chi tiết có dạng cửa sổ (modal) gắn với route, gồm các thông tin: điểm đánh giá, ngày phát hành, thể loại, thời lượng, mô tả, trailer, diễn viên và đội ngũ làm phim (khi có dữ liệu)
- Danh sách yêu thích và giao diện sáng/tối được lưu trong trình duyệt
- Xử lý các trạng thái đang tải (skeleton), danh sách trống, mất kết nối và lỗi API; tự thử lại khi gặp lỗi mạng
- Dùng hàm serverless trên Vercel làm proxy để khóa API không bị lộ ra trình duyệt, chỉ cho phép các đường dẫn cần thiết
- Triển khai trên Vercel
Công nghệ: React, TypeScript, Vite, Tailwind CSS, TanStack Query, React Router, Zustand.
Sản phẩm sử dụng TMDB API nhưng không được TMDB chứng nhận hay bảo trợ.