What is Flutter?

all right so the first thing that I want to talk about is what exactly is Sutter and to be able to answer this question we first have to put ourselves into the mind of a mobile app developer so here's one this is Bob and he's an iOS developer now Bob made this really cool app where instead of matching with other people you get to match with foods and you get to figure out what food you most want to eat and it's a super popular app everybody loves it but there's just one problem it's only on iOS so every other day he gets a question of when's it coming to Android when is it coming to Android when is it coming to Android and at some point he finally has had enough and he's decides to go and buy loads and loads of books study Java study Android development and finally he's able to have both of these buttons on his website get it on Google play and download on the App Store so he now has the same app on the Google Play and the App Store now this is great for the users but for Bob it means that when he has any updates that he wants to make to the app or any bug fixes he has to push those both to the Play Store as well as the App Store so two places now instead of one and he has to maintain two code bases so that's a lot of work down the line it's basically double the amount of work that he used to have but that's not all because he gets complaints from users saying that hey um in your app some of the layouts look really weird it doesn't look right like why is this button like twice the size of everything else what is wrong with your app now this is because not only does he have to support a huge array of different screen sizes and aspect ratios for the iOS ecosystem the iPads the iPhones the older iPhones but he also now has a whole bunch of Android devices and because Android device as can be made by literally anybody the number of different screen sizes is just massive and it's really hard to keep on top of what are all of the different screen sizes in order to be able to design your app to look good on all of them now here's where flutter comes in the guys at flutter had this question more and more so we're seeing screens everywhere the screens on fridges there's screens at the bus stop there's screens in your mirror and they're all different aspect ratios and different screen sizes so why can't we create something that can intelligently and easily allow developers to design beautiful interfaces for all of these different types of screens and this is exactly what flutter is it's simply a toolkit that makes it easy for developers to design beautiful interfaces for all sorts of screen sizes and devices and it comes with a whole bunch of pre-built widgets that make it easy to layout your app so straightforward things such as laying out your app with rows or with columns or stacks and it borrows some of the concepts from web design where you can have things that are centered or have padding's and margins and what if you could use this system to design and develop for almost any device because all that flutter does is it asks for a blank window on the device so be it on Android or iOS or web or desktop all it's asking for is just a simple blank window and what flutter will do is it will draw onto that blank window whatever it is that needs to be rendered and whatever animations or interactions or changes it's all painted on by flutter so this means that instead of having to make iOS apps the Apple way and make Android apps the Android way you can simply use a whole bunch of pre-built widgets from flutter such as a floating action button or a linear progress indicator and you can simply put these into your app no matter which platform you're working on and they've even design widgets that look the part for each platform so for example the alerts might look like this on your Android app but you can also specify that if your app is being run on iOS then they should look like this making your app look like it was created in a native way this is how flutter works you get access to a whole bunch of widgets so you can see these widgets as Lego blocks almost and by plugging them together and customizing it you end up with your beautiful app that can be deployed almost anywhere let's take a look at how easy it can be working with widgets in real life I've created a blank app and I'm gonna go ahead and add an app bar and this is a pre-built widget which is built by flutter and as soon as I hit save my app bar gets painted onto the screen so I don't like it in blue so let's customize it to change it to red so now I add a colors widget and I change the color so now let's add a text widget that adds a title to the app bar and just like Lego I've plugged together all my widgets and I've managed to build my app bar in a matter of seconds and there's loads of different widgets that are pre-built for example if you wanted a floating action button then we just create that widget and we can customize it by changing its properties such as the background color or what should go inside it piece by piece widget by widgets I can build up my app and customize it to my liking very few lines of code now what if I wanted some functionality well I can simply create a variable to keep track of say the number of donuts that I've eaten in a day and I can change my text field to embed that number variable in there and then all that happens is when the user presses on the read button then it will increase the number of donuts that I've eaten and flutter makes it incredibly easy to build a beautiful interface for our app using these widgets as well as allowing us to customize the widgets to our liking and finally building functionality on top of those widgets is also as simple as updating a number of variables and that we're gonna dive into so now that I've created my donut counter app the best part is I can now deploy that code to all sorts of different devices and platforms without having to rewrite the code or learn a new technology a new skill or a new programming language

Channel: London App Brewery

Views: 506,134

Rating: 4.9099436 out of 5

Keywords: Flutter, Dart, Development, App, App Brewery, iOS Android, Make, Learn, Crash, Course, Beginner, Programming, Coding, Bootcamp, Mobile, React Native, Cross Platform, Google, Hummingbird

Id: I9ceqw5Ny-4

Length: 7min 53sec (473 seconds)

Published: Fri May 03 2019