TOP 5 Beginner MISTAKES In Flutter

today we are going to take a look at the top five things that I see beginners make in flutter if you like these kind of videos please let me know by liking subscribing to the channel you can also support me down in patreon as you can find that in the description so special thanks to Shannon Galloway for supporting me there and let's get started so here we have a super simple project I have done nothing except removing all of the comments so the first thing is not separating the main method from your first widget so here we can see an example what the initial project actually does is that we have this main method and we also have this my app so what we should do to keep this more separated is actually move away my app into a different class so let's go here I'm just going to create it right in the root directory of the Lib folder let's call it something like my app and this is what you would probably call then your application and simply take all of this code and do the necessary imports and then of course that would also mean in the test so here we can see that we now have two files that is the main file which is the entry point for the application and ever have my app which is the first widget that actually gets used from Maine and this way we have a lot better separation of our code and that's the first thing I do for all of my applications so for the second mistake that I see quite often is when you are having a quite huge of a build method instead of separating it out into private widgets so we see quite often that we separated out two normal widgets where you can reuse into multiple files but something that is quite nice is also to have a private widgets so you can easily see the flow of that build method so just to show you an example going back to the code and we can close down may now as we're not using that so here we can see this is a very simple application but here we can see the example at least so for now we have a text which is that you have pushed a button this many times and then you have the counter so let's say your bill method is a lot bigger and you have multiple texts and columns and each of those can be separated into its own parts but you don't want them to be classes that you can get from other files then what you could do is actually take these two and separate them into its own widgets so in this example it's actually the whole column or the whole Center so for example we can take this whole Center widget and we can do extract widget and we can make this private by adding a underscore and we can give this some name so for example counter body so by separating this out we can now easily see that we have this build method with a body of a counter body where we used past the counter so for bigger classes or widgets you can actually separate it out to different parts so for example let's say you have a app and you have multiple parts in that body then you can separate those out to private widgets and this lets you easily unlikely limbs see how your actual widgets is built because most of the time you are actually looking at those specific parts and here we can easily see that okay something is wrong with my counter then we can go to the counter body and see what the layout is there and if something is wrong let's say that the mini is misspent or something like that and that makes it a lot easier to actually navigate code and we don't have this huge build methods so the third mistake is actually a bit more abstract but I used wanted it to be out there because this is quite important and that state management is not everything for an flutter application and what I mean with that is that there are multiple parts in building applications and not just the way of how you manage state so for example one thing that you want to keep in mind is for example the architecture of your application so you can more easily manage your application and for state management there are a bunch of different solutions there are mobile X this block this provider and the list goes on is probably like 20 or 30 different ones so used to peak something what google recommends right now is providers you just take that and just go with it and don't focus too much on the way you manage state the more important part is how you manage the actual architecture of your application so it's easier for you to navigate make changes or update your actual application so the fourth tip is actually also super important and that's actually testing your applications for multiple layouts so looking at this application this is a very simple application right so we have used that main body which shows the counter in the middle but what we actually have the opportunity to do is for example you can move to either use a package to show your application in different screen sizes easily in the same emulator or you can use flutter web so you can easily change the size of the window or use flutter desktop which is even easier to see because hot reload is working there so we have no actual excuse for not to making our applications responsive because we have so many ways of actually testing that I will link down in the description a package that I really recommend you can test that out and see your application in different views and coming to the fifth and final mistake that we're going to talk about is not used in a built in documentation and what I mean with that so if we go to an application here and we're going to close the video test let's say we want to use a list title in our application then of course we use the least time because it's very easy to use but let's say we want to make a custom list style and we don't know where to start off let's say we have a design in our mind or we want some kind of custom implementation of it or that you used to want to know how it actually works is that you can actually go into these and read the documentation and what flatty team is actually done is given us a very extensive and good documentation you can find exactly how this code is implemented how it's used and they have a lot of comments to explain everything for you and this of course you can find also in the documentation on the site but I find this very nice to have as it's quite often that you want to implement something but you'd really don't know how to do it but then you can take a look at the documentation of that already implemented widgets if you liked this video please hit that like button and also subscribe if you want to if you want to support me you can check out the patreon link down in the description it really helps me making these videos come to life and I will see you in the next video bye [Music]

Channel: Robert Brunhage

Views: 28,899

Keywords: Flutter, Flutter mistakes, Flutter beginners mistakes, top 5 flutter mistakes, top 5 flutter beginner mistakes, top 5 flutter tips, flutter tips, flutter for beginners, flutter tips and tricks, flutter tricks, flutter tutorial, flutter guide, Robert Brunhage, Flutter mistakes beginners make, Flutter state management, Flutter widgets, Flutter pro tips, Flutter pro, flutter clean code, flutter provider, flutter state management provider, flutter tutorial for beginners

Id: F9Z3KhhfwHU

Length: 8min 2sec (482 seconds)

Published: Sat Jul 11 2020

Reddit Comments

[u/joaquini]

TL; DR

- Separate your main app from the first widget
- Separate widgets in smaller widgets
- State management is NOT everything for a Flutter app (well, that's the opposite that has been said on an official Flutter talk)
- Test your app for multiple screen sizes
- Not consulting the documentation

[u/CompSciSelfLearning]

"I would have written a shorter letter, but I did not have the time." - Blaise Pascal