Aldi Ramdani.

    Spotify Clone

    aceternity logo
    esc
    F1
    F2
    F3
    F4
    F5
    F6
    F7
    F8
    F8
    F10
    F11
    F12
    ~`
    !1
    @2
    #3
    $4
    %5
    ^6
    &7
    *8
    (9
    )0
    _
    + =
    delete
    tab
    Q
    W
    E
    R
    T
    Y
    U
    I
    O
    P
    {[
    }]
    |\
    caps lock
    A
    S
    D
    F
    G
    H
    J
    K
    L
    :;
    "'
    return
    shift
    Z
    X
    C
    V
    B
    N
    M
    <,
    >.
    ?/
    shift
    fn
    control
    option
    command
    command
    option
    full-stack

    Spotify Clone

    FullStack

    Spotify Clone

    Key Features:

    • Song upload
    • Stripe integration
    • Supabase and PostgreSQL Database handling
    • Tailwind design for sleek UI
    • Tailwind animations and transition effects
    • Full responsiveness for all devices
    • Credential authentication with Supabase
    • Github authentication integration
    • File and image upload using Supabase storage
    • Client form validation and handling using react-hook-form
    • Server error handling with react-toast
    • Play song audio
    • Favorites system
    • Playlists / Liked songs system
    • Advanced Player component
    • Stripe recurring payment integration
    • Write POST, GET, and DELETE routes in route handlers (app/api)
    • Fetch data in server React components by directly accessing the database (WITHOUT API! like Magic!)
    • Handling relations between Server and Child components in a real-time environment
    • Cancelling Stripe subscriptions

    Tech Stack:

    Next JS
    Tailwind
    Stripe
    Supabase

    Keywords:

    #Spotify
    #Clone App
    #Next JS
    Back