Beginning App Development with Flutter: Create Cross-Platform Mobile Apps
By Rap Payne
()
About this ebook
Create iOS and Android apps with Flutter using just one codebase. App development on multiple platforms has historically been difficult and complex. This book breaks down complex concepts and tasks into easily digestible segments with examples, pictures, and hands-on labs with starters and solutions.
In doing so, you'll develop a basic understanding of the Dart programming language; the entire Flutter development toolchain; the differences between stateful and stateless widgets; and a working knowledge of the architecture of apps. All the most important parts of app development with Flutter are covered in this book. Work with themes and styles. Develop custom widgets. Teach your app to respond to gestures like taps, swipes, and pinches. Design, create and control the layout of your app. Create tools to handle form data entry from users. And ultimately create killer multiscreen apps with navigation, menus, and tabs.
Flutter is Google's new framework for creating mobile apps that run on iOS and Android phones both.You had to be a super-developer to write apps for iOS or Android alone. But writing for both? Forget about it! You had to be familiar with Swift, Java/Kotlin, Xcode, Eclipse, and a bunch of other technologies simultaneously. Beginning App Development with Flutter simplifies the entire process.
What You'll Learn
Get the most out of great Flutter widgets
- Create custom widgets, both stateless and stateful
- Exercise expert control over your Flutter layouts
- Make your app respond to gestures like swiping, pinching and tapping
- Initiate async Ajax calls to RESTful APIs — including Google Firebase!
Who This Book Is ForDevelopers who have coded in Java, C#, C++, or any similar language. It brings app development within the reach of younger developers, so STEM groups are likely to pick up the technology. Managers, product owners, and business analysts need to understand Flutter's capabilities.
Related to Beginning App Development with Flutter
Related ebooks
Practical Flutter: Improve your Mobile Development with Google’s Latest Open-Source SDK Rating: 0 out of 5 stars0 ratingsDevOps in Python: Infrastructure as Python Rating: 0 out of 5 stars0 ratingsPro C# 9 with .NET 5: Foundational Principles and Practices in Programming Rating: 0 out of 5 stars0 ratingsRails: Novice to Ninja: Build Your Own Ruby on Rails Website Rating: 4 out of 5 stars4/5Regex Quick Syntax Reference: Understanding and Using Regular Expressions Rating: 0 out of 5 stars0 ratingsPractical Rust Web Projects: Building Cloud and Web-Based Applications Rating: 0 out of 5 stars0 ratingsModern Full-Stack Development: Using TypeScript, React, Node.js, Webpack, and Docker Rating: 0 out of 5 stars0 ratingsLearn Data Analysis with Python: Lessons in Coding Rating: 0 out of 5 stars0 ratingsLearn Rails 6: Accelerated Web Development with Ruby on Rails Rating: 0 out of 5 stars0 ratingsPractical Rust Projects: Building Game, Physical Computing, and Machine Learning Applications Rating: 3 out of 5 stars3/5Twilio Best Practices Rating: 0 out of 5 stars0 ratingsFlutter Recipes: Mobile Development Solutions for iOS and Android Rating: 0 out of 5 stars0 ratingsBeginning Rust: From Novice to Professional Rating: 0 out of 5 stars0 ratingsTest-Driven iOS Development with Swift Rating: 5 out of 5 stars5/5Application Development with Swift Rating: 0 out of 5 stars0 ratingsThe Full Stack Developer: Your Essential Guide to the Everyday Skills Expected of a Modern Full Stack Web Developer Rating: 0 out of 5 stars0 ratingsDesign for Developers Rating: 0 out of 5 stars0 ratingsVisual Studio Code Distilled: Evolved Code Editing for Windows, macOS, and Linux Rating: 3 out of 5 stars3/5GitHub A Complete Guide - 2020 Edition Rating: 0 out of 5 stars0 ratingsiOS 15 Application Development for Beginners: Learn Swift Programming and Build iPhone Apps with SwiftUI and Xcode 13 Rating: 0 out of 5 stars0 ratingsSoftware Mistakes and Tradeoffs: How to make good programming decisions Rating: 0 out of 5 stars0 ratingsBeginning Flutter: A Hands On Guide to App Development Rating: 0 out of 5 stars0 ratingsProgramming Kotlin Applications: Building Mobile and Server-Side Applications with Kotlin Rating: 0 out of 5 stars0 ratingsNode.js: Tools & Skills Rating: 0 out of 5 stars0 ratingsLearning Go Programming: Build ScalableNext-Gen Web Application using Golang (English Edition) Rating: 0 out of 5 stars0 ratingsBeginning Git and GitHub: A Comprehensive Guide to Version Control, Project Management, and Teamwork for the New Developer Rating: 0 out of 5 stars0 ratingsRuby on Rails Web Mashup Projects Rating: 0 out of 5 stars0 ratings
Programming For You
Learn PowerShell in a Month of Lunches, Fourth Edition: Covers Windows, Linux, and macOS Rating: 5 out of 5 stars5/5Excel : The Ultimate Comprehensive Step-By-Step Guide to the Basics of Excel Programming: 1 Rating: 5 out of 5 stars5/5Learn to Code. Get a Job. The Ultimate Guide to Learning and Getting Hired as a Developer. Rating: 5 out of 5 stars5/5Grokking Algorithms: An illustrated guide for programmers and other curious people Rating: 4 out of 5 stars4/5Coding All-in-One For Dummies Rating: 4 out of 5 stars4/5Linux: Learn in 24 Hours Rating: 5 out of 5 stars5/5SQL QuickStart Guide: The Simplified Beginner's Guide to Managing, Analyzing, and Manipulating Data With SQL Rating: 4 out of 5 stars4/5C Programming For Beginners: The Simple Guide to Learning C Programming Language Fast! Rating: 5 out of 5 stars5/5Excel 101: A Beginner's & Intermediate's Guide for Mastering the Quintessence of Microsoft Excel (2010-2019 & 365) in no time! Rating: 0 out of 5 stars0 ratingsPython Programming : How to Code Python Fast In Just 24 Hours With 7 Simple Steps Rating: 4 out of 5 stars4/5Narrative Design for Indies: Getting Started Rating: 4 out of 5 stars4/5HTML & CSS: Learn the Fundaments in 7 Days Rating: 4 out of 5 stars4/5PYTHON: Practical Python Programming For Beginners & Experts With Hands-on Project Rating: 5 out of 5 stars5/5Python QuickStart Guide: The Simplified Beginner's Guide to Python Programming Using Hands-On Projects and Real-World Applications Rating: 0 out of 5 stars0 ratingsPhotoshop For Beginners: Learn Adobe Photoshop cs5 Basics With Tutorials Rating: 0 out of 5 stars0 ratingsHTML in 30 Pages Rating: 5 out of 5 stars5/5SQL All-in-One For Dummies Rating: 3 out of 5 stars3/5The CSS Guide: The Complete Guide to Modern CSS Rating: 5 out of 5 stars5/5C++ Learn in 24 Hours Rating: 0 out of 5 stars0 ratingsJavaScript All-in-One For Dummies Rating: 5 out of 5 stars5/5
Reviews for Beginning App Development with Flutter
0 ratings0 reviews
Book preview
Beginning App Development with Flutter - Rap Payne
Part IIntroduction to Flutter
© Rap Payne 2019
R. PayneBeginning App Development with Flutterhttps://doi.org/10.1007/978-1-4842-5181-2_1
1. Hello Flutter
Rap Payne¹
(1)
Dallas, TX, USA
Picture this in your mind’s eye. You are the superintelligent and capable CEO of a new business. Obviously your mission is to maximize sales while minimizing expenses. Hmmm.
, you think. I can really increase sales if I make our products available on the Web.
So you ask your friends how to create a web app and they say ...
You need to hire a web developer. They should know HTML, CSS, JavaScript, and probably some framework like React, Vue, or Angular.
It’s expensive but you do it and your gamble pays off. Sales increase markedly. Trying to keep on top of demand, you monitor social media and engage your customers. You hear them say that this web app is great and all but We’d have been here earlier if you had an app in the App Store.
So you talk to your team who, while being experts in the Web, are not iOS developers. They tell you ...
You need to hire an iOS expert. They should know iOS, Swift or Objective-C, Xcode, macOS, and CocoaPods for development.
Your research shows that this person is even more specialized and therefore expensive than your web devs. But again, it seems to be the right thing to do, so you bite the bullet and hire them. But even while this app is being developed, you see that the feedback was not isolated to iOS apps, but instead was looking at all mobile devices. And – oh, snap! – 85% of devices worldwide run Android, not iOS. You bury your head in your hands as you ponder whether or not you can afford to ignore 85% of your potential customers. Your advisors tell you ...
You need to hire an Android expert. They should know the Android OS, Gradle, Android SDK, XML, Android Studio, and Java or Kotlin.
Really?!? Another developer?
, you say. Yes. And one just as expensive as your iOS developer,
they respond.
Isn’t there one person who can do all three things? Some way to share the code between all of those environments? Then you could hire just one person. In fact, they could write the code one time and deploy it to the Web, to the App Store, and to the Google Play Store. One codebase to maintain. One place to make improvements and upgrades. One place to squash bugs.
Ladies and gentlemen, allow me to introduce you to Flutter!
What is Flutter?
Flutter is a set of tooling that allows us to create beautiful apps that run on iOS, Android, the Web, and desktop.¹
Flutter is ...
Free (as in free beer. No cost)
Open source (that’s the other sense of the word free
)
Backed by and originated at Google
Being enhanced and maintained by a team of developers at Google and hundreds of non-Google contributors around the globe
Currently being used by thousands of developers in organizations across the world for production apps
Fast because it compiles to truly native apps that don’t use crutches like WebViews and JavaScript bridges
Written one place and compiled to a web app for billions of browsers, an iOS app for iPhones and iPads, and an Android app for all of the rest of the phones and tablets out there
Why Flutter?
Google’s mission with Flutter is ...
To build a better way to develop for mobile
Notice what is not in that mission. There’s no mention of Android (which is also owned by Google) nor of iOS nor of the Web. Flutter’s goal is to create a better way to develop for all devices. In other words, Flutter should be better to create iOS apps than Swift. It should be better to create Android apps than Kotlin. It should be better to create web apps than HTML/JavaScript. And if you get all of those things simultaneously with one codebase, all the better.
The Flutter team has succeeded spectacularly with this mission.
As proof, Eric Seidel offers this example.² The Google CRM team used Flutter to build an internal Android app and did it three times faster than with their traditional Android toolchain!
But it turns out that Flutter isn’t the only game in town for cross-platform. You have other options.
The other options
Cross-platform development comes in three general flavors listed in Table 1-1.
Table 1-1
Cross-platform development categories
If you have a captive audience, one where users value your app so much that they’re willing to accept a poorer user experience, the cheapest solution is to create a PWA. If your app is extremely naive and speed is not expected to be an issue, a hybrid solution might be appropriate. But if speed, smoothness, and sophisticated capability are important, you will need to go with a native solution.
Native solutions
As of today, there are four fairly popular compile-to-native solutions (Table 1-2).
Table 1-2
Compile-to-native cross-platform frameworks
These are all decent options. All are free to develop in and are well-tested, having many production applications created. All have been used in large organizations.
But only one has an option to create a web application in addition to the iOS and Android apps that will be deployed to the app stores – Flutter.
Flutter is the latest of these frameworks to be released. As such it has a distinct advantage of observing those that had come before. The Flutter team took note of what worked well with other frameworks and what failed. In addition, Flutter added new innovations and ideas – all baked in from the start rather than being bolted on as improvements are made.
But I suspect that if you’ve bought this book, you don’t need much convincing so I’ll stop. Suffice it to say that Flutter is amazing! It is easy to write, elegant, well-designed – an absolute pleasure to code in.³
Conclusion
Now, if you’re the kind of developer I hope you are, you’re chomping at the bit to get your hands dirty writing some code! So let’s get to it. We’ll start by installing and learning the Flutter development toolchain.
Footnotes
1
Desktop is coming soon. Flutter will work on Windows, macOS, Chromebooks, and Linux.
2
http://bit.ly/eric_seidel_flutter_keynote_video at 21:47 in.
3
But if you do want to read more, here’s a deeper discussion of Flutter vs. some other frameworks: http://bit.ly/2HC9Khm
© Rap Payne 2019
R. PayneBeginning App Development with Flutterhttps://doi.org/10.1007/978-1-4842-5181-2_2
2. Developing in Flutter
Rap Payne¹
(1)
Dallas, TX, USA
As we saw in the last chapter, Flutter enables us to create apps that run on the Web, on desktop computers, and on mobile devices (which seems to be the main draw). But wait a second, how exactly do we create these apps? What editor should we use? What is needed in the Flutter project? How do you compile the Dart source code? Do we need any other tools to support the project? How do you get it into a browser or on a device in order to test it out? Good questions, right?
Let’s answer those questions and more in this chapter. Let’s cover two significant topics:
1.
Tools needed – How to install and maintain them
2.
The development process – How to create the app, run it, and debug it
Caution
By its nature, cross-platform app development tooling involves an awful lot of moving parts from various organizations, few of whom consult with the others before making changes. And since we’re dealing with boundary-pushing and young technology, changes happen frequently. We’ve tried in this chapter to stick with timeless information but even it is likely to become stale eventually. Please check with the authors of these tools for the latest and greatest information.
The Flutter toolchain
There is no end to the list of helpful tools that the development community has produced. It is truly overwhelming. We’re making no attempt at covering them all. We want to give you just enough for you to be proficient but not so many that you’re overburdened. Forgive me if I’ve skipped your favorite.
The Flutter SDK
The Flutter SDK is the only indispensable tool. It includes the Flutter compiler, project creator, device manager, test runner, and tools that diagnose – and even correct – problems with the Flutter configuration.
Installing the flutter SDK
The installation instructions are found here: https://flutter.dev/docs/get-started/install. Long story short – it will involve downloading the latest zip file of tools and setting your PATH to point to the folder where you unzipped them. The steps vary per operating system, but they’re very plain on that web site.
Tip
This step seems very low level and sounds intimidating, but after this step, things get easier and less error-prone. Don’t let it discourage you.
IDEs
In theory an IDE isn’t really needed. Flutter can be written using any editor and then compiled and run using the flutter SDK that you installed earlier. But in reality almost nobody ever does that. Why would they? The following IDEs have Flutter support built right in!
VS Code from Microsoft
VS Code is from Microsoft. Its official name is Microsoft Visual Studio Code,
but most of us just call it VS Code. Whatever you call it, please do not confuse it with Microsoft’s other product called Microsoft Visual Studio.
They are not the same thing regardless of the similar names.
You can get VS Code here: https://code.visualstudio.com.
Android Studio/IntelliJ from