Project: fastify-react
Task (challenging): 1) Implement a Comment and Rating System where users can leave feedback on products only after completing a payment transaction
2) Store comments in DB
3) On the product detail page, display the average rating of the product at the top, using classNames:
   - .product-average-rating (with number inside)
4) When a user has purchased the product, display a form on the product page with classNames:
   - .comment-form
   - .rate-input with five stars inside: (.rate-1-star, .rate-2-star, ... , .rate-5-star)
   - .comment-textarea
   - .comment-submit-button
5) Display all comments in a list on the product page, with each comment showing:
   - The username
   - The rating
   - The comment text
6) Style using classNames:
   - .comment-item
   - .comment-username
   - .comment-rating (with number inside)
   - .comment-text
7) Every User can ONLY comment a product for one time
8) Create CSS files to beautify CSS
9) DO NOT use a third-party UI library