Tech Stack

AuthJS

S̶e̶r̶v̶e̶r̶ S̶i̶d̶e̶ A̶c̶t̶i̶o̶n̶s̶ w̶i̶t̶h̶ F̶o̶r̶m̶ &̶ A̶u̶t̶h̶J̶S̶ A̶P̶I̶ Authentication Feature Removed To Better ShowCase The Application with Account Creation

Tailwind

Utility Classes in Tailwind CSS For Faster Development

TanStack Query

Client Side State Management & Caching

Supabase

Row Level Security with PostgresSQL and S3 Buckets for audio files

Made Using: npx create-next-app@latest

Project Journey

A Fun and Challenging Development Experience

Inspired by a guest speaker from Amazon who introduced us to Bedrock, I set out to build a Spotify like app where users could log in, access playlists, and generate music with AI. AWS proved too complex for my timeline and quite pricey, so I pivoted to Hugging Face’s MusicGen API, choosing the small model to keep things simple and cost free.

Code Highlights

1 2"use server"; 3 4// The Authentication Feature Was Removed To Better ShowCase The Application Without Account Creation, 5// Since Not Every Body Wants To Make An Account For Everything 6 7import { auth, signIn, signOut } from "./auth"; 8 9export async function signInWithGoogleAction() { 10 await signIn("google", { redirectTo: "/studio" }); 11} 12 13export async function signInWithSpotifyAction() { 14 await signIn("spotify", { redirectTo: "/studio" }); 15} 16 17export async function signInWithGithubAction() { 18 await signIn("github", { redirectTo: "/studio" }); 19} 20 21export async function signOutAction() { 22 await signOut({ redirectTo: "/" }); 23} 24