Flutter Full Stack Tutorial – Spotify Clone w/ MVVM Architecture, Python, FastAPI, Riverpod
Learn to build a full stack music streaming app very similar to Spotify using the MVVM Architecture. In this course, @RivaanRanawat uses Flutter for the app's frontend, FastAPI for the backend, PostgreSQL for the database, Hive for local data storage and Riverpod (Generators) for state management.
Project Source Code - https://github.com/RivaanRanawat/flutter-spotify-clone-tutorial
AppPallete Class GitHub - https://github.com/RivaanRanawat/flutter-spotify-clone-tutorial/blob/master/client/lib/core/theme/app_pallete.dart
FastAPI Documentation - Dependencies with yield - https://fastapi.tiangolo.com/tutorial/dependencies/dependencies-with-yield/
GitHub Assets - https://github.com/RivaanRanawat/flutter-spotify-clone-tutorial/tree/master/client/assets/images
Normalisation Principles - https://learn.microsoft.com/en-us/office/troubleshoot/access/database-normalization-description
Android Manifest XML Audio Wave Code:
```
configurations.all {
resolutionStrategy {
eachDependency {
if ((requested.group == "org.jetbrains.kotlin") && (requested.name.startsWith("kotlin-stdlib"))) {
useVersion("1.8.0")
}
}
}
}
```
⭐️ Contents ⭐️
⌨️ (0:00:00) Introduction & Prerequisites
⌨️ (0:01:42) Project Installation
⌨️ (0:03:15) Flutter Installation & Boilerplate Code
⌨️ (0:04:21) MVVM Architecture + Feature-wise Development
⌨️ (0:10:25) Signup Page UI, Theming & Form
⌨️ (0:48:32) Login Page UI
⌨️ (0:53:29) Virtual environment, FastAPI Setup, Exploring FastAPI, Docs
⌨️ (1:13:44) Signup API Route, PostgreSQL Setup & SQLAlchemy
⌨️ (1:54:55) Code Refactoring - Signup API
⌨️ (2:10:49) Login API Route
⌨️ (2:21:08) Psycopg2 error!
⌨️ (2:21:42) Client Side Login & Signup Route Integration
⌨️ (3:13:23) Auth View Model - Introducing Riverpod Generators, Lint!
⌨️ (3:53:35) Running on Android Emulator
⌨️ (3:56:00) Persisting Auth State & Getting User Data - JWT
⌨️ (4:59:44) Upload Song Page UI, Picking Color, Audio & Image Files
⌨️ (5:27:00) Testing on Android, Audio Wave UI
⌨️ (5:41:41) Uploading Song Data - PostgreSQL, Cloudinary
⌨️ (6:15:24) Song ViewModel - Upload Song
⌨️ (6:33:12) Home Page Bottom NavBar
⌨️ (6:43:28) Fetching & Displaying All Songs
⌨️ (7:14:07) Playing Songs in Flutter (from anywhere in the app)
⌨️ (7:26:01) Music Slab UI
⌨️ (7:41:31) Music Slab Functionalities - Play/Pause Music, Display Song Progress
⌨️ (7:56:55) Music Player UI & Functionalities
⌨️ (8:40:51) Storing, Fetching & Displaying Recently Played Music - Hive
⌨️ (9:04:53) Playing Background Music in Flutter
⌨️ (9:10:03) Favorite Music - Backend, Frontend (Displaying Fav Music)
⌨️ (10:04:05) Conclusion
? Thanks to our Champion and Sponsor supporters:
? Drake Milly
? Ulises Moralez
? Goddard Tan
? David MG
? Matthew Springman
? Claudio
? Oscar R.
? jedi-or-sith
? Nattira Maneerat
? Justin Hual
--
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
freeCodeCamp.org
Learn to code for free....