In Mobile App Development
How to build any kind of app in Flutter (and overcome Tutorial Hell) - read the full article about flutter app development, Mobile App Development and Native and cross-platform solutions from Code With Andrea on Qualified.One
Youtube Blogger
- [Instructor] One question that people often ask me is how do I build an Uber clone, or an eCommerce app or a food ordering app for my grandma in Flutter? And while my full time job is to create Flutter tutorials and courses, I dont have the time to make tutorials for every app out there.
Most importantly, you shouldnt need to rely on tutorials in order to build your own apps.
So today I want to share my mental process for how I build complex apps, along with some tips about how to learn effectively.
In fact, Im gonna tell you all about how I built this complex habit tracking application, which is the main project of my latest Flutter course, and it includes a lot of custom UI and animations.
But before we get to all of this, let me tell you how I think about coding.
And the way I see this, is that building apps is a bit like playing Legos.
And when you play Lego, you can make complex things by putting together smaller building blocks, which are made of, well, Legos.
And when it comes to app development, you make complex apps by putting together smaller building blocks made of code.
So if you wanna get good at build complex Flutter apps, you need some in-depth knowledge of the Dart language, and the Flutter foundations and APIs.
These are your tools for the job, and you need to learn them well, but thats not enough.
Youll also need to know about solid programming principles, design patterns, how to debug your apps, as well as some core packages, so that you dont have to reinvent the wheel.
And of course, there is a lot more, and learning all of this takes time.
But what takes even longer is trying to build a complex app before you understand the foundations well enough.
And if you dont have a solid foundation, youll struggle, get stuck, and wait hours or days for an answer on StackOverflow.
However, once you do have a solid foundation, youll have at least some sense for how to proceed without much outside help.
And all this sounds nice, but what if you are not there yet and you dont know how to build complex apps? And as it turns out, I spent the last few months building a complex app myself and creating an entire Flutter course about it.
And Im about to share how I did it.
And this was a challenge for me because this app has a lot of custom UIs and animations.
And I didnt know how to implement many of these features upfront, nor did I know much about Flutter animations before I started.
And even though I went through lot of trial and error before completing this project, I did not get stuck, and found a solution to every problem I faced along the way.
So how did I do it? Well, the goal of this project was to create a working clone of an existing app.
So I downloaded the Streaks app from the App Store, and spent a lot of time figuring out what were the main building blocks and how each feature could be implemented.
And I even reverse-engineered the entire design so that I could create a complete set of styles and themes that I could use in the code.
And some of the most challenging features were an animated task completion ring controlled by a tap-and-hold gesture, and a 3D page flip transition that could be triggered programmatically or with gestures, and completely custom animated theming, with multiple color themes, and multiple variants for each theme.
And when I started I had no idea how to build any of these features, but I knew that they all involved animations.
Luckily, the Flutter documentation has a very good introduction to animations, along with a lot of video tutorials, and codelabs I could use to get some practice with the basics.
So I read the documentation multiple times, and then I tried to create a mental map of which animation APIs could be used for which app features.
And then I started building the features, one at a time.
And some things, such as the task completion ring, were not too complex because I already had some prior knowledge about how to use custom painters and explicit animations.
but other things like the page flip transition were out of my league, and I didnt see an obvious way to apply any of the Flutter animation APIs to get the effect that I wanted.
So what did I do? Well, I went online, and I quickly found a couple of tutorials that set me in the right direction.
And then I experimented with the code from one of the tutorials, breaking it down and re-assembling it, just like you would do with Legos, and I created my first solution from it.
But the sample code wasnt good enough for my use case, and I wanted to take things further.
And at this stage, what I didnt do was to go back online looking for other tutorials.
Rather, I improved my solution with what I learned from the Flutter documentation, creating something entirely new that no one had done before.
This was valuable, so I decided to open-source it as a free package that could be used by others.
And I also shared my own tutorials about how I created it.
And the takeaway here is that sometimes there just isnt a ready-made tutorial or package for what you need.
So you need to build things from scratch or by combining whats already there.
And this is a great way to learn.
And if you figure out something hard, then you can share the result for bonus points.
So how did I manage to build this app without getting stuck? Well, even though I was creating a clone of an existing app, I have chosen an app with complex animations on purpose, and I have faced many challenges along the way.
But how I was able to take on a complex app in the first place is that I was comfortable with all the fundamentals.
I never had to worry about what syntax to use, because I know Dart very well and my code was well organized from the start, because I know how to write maintainable code and I encountered errors along the way but I didnt get stuck, because I know how to debug and use DuckDuckGo, and the same can be true for you.
And Im not saying that you can master Flutter app development in a few months.
Im saying that learning the foundations well will save you a ton of time going forward.
But lets get back to your problems.
And you may still be stuck not knowing how to build that Uber clone or e-commerce app or to-do list for your grandma.
And I get it, every app is different and has different requirements.
And youll always encounter things that you dont know.
But rather than watching tutorial after tutorial after tutorial, and trying to learn how to build app X, focus on the fundamental techniques and design patterns used to build mobile apps.
And learn how to debug your apps using breakpoints and the Flutter inspector.
And learn how to make the most of StackOveflow and dont just copy paste the code that you find here.
In fact, when I need to go online and find answers, I ask myself, is this answer a good match for my use case? Does it fit well inside my codebase, or do I need to tweak and rewrite it? Will it work for all edge cases? And do I understand this code completely? And if not, I dig deeper and try to gain deeper knowledge.
And if you do this over and over, youll get super-powers because youll become stuck less often and manage to solve things without asking and waiting for help.
Youll also build muscle memory about what works and what doesnt.
And all of this is to say that you can go a long way just by reading the documentation and practicing things.
So that leaves us with a question, and that is are tutorials and courses a waste of time and money? After all, the number one advice given to people stuck in tutorial hell is build your own apps.
And thats how I have learned, and how I still do things today.
But you know what? I have 15 years of experience and I still buy courses, when I know that they will save me time.
And if a topic or language or package is well documented and easy to understand, then you dont need a tutorial or course about it.
But thats not always the case.
And sometimes its more time-effective to take a good, well structured course to learn about a specific topic in depth, especially if youre new to it, or you cant find what you need elsewhere.
So then the question becomes, where can you find good tutorials and courses? And this is a good question.
But an even better one is who makes them? And I think this is key because you want to learn from someone whos an expert in their field, and is good at explaining complex concepts concisely and in simple terms.
So hang out on Twitter and Reddit and figure out whos consistently posting valuable stuff.
And if you want, you can even discover the best developer blogs on any tech stack.
And as far as Flutter goes, this is what I strive to do, create good content and help others fast-track their learning.
For example, it took me 60 hours to build this entire app, and Ive condensed all my learnings into a seven-hour course covering Flutter animations in detail.
So if this is a topic that you need to learn about, then taking the course may save you a lot of time.
In summary, I see tutorials and courses and deliberate practice as complementary tasks.
And alongside reading the documentation, watching tutorials, and taking courses, you need to practice building apps by yourself, and learn from your mistakes.
And by creating a continuous loop of learning and practicing things, youll be able to progress a lot faster.
Note how this is a loop.
Its about practicing what you learn right after you learn it.
And if you only watch tutorial after tutorial after tutorial, you wont retain anything meaningful because you didnt practice.
Likewise, if you only ever practice on your own, then your coding style will suffer.
This is where joining open source projects and working with others can have an outsized impact.
And at the end of the day, a lot of this is about exposing yourself to different ways of doing things, learning trade-offs, and finding what works for you and your project.
And to wrap up, Id like to say that if youre looking for good resources about Flutter app development, you should check out my Flutter email course and newsletter.
I spent a lot of time putting together a curated list of resources, guiding you through the most important topics, and helping you choose the right tools and packages.
So my newsletter brings this all together into a single email course that you can join today for free.
So that is all for today.
If this video has helped you, please like and subscribe, and Ill see you on the next one.
Code With Andrea: How to build any kind of app in Flutter (and overcome Tutorial Hell) - Mobile App Development