Flutter Folder Structure and Packages

[@Lensbreak]

Please make tutorial: folder by feature architect + riverpod hooks + flutter hooks + firebase

[@davidowens9597]

Folders under lib: models, views, controllers, and services. MVC+S design pattern. The views folder has a folder for each page/screen with the page widget and all widgets on the page in the same sub-folder. Widgets used by multiple pages are in the root of the views folder.

[@JarkynbekBatyrov]

data -> models , services -> local , http ui -> screens -> screen1, screen2 widgets blocs -> bloc1, bloc2

[@math045b3]

I'm using by layer for my biggest project (also my first) and it's quite annoying, but changing it is also frustrating. For all other projects I use by features even for the small ones it makes so much more sense to me

[@somevideos99999]

Very nice work Robert, I've started using folder by feature. This really makes it easy to migrate to a package when needed. Best, Karl

[@RobertBrunhage]

Glad it was helpful and I agree!

[@SarveshBhatnagar1214]

This was informative. Thank you for the video, not many people have talked about this stuff before.

[@miroliebschner426]

Your videos are really the best out there. I haven't yet but I really consider donating via your Patreon which would be the first time I use Patreon ever.

[@RobertBrunhage]

Thank you so much it really means a lot! I am just super happy the videos are helpful, that was the goal all along 😊

[@PadamShrestha]

Waiting for a full project tutorial based on folder by feature architect + riverpod + flutter hooks 🤪

[@techzone2009]

I have built a project using riverpod and folder by feature ..chaiyo vaney dimla

[@PadamShrestha]

@@techzone2009 sure.

[@juniordev4190]

@@techzone2009 If you could write. Project nai chaiyena baru euta blog with examples vae ni hunxa.

[@gyakhoe]

Mine is folder by feature but I make additional folder(as per folder by layer) inside each feature lib --feature1 ----ui ----bloc ----data --feature2 ---ui ---bloc ---data

[@MdSiam-kw5ox]

Thanks for this video man. 👍

[@arsarsars1able]

Good information, helpful for big projects.

[@RobertBrunhage]

Thanks! The more we know the more educated decisions we can make 😊

[@arsarsars1able]

@@RobertBrunhage yeah ✌

[@nikhilkukreja8498]

Thank you so much Robert. I generally used to make screens,models kind of structure. But folder by feature is really great approach i liked it. And i have already subscribed to your emails on your website. God bless you always :)

[@RobertBrunhage]

Glad I could be of help Nikhil! I appreciate all the support you give 🙏

[@MrVipulLal]

Good one, sir! Thanks

[@AkashdeepSingh-my9rr]

This is really awesome. I'll follow up this structure . Thanks 😊

[@RobertBrunhage]

Glad you found it helpful!

[@moazelsawaf2000]

Very very very great video ❤ I was looking for a way to make my code reusable to use it in multiple projects and I've found it! ❤ Thanks a lot, sir ❤

[@ianmcelvain9627]

The Stacked pattern from FilledStacks makes the most sense to me for production. This brings a lot of folders and .dart files into your structure but in my experience, most of the time it’s better to work in laid out, readable projects/code than it is to work with condensed code or folders in the effort to look clean and efficient.

[@RobertBrunhage]

Hmm I am not quite sure I follow, you can still follow @FilledStacks pattern but create everything in the same file if you want to (not recommended). The folder structure is not a rule and should (most of the time) change depending on how projects grow (in my experience). I have background in Angular and they have great documentation on how they do folder structure (LIFT) which I like a lot. In the end, this is to provide knowledge and not decide how you SHOULD do something 😊

[@ianmcelvain9627]

@@RobertBrunhage I completely agree with this and I wasn’t trying to come off as one rule for all, that goes against programming and general engineering. This is just my preference, as you said in the video to drop them in the comments. I come from (day to day) C, C++ mainly for game engine programming so things like grabbing resources outside the folder dir of the script, I’m used to. General app development and web have always looked very messy to me, almost unstable in both conventions and methodology of making systems. The pro of that is that there is a lot to learn from the methods on the internet. One of the biggest practices is separating business logic from UI and that’s why when I refer to Stacked I also mean the minor folder structure convention that is with it because the interpretation of that methodology of separation makes sense to me. But preferences aside, your videos are extremely helpful and shine a light on production practices that are shadowed when first learning Flutter. E.g., creating an actual AppName.dart/class to be called into void main() instead of having main + MyApp class in one file lol so minor but helps start clean code.

[@RobertBrunhage]

@@ianmcelvain9627 Oh hope I didn't come off as rude, it was not my intention! Sorry if that was the case. Thanks for sharing your experience and I think many will benefit from it! Thanks for the support and super happy you liked the video :)

[@ФирузВорисов]

Hi KZbinr! Thank you! I liked this video. I was struggling with adding dependency in Flutter project which dependencies were ignoring each other. The Package Structure Folder approach gives me an idea how to handle that issue. Nice job!

[@rsajdok]

I have had a problem if should I use struct by layer or feature and how to separate a part of application for another one. Now, it seems clearly for me, thanks

[@RobertBrunhage]

Awesome, glad it helped!

[@d34dsouI]

Thank you Robert. Could you please make a video for explaining repository-services-stores-ui layered architecture especially suggested by mobx? Especially, I don't get what is repository and services layers and how to create and use them.

[@RobertBrunhage]

Will write it up, I want to cover more architecture approaches as well!

[@geraldcampana9296]

cant wait hehehe!

[@albanr8028]

Exactement le tutoriel que je recherchais ! Merci !

[@patricklearn6536]

Amazing video thank you!

[@letsclode]

Been waiting for this.

[@hawkybae]

Folder by feature works for me. Definitely going to look into creating packages for reusable functionality! Thanks. Also any hints on what the upcoming course maybe about? 😉

[@RobertBrunhage]

Super happy you liked it! Want to have project based courses so we will see 😊

[@i.k.shaikh3772]

Very well done ✅

[@RobertBrunhage]

Many thanks!

[@danielm3977]

Thank you Robert. Very informative video. Just a newbie question: In the Controller folder, What types of structure we put in. Tbh I googled it but not sure if I know exactly what "Controller " is. Best wishes.

[@RobertBrunhage]

These folders were just examples, if you are not using those in your projects you won't be using that folder! It was just for illustrational purposes

[@adambartosik357]

thanks for this video! ;-) Good explanation of Packages / Modules

[@workflop4117]

Thank you so much amazing video 😍

[@YazeedAlKhalaf]

I made a vs code extension for making my folder structure, tell me what you think? GitHub: github.com/YazeedAlKhalaf/Stacked VS Code extension link: marketplace.visualstudio.com/items?itemName=YazeedAlKhalaf.stacked

[@priyanshparmar819]

I wanted to integrate notification in my project. I am using folder by feature approach. Where should i add notification functionality, should i create new feature for managing notifications?

[@OtarBediashvili]

Great video and great explanation, thanks. pub get button seems useful. How can we get it?

[@RobertBrunhage]

Hmm I just always had it so thought everyone did haha

[@mortenfriis]

It should be available to you when you're in the pubspec.yaml file.

[@OtarBediashvili]

Yeah, that's correct

[@fabsync]

Robert.. thanks a lot for this video.. I think I would love to see the structure of a one of your big projects in a video.. There are many challenges also (I think) in terms of organizing big projects by features...specially when in a big project you may have 50-120 pages and each page may have 10 to 50 features..

[@RobertBrunhage]

It depends on how small you think of features. I work at a very big company where folder by feature is implemented (or in android by module) which works great and that project is huge. I suggest giving it a try :)

[@fabsync]

Thanks Robert! Modules grasp better the concept for me than features :)

[@RobertBrunhage]

@@fabsync You can do pretty much the exact same thing with dart packages if you prefer that more! There are no hard rules here, just do what makes most sense!

[@madhusudhanr3527]

Thank you very much. I always have problem with the folder structure. BTW How do we create package like @personal/auth, @personal/database etc?

[@RobertBrunhage]

What do you mean with @personal/? You can define it however you want aslong as you reference the correct path and that it is a package :)

[@madhusudhanr3527]

@@RobertBrunhage I meant like naming packages like npm private packages.

[@RobertBrunhage]

@@madhusudhanr3527 Have not tried that so if you do, let me know of the results!

[@madhusudhanr3527]

@@RobertBrunhage Thanks for the reply and will surely let you know if it works. A suggestion for future video. "SSL pinning in flutter apps"

[@RohanSingh-qg1jw]

I'm pretty new to coding- what are controllers and repositories?

[@alihesari2703]

great great great

[@mruduladdipalli5417]

Awesome

[@replicasensei1204]

Intuitive....tnks

[@tasehagi]

Hi. Thanks for the video. I have one question: how does modifying a local dart package work? Do I see the changes immediately? Do I need to run 'pub get' again? Also I see your website is a ReactJS app 😂

[@RobertBrunhage]

You will see the changes immediately! Yes, sadly Flutter Web doesn't have the things I want right now (especially as I am moving to Next.js soon) :(

[@dhanniekristanto]

@@RobertBrunhage actually I'm planning to try flutter web for personal site. There's also something I want but still couldn't do it in flutter. Webview(type: script, link: gist link). anyone know a package with that kind of feature? by the way, great video, learn something new. Thanks Robert

[@m.sulthanalihsan464]

thanks man, i like your video..

[@fethi2436]

What is the theme you are having on vs code, folder icons look nice

[@lambda-dev]

I think it is material icon theme, looks great :)

[@SamSam-rg4lk]

In Folder by Feature structure, what's the difference between a repository and a service?

[@lambda-dev]

I use repository for infrastructure, so storing data or calling apis. Services should contain and transform business logic independent of the view. Hope this helps :)

[@RobinJesba]

What Theme do you use for VS code?

[@RobertBrunhage]

One Dark Pro :)

[@budisetiawan2499]

well the packages structure is the default structure in android studio so i would suggest anroid studio, IMPO

[@rebarius]

🍪🍪🍪 All my cookies for you 🍪 never thought of structure by feature 🍪

[@RobertBrunhage]

It's super easy to work it, and I like it a lot :)

[@void4904]

I would be really happy with English subtitles 🤣

[@nagcvlogs]

How can i give 1Million likes to this video......

[@RobertBrunhage]

If you click a lot of times and really fast maybe we can get 1 like on it!!!!

[@sergiorodrigoroyo5079]

I can't believe some people still structure folders by layer. It must need some real inclination towards BDSM.

[@hosannaamane6031]

Awesome \(uu)/

[@RobertBrunhage]

Thanks, glad you enjoyed it!

[@munawir7013]

sub english please

[@ThEGeEeK]

Please make tutorial: folder by feature architect + riverpod hooks + flutter hooks + firebase