Build Spotify With Flutter - Bloc , Clean Architecture , Firebase , Figma

[@FlutterMapp]

Is it just me or the Flutter Guys are just great? The "I don't want to waste your time" at the start is cool, you just go straight to the point, I love it!. Thanks for creating huge projects like this 💪

[@flutterguys]

Love you my bro 🤜🤛 The best of the best ✌️

[@barziyassin1]

A simple tip, if you wanna full screen vscode with visible emulator, you can press ctrl+alt+b to open secondary sidebar, then you can place the emulator in it, don't forget to set the emulator visibility to always on top. (not possible in mac)

[@flutterguys]

Thank you for tip, I will try this.

[@aditya-dev-diaries]

I swear to god, i love you bro. I have been looking for this specific time, however with no luck. Thank you 🥹

[@Emerald_Institute]

this is the only thin i leanrt from this video

[@terrencebeckham3689]

Wow didn't know that

[@ziya.5788]

Thanks!

[@fiuzzii]

thank you a lot bro, very good tutorial with clean code and explanation. Support from italy

[@flutterguys]

Glad it helped

[@ZenReview]

Wow 🎉🎉🎉, I'll learn a lot from this video. Thank you!

[@flutterguys]

So glad!

[@Dipankarr_]

Great tutorial brother. Support form 🇮🇳

[@vitoramaral2929]

This is the best flutter tutorial, thanks :)

[@vlknkc]

The project is very beautiful. However, it would be nice if you create a separate branch for the UI parts before uploading to github. In this way, you can start developing the UI quickly without wasting time.

[@cromuelbarut4903]

awesome as always TDD with DDD on your next series will be even more awesome

[@paulosoares8626]

Start to watch, thanks !!!

[@paulosoares8626]

Hello from Brasil, thank you for your free tutorial it is help me a lot !!!

[@flutterguys]

Obrigado por seu apoio! 😁

[@MrCamdere]

U got i keep going with tut like this brother

[@rishabhdevchandrakar2957]

well done bro this amazing tutorial make such project and help us to learning flutter

[@syarifsaiya1040]

awesome video, learn a lot from this 🔥🔥

[@flutterguys]

Glad to hear it!

[@samtekh9696]

Awesome! For a full stack developer who needs to delve into flutter, do you recommend I get started with this? Thanks in advance!

[@ericmphalela2210]

As a beginner nope....you know you always have to get the basics first...

[@LukaMutyaba]

Bravo. Well done Sir.

[@sonphanthien6448]

Thanks For this tutorial.

[@yantech.4249]

Amazing work Sir

[@barziyassin1]

Thank you for this treasure!

[@flutterguys]

Our pleasure!

[@alirezashekoohian8595]

Thank You for this tut ❤❤

[@flutterguys]

You're welcome 😊

[@OCTsecond]

Thank for good course. I have a question can you explain in 2:33:20, why auth.dart in Domain layer depend on CreateUserReq in the Data layer ? i think Domain layer should not depend on Data layer like that.

[@seunekunkoya251]

i have been following the tutorial all along but when I code signup_signin page the theme changed to light mode by default, how do I get it to dark mode?

[@kevlubhaop9358]

Hey , There is a bug in your code : When we are into profile page and remove song from favorite list and go back to home page it still shows that song as favorites and same scenario happens when we add song in favorites from music player and go back to home page that simply dont show as favorite. Pls giude me on how to resolve that

[@kushalhemanth7045]

It is saying Unhandled Exception: Stack Overflow while i am clicking on sign up can i get any help regarding this.

[@murilonascimento272]

Muito top! Parabéns pelo vídeo!

[@Amir-bd4uk]

Thank you so much ❤

[@Scars_Music]

Hey bro, could u tell me what extensions you are using for Flutter development in VS Code this vedio?

[@flutterguys]

Really nothing, There is no need

[@FrasesdelCheito]

I downloaded the code, I opened it, it gives me errors, I don't know how to test it, anyway, I can't use it... the Figma thing came out without any problems...

[@stellarcreed]

Nice tutorial, But it has a little bit wrong file structure It should be: --features ----auth --------data --------domain --------presentation ----feature 2 --------data --------domain --------presentation So it doesn't create any confusion between distinct features.

[@flutterguys]

In some cases you can't call feature for example for splash page or home page and so on... Also, Maybe you will have some usecases which is shared between features and in this way you can't use that usecase outside of that feature.

[@user-Farooqzx]

@@flutterguys create core package

[@stellarcreed]

​@@flutterguys then this usecase (model/entity etc) shoule be in a "shared" folder

[@flutterguys]

@@stellarcreed Actually Clean Architecture is not about folders or names , it is about seperation concerns

[@stellarcreed]

​@@flutterguys You just make your life difficult. It's a little bit messy and difficult to share features between projects, it's just impossible to copy some feature from one project to another one. The structure I made above is much simpler

[@ziadassem1849]

Great tutorial, but when i finished the project i had a small bug that is annoying me. when i remove a song from favorites and go back to playlist, the new state of the favorite button isnt emitted to the playlist page, so the button remains as it is even tho it is removed from firebase favorites and favorites page

[@flutterguys]

So we need to fetch again, You can fetch list of songs on home page again when you wanna remove, To do this you need to access to song's bloc on song detail.

[@indrasaputraahmadi3449]

awesome as usual. thanks!

[@professionalheadbanger9439]

This is a great job, thank you so much for this tutorial. I have a problem: I created a SplashPage exactly as in the video, but I still get the default Flutter SplashPage. What could I have missed?

[@demigodtherapper483]

problems in this course:- 1.3:52 doesnt explain the reason behind creating those folders

[@flutterguys]

Study about clean architecture

[@jessekanadi]

I have been following this and tutorial is easy to understand, But I have a problem. My navigation isn't working and there is no single error in the code. I tried different ways to achieve Navigation but it all failed. Can someone help me?

[@umaisfayyaz]

Hi brother love your tutorial but can you please specify if we can create category and then have the categoized songs Is it possible?

[@ariba.dev10]

amazing vuideo just make these type of whole project videos from scratch

[@jaysinhchauhan5688]

Is there any specific reason for not using Named routing over here and Mediaquery for giving sizes

[@surbhipaliwal3576]

how to access this design on figma what to do go after link

[@nilangagayashan5650]

thanks bro😍😍🥰🥰

[@mohammedhaseeb9937]

Which architectures are used for folder structure, such as MVC, MVVM?

[@flutterguys]

Clean Architecture

[@-IT-KumarTe]

Where I can download the satoshi font

[@RishabShrestha]

I am probably dumb for this but the section where he implemented the auth using getit dartz i didnt understand it what do i need to study to understand that man

[@Flutter_Senpai]

Amazing thanks for this great effort ! what do you use for handling responsive ? do you use external libraries or just media query and expanded/flex ?

[@flutterguys]

For responsive it is better to have multi layouts and use flex,expanded and ...

[@alithamer3260]

awesome tutorial,, ❤ I have faced errors with logic of dark mode not working,, got error when i Tapped Exception caught by gesture The following UnimplementedError was thrown while handling a gesture: Unimplemented Error

[@swaraj7710]

check the source code side by side

[@alithamer3260]

@@swaraj7710 i was matching side by side ,, but still i did not find the issue

[@creativestudio-f4m]

@@alithamer3260 same issue i am also facing why?

[@bhaskarrajaryal6678]

I am also facing the same. were you able to solve it?

[@swaraj7710]

@@bhaskarrajaryal6678 yes

[@jaysinhchauhan5688]

What to do if user zoomed the display from phone settings please make a video regarding this as it is a legit problem in flutter to manage a scalable app

[@lyricalway2769]

My text color in the snackbar is similar with its background and similar for both modes which is making me harder to view the message inside it. Anybody can help??

[@bukor0su368]

I can't sorry

[@ldsone-z4l]

The style of the directory is very beautiful.Can you tell me what plugins were used?Thank you very much.

[@flutterguys]

Atom

[@ldsone-z4l]

@@flutterguys Thanks

[@_PrachiPatel]

How can I get the access to the figma design

[@aarongranz2408]

can i ask something ? in my firebase if i want to get a database on firebase it must to pay , can i use another database like supabase?

[@flutterguys]

Yes you can

[@xenowarp]

Is this a full fleged course or there are other part that need to buy ??

[@flutterguys]

full fledged

[@xenowarp]

@@flutterguys Thank you so much .. 😍

[@theZenyx]

Why this problem happening? The pubspec.yaml file is there, but it's still not working anyone help: Error: No pubspec.yaml file found. This command should be run from the root of your Flutter project.

[@flutterguys]

Try flutter clean

[@keithbacalso9433]

it couldve been better if TDD is used here, but anyway this helps me alot too especially about clean architecture with bloc thanks!

[@theprantadutta]

where are the songs and covers file?

[@imheretosleep]

*why would you create a specific splash screen?*

[@thuglifegaming10]

personal classes/tuition available for flutter ?

[@rishishah8327]

where to get the songs from?

[@hussainuk3674]

what is the flutter sdk version of this project?? who can tell me ???

[@bukor0su368]

I can't tell you sorry

[@arashshirali3397]

song has delay how we can solve that problem?

[@arashshirali3397]

You can use plugin for making varibles of your assets

[@flutterguys]

I recommend you to make the project less dependent on the library

[@jeromestsauver]

Wonderful! 1 Question how do you feel about creating the clean arch within feature folders rather than at the root of lib?

[@antoniofuller2331]

No good coder makes stuff at the root of lib lmao

[@antoniofuller2331]

No good coder makes code at the root of lib lol

[@flutterguys]

Clean architecture is not about folders. You can go with layer first or feature first, But you must implement the philosophy of clean architecture in your code. You can make the project based on features, no problem, this is a personal thing and depends on the programmer. What is important is to establish the principles of communication between the presentation layer and the logic and services.

[@Kdndbshjnskks]

hello, I want to ask, thank you, I can make the application, but I want when the list of one of the songs is clicked a mini player will appear, I have tried it by using pinch and throwing the parameters correctly but the mini player does not appear, error message: range is empty= 0, I've spent 1 week on this, and it hasn't worked😢🙏

[@flutterguys]

@@Kdndbshjnskks Just do it like tutorial

[@Kdndbshjnskks]

@@flutterguys yes, thank you, I have done it like a tutorial and completed the application, but I want features like Spotify, if one of the songs is clicked a player deck/miniplayer appears with a condition, but I am confused because it is different from routing/push navigation which can throw parameters directly , I hope you can help me🙏

[@Kuba-xf3gi]

what's the reason behind puting colors etc into a class? MyColors for example

[@flutterguys]

@@Kuba-xf3gi Manging app colors from one place

[@Kuba-xf3gi]

@@flutterguys Yea but if u would put them just straight into file that's not the same?

[@flutterguys]

@@Kuba-xf3gi Dart is a class based language you have to use class not global variables

[@Kuba-xf3gi]

@@flutterguys Ok, thanks

[@from_whatch]

ohh nice ❤

[@antoniofuller2331]

I'm just surprised this video is 7 hours. I was expecting 2, or 3 at most.

[@busezengin-d6o]

Hello, I followed your code step by step and implemented Firebase Firestore as well, but I can't fetch the cover and songs. They are not appearing on my page, and I'm not getting any specific error. Could you please help me?

[@flutterguys]

I think Firebase is banned in your countries.

[@younesferhat6092]

Same here, but as i know it’s not banned in France

[@banamalinayak4673]

It is not banned kindly help to fix this issue ​@@flutterguys

[@Nope-q5u]

did u solve it?

[@banamalinayak4673]

Unable to load the images

[@adibazmainsami2412]

Hello, how this android emulator came out ?

[@roy3268]

does it run on background if we mininimize the app?

[@flutterguys]

@@roy3268 No but probably I will work on this feature

[@divyanshsoni314]

Which vs code themes and tools are you using buddy ?

[@flutterguys]

Athom

[@wilmygonzalez5715]

What VS Code Theme do you use ?

[@flutterguys]

Athom

[@wilmygonzalez5715]

@@flutterguys thank you.

[@sauravgupta579]

Can someone please explain me difference in entities/repositories under domain vs models/repositories under data?

[@armaan5413]

what ive understood so far is that to keep keep the core business logic and business implementation separate, there are two layers namely data and domain. The domain layer contains the business logic, the repository in domain layer only contains the CONTRACT(abstract interface classes) and the data layer actually interacts with the backend and hence the repository in data layer actually contains the implementation of the contract we created in domain layer I might be wrong about this but i think both entity and models are same but just to keep the data separate in data and domain layer , the model has separated them The data which will be used throughout the applications comes under entity/model for example : for a feature like Authentication domain: repository -> will contain the contract like abstract interafce login, signup, logout domain: entity -> will contain the User object which will be used throughout the auth feature data : repository -> will have the actual implementation of login, signup data : models -> will store the User object returned by the backend server

[@sauravgupta579]

@@armaan5413 Thanks dude!

[@aymanoor9634]

i had found the same error i.e. following infact i have write the project path accurate why? >flutterfire configure FlutterAppRequiredException: The current directory does not appear to be a Flutter application project.

[@ushibuii8702]

configure your path variable bro

[@ushibuii8702]

oh or you are using fluuter fire in cmd rather than project terminal

[@няє-в4н]

Cloud storage is paid, so tell me about any other storage, bro?

[@ariramadhan2217]

yeah google start being sucks

[@quanne1381]

oh so if we want to access any, we have to paid??? omg, not like used to be above 5gb :

[@Be_Confident11]

Create react native tutorial it's very helpful.

[@unicorn-thirteen]

Thank you very much for the video! I wanted to ask you how to implement a like button so that it reacts instantly. Currently, your button reacts only when the data comes from the database, but it waits for the data, which takes a long time, doesn't it?

[@flutterguys]

You can save it locally and then send it to the server so that the user does not understand this delay.

[@unicorn-thirteen]

@@flutterguys You are a superman, good luck to you, thank you very much 💥

[@flutterguys]

@@unicorn-thirteen Thanks for your support ❤️

[@abineldhose9921]

life saver

[@MinhZen]

I have a question: can this application play music in the background?

[@flutterguys]

No, but maybe I will work on it.

[@Victor-dd7el]

nice, It would be great a tutorial with supabase

[@GorgeReyes-b2j]

Hello, how are you, first of all, excellent Tutorial video. I'm starting to implement the Bloc pattern, and I've had some complications. I was thinking if you could make an example of creating an “App Blog” or something similar in which state management can be used with the bloc pattern, (create data, get data, update data, and delete data). It would be excellent for learning. It is a nightmare for users who start with state handlers, especially newbies, well I hope one day to see something similar on this channel. Thank you…👍

[@flutterguys]

Noted

[@GorgeReyes-b2j]

@@flutterguys 😀

[@Ashu17-y5n]

bro pls make a full beginner to advanced flutter course

[@flutterguys]

Will do soon

[@mahdiabedzadeh]

awesome

[@flutterguys]

Ghorbanat

[@_PrachiPatel]

Is it functional or just a ui?

[@flutterguys]

Functional

[@antoniofuller2331]

What I will learn. . .

[@sadaqatmustafa4638]

Hey guys. I hope you all are doing well. Just a quick question can I use Get x state management instead of Bloc?

[@flutterguys]

Yes you can

[@sadaqatmustafa4638]

@@flutterguys right. And what will be the changes in the project structure?

[@funnydogs9410]

vidmate app??

[@flutterguys]

@@funnydogs9410 What?

[@funnydogs9410]

@@flutterguys make vidmate app clone

[@mugerwaobadiah1621]

Nice tutorial, kindly drop one with rest api not firebase

[@AliJawad-q5d]

Vscode theme?

[@flutterguys]

Athom

[@Cikoi]

why? for what? tooo much folders (

[@chocollateszz2445]

bro, then how to install at android?

[@flutterguys]

Run flutter build apk --split-per-abi in terminal

[@antoniofuller2331]

​@@flutterguyswhat about IOS??

[@flutterguys]

@@antoniofuller2331 It is preferable to compile your app and put it on testfligth (appstore) in order to be able to test it on other iOS devices

[@ЕруланКайырбеков-я7х]

🤩🤩🤩

[@funscape23]

amaz

[@tecky_world]

why did u delete ur ecom playlist ..

[@flutterguys]

@@tecky_world I didn't delete I'll upload full course soon

[@tecky_world]

@@flutterguys It was perfect, as part by part was easy to understand, rather than uploading a lengthy video .. When u r planning to upload

[@tecky_world]

@@flutterguys Any update, on when u will upload the videos, as I am stuck in the halfway

[@flutterguys]

@@tecky_world I'm updating souce code everyday you can check it I think I will finish entire course in 2 weeks

[@tecky_world]

@@flutterguys aren't you, uploading videos. the way of teaching is very understandable. At least upload how many videos u have, so that it will help most ppl like me to understand the bloc and clean architecture.

[@mahdiabedzadeh]

صدا آشنا 👽

[@flutterguys]

😂😂❤️

[@Pressurehandler228]

Firebase free or not?

[@zeynalunlu8568]

hey Will you share the source codes?

[@flutterguys]

Check description

[@sachinGupta-kk5yq]

Does this follows MVC?

[@flutterguys]

Clean Architecture

[@Liv_Life]

It Follows solid principle far better than MVC I guess

[@antoniofuller2331]

​@@Liv_Lifetrue

[@azeemhassanch]

Bloc structure is overkill, for any size of application. And overkill for mobile memory

[@ЗайлабидинСулайманкулов-й7ч]

Как перевести на русский язык?

[@gautampatoliya6872]

Where is the demo? Very disappointing 😐

[@flutterguys]

@@gautampatoliya6872 Demo is design

[@NicolaHartman-e6p]

Allen George Hernandez Melissa Williams Melissa

[@tooffey]

very difficult for a beginner to understand

[@0xkyge]

Yes, but it is gonna be easy after you know the logic of coding itself I started learning now but I understand because of knowledge I got from react