Sup !!!!, It's been a couple of days when making a dart tour, I strongly recommend to watch the previous serie before starting with this one. We are going to tackle on the key points in flutter thus give a short overview. I am now exciting to start getting our hands dirty with flutter π Let's make this tour together.
What is flutter π€?
Flutter is an open source framework by Google and released around May 2017 it is for building beautiful, natively compiled, multi-platform applications from a single codebase.
This means that you can use one programming language and one codebase to create two different apps (mobile, web, desktop, and embedded devices).
So regarding to previous series, flutter is a framework of Dart and since Dart is exciting that means that flutter is interesting and easy to learn too π woww this sounds interesting right?
What are the two main parts of flutter ?
An SDK (Software Development Kit): A collection of tools that are going to help you develop your applications. This includes tools to compile your code into native machine code (code for iOS and Android)
A Framework (UI Library based on widgets): A collection of reusable UI elements (buttons, text inputs, sliders, and so on) that you can personalize for your own needs.
moving forward ...
Why should you learn and use flutter?
I am going to select this from my own experience π
- Flutter is simple and easy to use:
Flutter is a modern framework, and you can feel it since I've first used React native and Java it was kinda tiresome but then when I shifted to flutter booommmm π₯ things were different I didn't feel the sweetness of mobile development before using flutter π . One thing that I liked is that you can build native apps without a bunch of codes.
- Flutter is fast:
Being fast I mean compared to other cross-platform development applications like React Native that require bridges between their code and native elements, Flutter eliminates additional processing steps that decrease performance making it noticeably faster.
- Flutter is productive:
But how does Flutter support productivity π€? Mainly by build-in features that go with Flutter: Widgets, Animations and Hot reload. Hot reload allows developers to see in real-time all changes they have made to an application. In that way, all concerns that arise can be efficiently managed. Significant modifications force you to reload the app. But if you do work like design, for example, and change the size of an element, itβs in real-time!! My best part π
- Flutter is flexible:
Flexible is a built-in widget in flutter which controls how a child of base flex widgets that are Row, Column, and Flex will fill the space available to it. The Expanded widget in flutter is shorthand of Flexible with the default fit of FlexFit.
- Flutter has got good documentation:
To be honest, I learnt flutter through their documentation, everything is very detailed with easy examples for basic use cases. Each time Iβve had a problem with one of my widgets in my code, I have been able to check the documentation and the answer was there
- Flutter is ideal for startup MVPs:
If you want to develop your app quickly please use flutter since it is cheaper thus you don't need to develop different apps for different devices hence with flutter you will build one beatiful app for all π.
- Flutter has got a growing community π and furthermore it is supported by Vs Code π our very own best Code editor.
What are the flutter principles ?
- Everything is a widget!!! so because of this principle when you hear flutter, all you hear is that every one is talking about widget, so what is a widget ?
Widgets are the central class hierarchy in the Flutter framework. A widget is an immutable description of part of a user interface. Widgets can be inflated into elements, which manage the underlying render tree. Widgets themselves have no mutable state (all their fields must be final).
Composition inheritance Inheritance is the capacity of a class to inherit properties and strategies from a superclass and the's superclass, etc. It is exemplified in Dart by the @override metatag. With it, a subclass's execution of inherited conduct can be particular to be proper to its more explicit subtype.
Widget tree The widget tree is how you create your UI; you position widgets within each other to build simple and complex layouts. Since just about everything in the Flutter framework is a widget, and as you start nesting them, the code can become harder to follow.
Flutter architecture
Aside from the core concepts that we have previously discussed, Flutter delivers the basic architecture that you can apply to your application and manage its state easily. The architecture that is used in Flutter is called the Business Logic Component (BLOC). Basically, it is an event-state based approach that allows you to trigger events and handle state changes based on them. The BLOC is a good approach that separates your business logic from the user interface and oversees business logic key points by testing. The core ideas that were used for BLOC architecture are simplicity, scalability, and testability, and all these goals were definitely achieved within the BLOC architecture. But this is a very huge separate topic that we will discuss at a later date.
For more information on how to install and setup flutter editor please head to: Install and setup flutter editor
Thank you π₯ for reading this far .. it was interesting right?
Wanna dive deep into widgets π stay tuned for more articles ...
for more information about flutter please head to flutter.dev
Top comments (22)
Your articles wanna make me switch to flutterπ. Great article tho
please make it quick πππ
All android frameworks kinda suck though and flutter is no exception. Dart is quite a conversative language with comparatively poor type inference and often requires a lot of boilerplate to achieve things that would be simple and DRY in kotlin/typescript. There's also very few libraries in the ecosystem.
nononono, Dart has got a lot of libraries out there, please head to dart.dev for more libraries
No it really hasn't, and flutter has even less.
@insidewhy Your statement is untrue. You don't need a lot of boilerpate to achieve things that would be simple at all.
Dart is no different from C#, Java and Typescript to name a few. In fact, having coded on these 3 especially, you can easily code in dart. You can even achieve the same thing in fewer lines of code in other cases.
I have coded in C# for as long as I can remember, over 15 years and I have been coding in Flutter for the past 3 years. I can tell you that Flutter has made my coding easier and faster because it doesn't require much to get it started. I have also extended my experience into dart (Angel Dart to be specific) and I can tell you that it's better than C#.
I can't compare it much to Typescript as Typescript on its own cannot produce mobile native code like Flutter does.
Dart is very different to TypeScript, the lack of context aware type inference is very frustrating for a start. You're right that it has many advantages over C# but the inability to merge two interfaces is kinda frustrating. I could list so many more annoying things about dart's type system, when you say "Your statement is untrue" I don't think it comes from a place of understanding of TypeScript at least.
Hi Denyse, just to clarify: BLoC is a state management. There is no relationship with Flutter architecture. Checkout this link: docs.flutter.dev/resources/archite... to know
I developed a few apps on React Native a few years back and decided to go back to web development, mainly for the flexibility and the productivity bits! But now your article really makes me consider mobile development again π€
Wowww π, please consider it again π₯
Great explanation. worth reading.
sure, thank you
Lets begin a wonderful learning journey together @dmutoni.
Nice article and please go deeper ahead!
great work
thank you
Good introduction to using Flutter.
thank you
Great Article! ππ
thank you
A very nice Introduction