Building a Spotify Clone with Flutter, Python and FastAPI - Full Stack Development with MVVM Architecture

Overview

Build a full-stack music streaming application similar to Spotify in this comprehensive 10-hour tutorial that demonstrates modern development practices using Flutter and Python. Master the MVVM architecture while creating a feature-rich frontend with Flutter and Riverpod for state management, complemented by a robust backend using FastAPI and PostgreSQL. Progress through hands-on development of essential features including user authentication with JWT, song upload functionality with Cloudinary integration, an intuitive music player interface, and background playback capabilities. Implement local data persistence using Hive for recently played tracks, create a responsive audio wave UI, and develop a complete favorites system. Gain practical experience with database normalization principles, API integration, and full-stack development workflows while building a production-ready music streaming platform from scratch.

Syllabus

⌨️ Introduction & Prerequisites
⌨️ Project Installation
⌨️ Flutter Installation & Boilerplate Code
⌨️ MVVM Architecture + Feature-wise Development
⌨️ Signup Page UI, Theming & Form
⌨️ Login Page UI
⌨️ Virtual environment, FastAPI Setup, Exploring FastAPI, Docs
⌨️ Signup API Route, PostgreSQL Setup & SQLAlchemy
⌨️ Code Refactoring - Signup API
⌨️ Login API Route
⌨️ Psycopg2 error!
⌨️ Client Side Login & Signup Route Integration
⌨️ Auth View Model - Introducing Riverpod Generators, Lint!
⌨️ Running on Android Emulator
⌨️ Persisting Auth State & Getting User Data - JWT
⌨️ Upload Song Page UI, Picking Color, Audio & Image Files
⌨️ Testing on Android, Audio Wave UI
⌨️ Uploading Song Data - PostgreSQL, Cloudinary
⌨️ Song ViewModel - Upload Song
⌨️ Home Page Bottom NavBar
⌨️ Fetching & Displaying All Songs
⌨️ Playing Songs in Flutter from anywhere in the app
⌨️ Music Slab UI
⌨️ Music Slab Functionalities - Play/Pause Music, Display Song Progress
⌨️ Music Player UI & Functionalities
⌨️ Storing, Fetching & Displaying Recently Played Music - Hive
⌨️ Playing Background Music in Flutter
⌨️ Favorite Music - Backend, Frontend Displaying Fav Music
⌨️ Conclusion