Your task are:

• Design Figma Categories Page (include mobile and desktop). refer to design of udemy:

1. Mobile like this:
   

2. When click on Filter on mobile, display drawer side bar of Filter, like this:
   

3. Desktop like this:
   
   But I want you to use grid layout: Each row has 3 or 4 model (depends on breakpoints: md, lg, xl,...), refer to thingiverse:
   

4. Both mobile and desktop have pagination bar, like this:
   

Your task is:

• Design detail page for one 3D model, refer to udemy and thingiverse

1. Mobile like this:
   
2. Please, add some small pictures below main picture and "Button to select quantity", like this:
   
3. You have to responsive for desktop, using grid layout (2 columns):

• Left column contains main picture and sub pictures.
• Right column contains description, metadata, prices,...
  Like this:
  

4. Remember that there are always two button Add to cart and Buy now in both mobile and desktop:
   

Your tasks are:

• Design Shopping Cart Page (include mobile and desktop), refer to udemy

1. Mobile like this:
   
2. Desktop like this:
   
3. Please remember to allow user change number of each model 3D in both mobile and desktop, like this:
   

• Design Checkout Page (include mobile and desktop), refer to udemy

1. Mobile like this:
   
2. Desktop like this:
   
   
3. Notice: Payment method only acceps 2 method:

• Cash On Delivery
• Pay via Momo

Your task is:

• Design a dashboard page for manager, content included:

1. Statistics of 3D models by category (this pie chart is reasonable).
2. Statistics of the top 10 best-selling models.
3. Statistics on how many models are uploaded in a week/month/quarter.
4. Statistics on profits earned by week/month/quarter (this is usually a line chart).
5. Statistics on how many new users and how many users use the system in a month

Your tasks are (free style design):

1. Design and implement a banner slider, refer to udemy:
2. Design and implement contact information, refer:
3. Design and implement best seller, refer:
4. Design and implement footer, refer to udemy:

Introduction:

1. Clone `tick3d-fe

Your task is:

• Design of Model Page for admin, using grid layout with 2 columns:

1. Column 1 (width 1/4): All the information: name, photo, discount, button edit, button delete,... Plus 2 more information: creation date and deletion date.
2. Column 2 (width 3/4): Just to show the chart and information of users who ordered it:
   • 1/2 height above: Please see what chart you need to draw for the detail page of a product on a sales website. In my opinion, these 2 charts are suitable:
     • Statistics on the frequency with which that model is ordered per month.
     • Statistics on % of revenue in category and % of total system revenue (so admin can decide whether to delete it or not)
   • 1/2 height below: Displays users who have ordered these models, can be presented in table form -> beautiful

Your task is:

Write a short report introducing the technologies used in the project (only needs 2 A4 pages), including:

• ReactJS (Javascript library for front-end).
• Fastify (Nodejs framework for back-end).
• Prisma (ORM for Nodejs).
• PostgreSQL (DBMS).

Please use typst to write report in repository tick3d-docs.