Chào các bạn!

Mình vừa mới làm một side project để cập nhật công nghệ mới nhất về React stack. Shopping Cart của mình được build bằng TypeScript, NextJS, React, Redux, Apollo Client, Shopify Storefront GraphQL API, ... và Material UI.

Sau đây là kinh nghiệm mình thu được sau khi làm dự án này:

  • Sử dụng React Hooks thay vì of React.Component để tạo stateful components.
  • Sử dụng Redux Starter Kit để đơn giản hóa việc cấu hình Redux và làm được nhiều việc hơn với ít code hơn.
  • Làm cho Redux chạy ngon với NextJS bằng withRedux.tsx higher order component.
  • Sử dụng react-redux hooks thay vì react-redux connect để đọc và cập nhật trạng thái (state) của store.
  • Sử dụng kiểu dữ liệu tĩnh của TypeScript cho Component Props, Reducers, Actions và các Services.
  • Sử dụng GraphQL Code Generator để tự động tạo models cho TypeScript.
  • Làm việc với GraphQL tags nhanh hơn với Apollo GraphQL for VS Code extension.
  • Làm cho Apollo Client chạy ngon với NextJS bao gồm cả server side và client side.
  • Có thêm kinh nghiệm khi làm việc với Shopify Storefront GraphQL API.
  • Làm cho Material UI chạy ngon với NextJS với withMui.tsx higher order component.
  • Cấu hình Eslint & Prettier để lint và format mã nguồn.
  • Triển khai các ứng dụng NodeJS trên Heroku.

GitHub Repository: https://github.com/Maxvien/next-shopify-storefront

Nếu bạn thấy dự án thú vị thì thả cho mình một star nhé! ⭐️