Trang tài khoản và danh sách quan tâm

Trong bài viết này chúng mình sẽ hướng dẫn cho các bạn trang Cá nhân. Trang cá nhân là nơi sẽ chứa những thông tin sơ bộ về người dùng như là avatar hay tên, đồng thơi cũng chưa những số liệu liên quan như là số lượt bài đăng được thích hay tổng số lượt xem bài đăng.

Tổng quan

Trang cá nhân là nơi sẽ hiển thị những metric cơ bản về người dùng(Số lượng lượt xem những bài họ đăng, lượt thích những bài họ đăng). Tên, avatar và mục, danh sách quan tâm(những bài họ bấm quan tâm). Page liên quan đến trang này là account.jsx.

Server

Model lưu thông tin người dùng là user.js

Mỗi khi vào trang này chúng ta cần gọi api lấy các số liệu như là tổng số lượt thích vào tổng số lượt xem, 2 api này được thể hiện đây

Trang tài khoản

Component sử dụng cho mục tên và avatar người dùng là UserCard(tham khảo user-card.jsx). Những thông tin về người dùng như tên hay avatar sẽ được chỉ fetch lấy một lần khi login và được lưu trong store để lấy lên mỗi khi switch sang trang này.

Trang bài viết quan tâm

Được thể hiện trong file care-list.jsx. Phần này không có gì đặc biệt. Data vẫn được fetch mỗi khi tải lại trang(useEffect). Tái sử dụng lại component Category(tham khảo file Category.js).