Skip to main content

NextJS Clone Spotify

주요 기술스택/기능​

Tech stack

  • Next 14, zustand, react-hook-form
  • Supabase(OAuth, Storage), PostgreSQL, Stripe(결제)
  • Tailwind CSS, @radix-ui, react-hot-toast, react-icons

Feature

  • 음악 썸네일 및 파일 업로드
  • 음악 검색
  • 좋아요 한 음악
  • 내 라이브러리

ref​

Installed Package​

yarn add zustand

yarn add @supabase/supabase-js
yarn add @supabase/auth-helpers-nextjs
yarn add @supabase/auth-helpers-react
yarn add @supabase/auth-ui-react
yarn add @supabase/auth-ui-shared

yarn add stripe
yarn add @stripe/stripe-js

yarn add @radix-ui/react-slider
yarn add @radix-ui/themes
yarn add @radix-ui/react-dialog
yarn add react-hot-toast
yarn add react-spinners 
yarn add react-icons 
yarn add tailwind-merge

yarn add react-hook-form
yarn add @types/uniqid -D
yarn add uniqid
yarn add query-string
yarn add use-sound

vscode extension​

  1. Tailwind CSS IntelliSense

  2. ES7+ React/Redux/React-Native snippets

  • rafac