1. Tính năng chính:

• Đăng nhập : hỗ trợ đăng nhập với Google/Github và tài khoản local của backend. Có khả năng hỗ trợ đăng nhập với các nền tảng được liệt kê tại đây: https://nextauth.js.org/providers/
• Nghe nhạc với:
  • audio track ở footer
  • wavetrack khi xem chi tiết
• Comment theo thời gian của wavetrack
• Tạo playlist, thêm tracks vào playlist
• Like tracks
• Upload tracks
• Với giao diện admin: CRUD users/tracks/comments...

2. Công nghệ sử dụng

Frontend:

• Client: Nextjs 14, MUI (typescript). Login with Next-auth (hỗ trợ đăng nhập Google/Github và Credential Provider (backend))
• Admin: Vite, Antd (typescript)

Nextjs:

• Nextjs 14 với App Router (typescript)
• Nắm vững các kiến thức thay đổi của Nextjs:
  • Dùng server action để thực hiện like hoặc comment một bài track
  • Routing (dynamic routes, route groups)
  • Data Fetching (Server component vs Client component (use client))
  • Authentication with Next-auth (sử dụng Session/JWT/Refresh Token)
  • SEO (mức basic, test với lighthouse built-in extension)

• Rendering:
  • client side rendering (CSR),
  • server side rendering (SSR),
  • static site generation (SSG),
  • incremental Static Regeneration (ISR)

3. Giao diện

SEO score

Homepage

Track detail

Search

Playlist

Like page

Upload page

Profile page

SignIn

Users page (Admin)

Tracks page (Admin)

Comments page (Admin)