Google Flutter Mobile Development Quick Start Guide

2.7 (3 reviews total)
By Prajyot Mainkar , Salvatore Giordano
  • Instant online access to over 8,000+ books and videos
  • Constantly updated with 100+ new titles each month
  • Breadth and depth in over 1,000+ technologies

About this book

Flutter is a cross-platform mobile application development framework. It uses the Dart programming language, which was created by Google, and aims to make development easier, faster, and more efficient. This book is going to be your guide, from introducing Flutter to successfully developing a cross platform application.

In the first few chapters, we will learn what Flutter is and how to get started with it. We will also take a dive into the widgets world, explore the widget catalog, and learn how to navigate through it. In the next few chapters, we will widen our horizon by learning about networking and accessibility with Flutter. We'll learn what Silvers are and how to use them, and we'll also learn how to use constraints and animations. Before we take a look at how to deploy our applications in Flutter, we will use Firebase for cloud messaging and remote configuration.

By the end of the book, you will have learned everything you need to know to get started with your journey of cross-platform mobile development with Flutter.

Publication date:
March 2019
Publisher
Packt
Pages
152
ISBN
9781789344967

 

Introducing Flutter

Flutter is a application development framework from Google for creating cross-platform mobile applications (in iOS and Android). As mentioned on the official website (https://flutter.io/), it aims to make the development as easy, quick, and productive as possible. Things such as Hot Reload, a vast widget catalog, very good performance, and a solid community contribute to meeting that objective and makes Flutter a pretty good framework.

This book is going to be a guide for you in your journey from getting started with Flutter to eventually deploying your applications on it. But, before that, let's have a quick introduction to Flutter.

In this chapter, we will cover the following:

  • The origin of Flutter
  • What is a widget?
  • Comparing Flutter to existing frameworks
 

The origin of Flutter

The origin of Flutter was similar to that of a lot of famous software. It was developed at Google. Initially, Flutter was an experiment, as the developers at Google were trying to remove a few compatibility supports from Chrome, to try to make it run smoother. After a few weeks, and after many of the compatibility supports were removed, the developers found that they had something that rendered 20 times faster than Chrome did and saw that it had the potential to be something great.

Google had created a layered framework that communicated directly with the CPU and the GPU in order to allow the developer to customize the applications as much as possible.

 

What is a widget?

Everything in Flutter can be created using widgets. Orientation, layout, opacity, animation... everything is just a widget. It is the main feature of Flutter, and everything from a simple button to an animation or gesture is done using widgets. And this is great because it allows the users to choose composition over inheritance, making the construction of an app as simple as building a Lego tower. All you do is just pick up widgets and put them together to create an application.

There are a number of fundamental widgets that will help you build an application with Flutter. All these widgets are cataloged in the Flutter Widget Catalog. Because everything in Flutter is made up of widgets, the more you learn how to use, create, and compose them, the better and faster you become at using Flutter. We will be going into much more detail about widgets and the widget catalog in Chapter 3, Widgets, Widgets Everywhere

 

Comparing Flutter to existing frameworks

When speaking of mobile application development, there are many different approaches that we can find, but, in the end, everything comes down to either a native or a cross-platform approach. Let's see how different approaches look and work when compared to Flutter. We will first take a look at the native platforms, and then, before looking at the cross-platform approach, we will take a look at the WebView system, and finally we will see where Flutter fits into this mix.

Native platforms

Native frameworks such as Android and iOS SDKs are rock solid. They are the most stable choice for mobile application development. They have lots of available apps that are deeply tested and have a large community and openly available tutorials. The following diagram displays the working of native mobile application development frameworks:

As we can see in the preceding diagram, the app in this framework talks directly to the system. This makes the native framework the most powerful choice in terms of functionality. However, it does have a drawback: you need to learn two different languages, Kotlin or Java for Android, Obj-C or Swift for iOS and the SDKs. These languages are used to write two different apps with the same functionalities. Every modification must be duplicated on both platforms, and the process might not be that smooth. It is not a good choice for a small team or for someone who needs speed in their development process. 

WebView systems

On the other hand, we have the cross-platform approach, which is famous for being productive. In this approach, we can get the application for both Android and iOS from a single code base, just like in Flutter. But every framework has some drawbacks. 

Cordova-, Ionic-, PhoneGap-, and WebView-based frameworks in general are good examples of cross-platform frameworks, and they are especially good solutions for frontend developers. But these lack in performance, and the app view in these approaches is composed by a WebView rendering HTML; this means that the app is basically a website.

The following diagram shows how a WebView-based framework works:

The system uses a bridge to make the switch between JavaScript to the native system. This process will be too slow, depending on the features you need, which adds another drawback to this system.

Other cross-platform approaches

Let's take an example of another cross-platform approach to see what could be the shortcomings of it. Xamarin is the Windows answer to cross-platform development, which in my opinion is not so convenient, especially in terms of productivity and compiling time. 

When looking at other platforms, React Native could be considered as one of the best of the cross-platform frameworks, but it heavily relies on OEM components.

Lets take a look at the workings of React Native:

React Native expands the bridge concept in the WebView systems, and uses it not only for services, but also to build widgets. This is really dangerous in terms of performance; for example, a component may be built hundreds of times during an animation, but due to the expanded concept of the bridge, this component may slow down to a great extent. This could also lead to other problems, especially on Android, which is the most fragmented operating system.

Flutter's approach

In the previous sections, we took a look at different approaches to mobile application development. We have briefly seen how these approaches work and their drawbacks. Now let's take a look at Flutter.

Flutter performs much better in comparison to other solutions, because the application is compiled AOT (Ahead Of Time) instead of JIT (Just In Time) like the JavaScript solutions. It also eliminates the concept of the bridge and does not rely on the OEM platform. It does allow custom components to use all the pixels in the screen. What does this mean? It basically means that the app displays the same on every version of Android and iOS.

We did take a look at the workings of other approaches, so let's take a look at the workings of Flutter as well. You can see the way the Flutter framework works as shown in the following diagram:

Now you can see the difference between other cross-platform approaches and Flutter. As stated before, Flutter eliminated the bridge and the OEM platform and uses Widgets Rendering instead to work with the canvas and events. And it uses Platform Channels to use the services. In addition, it is not difficult to use platform APIs with an asynchronous messaging system, which means if you need to use a specific Android or iOS feature, you can do it easily.

Flutter also makes it possible to create plugins using channels that can be used by every new developer. So, to put it simply: code once, and use it everywhere!

 

Why use Flutter?

Flutter is a good option for cross-platform development due to its many features and a few things that it does differently than other approaches, as we have seen. It is not only a good option for the developers, but also for users and designers; let's take a look at why this is:

  • For users, Flutter makes attractive user interfaces for apps, and this enhances the usage of these apps by the users.
  • For developers, Flutter makes it easy for the new developers to enter the world of building mobile apps, as it is very easy to build apps with Flutter. Flutter not only reduces the time for development of applications, but it also reduces the cost and complexity of creating an application.
  • For designers using Flutter, an application can be created using the original design that was conceived for the application, without compromising on any aspect of it. Therefore, the original vision of the designer is not changed at the time of development.

Most important, Flutter is a very useful tool to create mockups and prototypes, which is a pro, as it is a good point of contact for both designers and developers, two roles often very distant from each other.

 

Summary

In this chapter, we first had a quick introduction to Flutter and how this book was going to serve as a guide for learning cross-platform application development with Flutter. We then moved on to discussing the origin of Flutter. Then, before moving on to why Flutter is a good option, we took a look at where Flutter fits in with the existing world of mobile application development.

Nowadays, mobile development is not really a new world, but Flutter makes it possible to make it more fun and much quicker. And, by improving the developer workflow, it brings mobile application development closer to a gameplay.

In the next chapter, we will install the Flutter framework and try to learn as much as possible from the sample app.

About the Authors

  • Prajyot Mainkar

    Prajyot Mainkar is the director of Androcid, a mobile app development company based in India. The company builds UI/UX and mobile apps for clients. He has been recognized as an Intel Innovator. Prajyot has been an avid programmer and speaker at over 300 mobile developer conferences across the globe. including Android Developer Days in Turkey, Droidcon Greece, Droidcon India, and many more. He is the chairman of the IT & Young entrepreneurship forum at the Goa Chamber of Commerce and Industry. He has been awarded the title of Young Entrepreneur of the Year by Business Goa and the GEMS Trailblazer award for his contributions to the field of information technology. He is on board as an adviser to many incubation centers across India.

    Browse publications by this author
  • Salvatore Giordano

    Salvatore Giordano is a 23 year-old software engineer from Italy. He currently works as a mobile and backend developer in Turin, where he attained a bachelor's degree in computer engineering. He is member of the Google Developer Group of Turin, where he often gives talks regarding his experiences. He is really passionate about cutting-edge technologies, always staying up to date with the latest trends. He has written many articles on Flutter and contributed to the development of a number of plugins and libraries for the framework.

    Browse publications by this author

Latest Reviews

(3 reviews total)
Excelente
Los contenidos contienen caracteres extraños donde deberian aparecer iconos e imagenes.
This is a really bad book that really won’t help anyone learn Flutter. it’s disappointing that Packt would associate their name with it.

Recommended For You

Book Title
Unlock this full book with a FREE 10-day trial
Start Free Trial