Posted by Swathi Dharshna Subbaraj, Project Coordinator, Google Dev Library
Developers can build, test, and deploy any application from a single codebase in Flutter. With high performance and code reusability, it has transformed the app development process. Flutter has become the go-to framework for developers as it streamlines the development process, allowing applications to be built on multi-platform with ease and efficiency.
In this blog, we will explore 6 Flutter/Dart projects from Google Dev Library from building weather apps to Tetris games. These projects will help you grow as a developer, and inspire you to build your first open source project. Let's dive in!
Flutter Design Patterns by Mangirdas Kazlauskas
Design patterns are reusable solutions to common software development problems. They help you create software that is easier to maintain, extend, and refactor. Written in Dart, this repository showcases all 23 design patterns, as described in Design Patterns: Elements of Reusable Object-Oriented Software, to help you learn and apply design patterns in your own projects, improving the quality and maintainability of your code.
A mobile application (developed using Flutter and Dart) designed to control various smart home devices. The app also allows users to create custom scenes to automate device actions based on certain conditions or events.
Learn about an easy-to-use package for accessing a device's photo library, including operations like retrieving images, videos, and albums, as well as deleting, creating, and updating files in the photo library. This package is built using the Flutter plugin architecture, which enables it to interact with native platform APIs for accessing photos and videos on iOS and Android devices.
FlutterGen is a code generator tool that helps you automate the process of generating boilerplate code for assets and fonts, making it easier to use them in Flutter projects. It works by scanning a project directory for specified assets and font files and generates code that can be easily used within a Flutter application. Overall, FlutterGen can save you time and effort in managing assets and fonts in your Flutter projects.
This app uses the Google Maps SDK & Directions API when coding with Flutter. It offers several location-based functions, including the ability to detect the user's current location. It also uses Geocoding to convert addresses into coordinates and vice versa, and allows users to add markers to the map view.
Flutter’s Cocoon application provides continuous integration orchestration for Flutter Infrastructure. Cocoon also helps integrate several CI services with GitHub and provides tools to make GitHub development easier. Achieving SLSA Level 3 for Cocoon means we have addressed all the security concerns of levels 1, 2, and 3 across the application. SLSA Level 3 is all about improving security and ensuring Cocoon’s source code and build artifacts are valid. This is done by adding increased validation to the artifact’s provenance.
What is Provenance?
Provenance is a description of how an artifact is built. Provenance includes information about the type of machine used to build the artifact, the location of the source code, and the instructions used to build the artifact. While SLSA Level 2 requires provenance to exist, SLSA Level 3 goes further by requiring proof that the provenance is valid and legitimate.
Cocoon uses the SLSA Verifier tool to verify provenance using a single-line command. With SLSA Verifier, all Cocoon builds will only be accepted if they have valid provenance. The provenance must prove the artifact was built on a Cloud Build instance with the source code coming from the Cocoon repository on GitHub. This ensures the Cocoon artifacts generated are safe and securely generated.
SLSA Verifier is easy to add into an existing workflow. For Cocoon, this required adding a provenance verification script to run SLSA Verifier on an artifact’s provenance. This script is configured in our Cloud Build template and must run and pass verification before an artifact can be deployed.
In addition to improving SLSA Levels for Cocoon, the Flutter team is working towards improving our SLSA levels across some of our larger and more complex projects, such as Flutter and Engine. These projects have their own set of challenges, such as overhauling our artifact generation process to use Gn and Ninja (Engine), and hardening security requirements for our release workflows (Flutter). We are excited to continue to deliver new security updates and solutions!
Written by Shuyu (Asher) Guo, Dart & Flutter GDE, China
At the end of May 2022, after more than a month of Google Developer Expert interviews, I finally became the fourth Flutter & Dart GDE in China.
I believe that the title of GDE should be very familiar for Android or Machine Learning developers. If you’re not familiar, the Google Developer Experts program is a global network of highly experienced technology experts, influencers, and thought leaders who have expertise in Google technologies, and are active leaders in the space and contribute to the wider developer and startup ecosystem.
My journey to becoming a GDE
In 2013, Android Bus was my first exposure to the Android community and it was at the ApkBus conference that I came into contact with the first GDE I’ve ever met. At that conference, I made Android developer friends and I also met some event organizers who invited me to speak at future events.
After the conference, I started my public speaking journey and spoke about Flutter because of the opportunities that came from networking and meeting the right people. By being more active in the community through speaking, I received an invitation to become a GDE in 2020. However, I learned that the application process is conducted in English and because of this, I ultimately didn’t complete the application process.
In 2021, while I was speaking at the Google DevFest conference, a GDE friend asked me again if I was interested in becoming a GDE, and with the encouragement of a team member from Google, I finally started preparing for the GDE application.
During the application process, the Google team pays careful attention to two aspects:
Technical competence: your technical expertise in the field you are applying for
Technical influence: such as output in areas such as public speaking, articles, and open source
I was not confident in speaking in English so I practiced before my interviews and I also translated some of my articles and posted them to Medium in English. Then I started my interview journey. The first interviewer mainly focused on the technical content of Flutter and Dart and despite my little experience with Flutter, my first community interview was completed.
The day after I completed the initial interview, I received a notification that I was assigned an interviewer for the product interview. The content of the product interview mainly revolved around some of my experience with Flutter technology. The interviewer was interested in the content of the books I had written and some awards I won that happened to be in the bookcase behind me, proving to be an excellent conversation starter. The next day, I received an email letting me know that I passed the interview - and after I signed the various agreements and terms and conditions, I had a final meeting with the team to become a GDE! Once I officially received the confirmation email from the GDE program, I was pulled into various groups, Slack, and projects. As a developer, I consider accomplishing the feat of becoming a GDE a major milestone.
Whether it is the GDE community or a Googler conducting the interviews, everyone was very friendly. I received a lot of support throughout my journey to becoming a GDE and offer my support to anyone interested in joining the community. Please feel free to connect with me at https://github.com/carguo!
We are thrilled to announce that Dart and Flutter have enabled Allstar and Security Scorecards on their open source repositories. This achievement marks the first milestone in our journey towards SLSA compliance to secure builds and releases from supply chain attacks.
Allstar is a GitHub app that provides automated continuous enforcement of security checks such as the OpenSSFSecurity Scorecards. With Allstar, owners can check for security policy adherence, set desired enforcement actions, and continuously implement those enforcement actions when triggered by a setting or file change in the org or repo.
Security Scorecards is an automated tool that assesses several key heuristics ("checks") associated with software security and assigns each check a score of 0-10. These scores can be used to evaluate the security posture of the project and help assess the risks introduced by dependencies.
Scorecards have been enabled on the following open source repositories, prioritized by their criticality score.
With these security scanning tools, the Dart and Flutter team have found and resolved more than 200 high and medium security findings. The issues can be classified in the following categories:
Pinned Dependencies: The project should pin its dependencies. A "pinned dependency" is a dependency that is explicitly set to a specific hash instead of allowing a mutable version or range of versions. This reduces several security risks related to dependencies.
Token Permissions: The project's automated workflow tokens should be set to read-only by default. This follows the principle of least privilege.
Branch Protection: Github project's default and release branches should be protected with GitHub's branch protection settings. Branch protection allows maintainers to define rules that enforce certain workflows for branches, such as requiring review or passing certain status.
Code Review: The project should enforce a code review before pull requests (merge requests) are merged.
Dependency update tool: A dependency update tool should be used by the project to identify and update outdated and insecure dependencies.
Binary-Artifacts: The project should not have generated executable (binary) artifacts in the source repository. Embedded binary artifacts in the project cannot be reviewed, allowing possible obsolete or maliciously subverted executables in the source code.
AllStar and Scorecards allowed Dart and Flutter to quickly identify areas of opportunity to improve security across hundreds of repositories triggering the removal of binaries, standardizing branch protection and enforcing code reviews.
Standardizing third-party dependency management and running vulnerability scanning were identified as the next milestones in the Dart and Flutter journey to improve their overall security posture.
It is safer to not embed binary artifacts in your code. However, there are cases when this is unavoidable.
It is important to track your dependencies and to keep them up to date using tools like Dependabot.
By Khyati Mehta, Technical Program Manager – Dart-Flutter
A closer look at building a Flutter web app with Google Developer products
If you attended Google I/O this year, you probably stopped by the Google I/O photo booth for a selfie with our Google Developer mascots: Flutter’s Dash, Android Jetpack, Chrome’s Dino, and Firebase’s Sparky. If you didn’t, it’s not too late to jump in, take a selfie, and share it on social media! We loved seeing all of the pictures you posted and your favorite props! Want to learn more about building a camera plugin, layouts, and gestures used in a photo booth for Flutter on the web?
It took a combination of Google developer products to make the photo booth successful. The Flutter and Firebase teams joined forces to build a best in class example of Flutter on the web that used Firebase for hosting, auth, performance monitoring, and social sharing. Take a closer look at how the photo booth was built here and then grab the open source code on Github!
Flutter team members having fun in the photo booth!
Today marks an important milestone for the Flutter framework, as we expand our focus from mobile to incorporate a broader set of devices and form factors. At I/O, we’re releasing our first technical preview of Flutter for web, announcing that Flutter is powering Google’s smart display platform including the Google Home Hub, and delivering our first steps towards supporting desktop-class apps with Chrome OS.
From Mobile to Multi-Platform
For a long time, the Flutter team mission has been to build the best framework for developing mobile apps for iOS and Android. We believe that mobile development is ripe for improvement, with developers today forced to choose between building the same app twice for two platforms, or making compromises to use cross-platform frameworks. Flutter hits the sweet spot of enabling a single codebase to deliver beautiful, fast, tailored experiences with high developer productivity for both platforms, and we’ve been excited to see how our early efforts have flourished into one of the most popular open source projects.
As we started to home in on our 1.0 release last year, we began experimenting with broadening the scope of Flutter to other platforms. This was triggered both by internal teams within Google who are increasingly relying on Flutter, as well as the latent potential of the Dart platform for delivering portable experiences. In particular, a small team who were already building a web framework for Dart for internal usage started an exploratory project (codename “Hummingbird”) to evaluate the technical merits of porting the Flutter engine to support the standards-based web.
In parallel, the core Flutter project has been making progress to enable desktop-class apps, with input paradigms such as keyboard and mouse, window resizing, and tooling for Chrome OS app development. The exploratory work that we did for embedding Flutter into desktop-class apps running on Windows, Mac and Linux has also graduated into the core Flutter engine.
A Portable UI Framework for All Screens
It’s worth pausing for a moment to acknowledge the business potential of a high-performance, portable UI framework that can deliver beautiful, tailored experiences to such a broad variety of form factors from a single codebase.
For startups, the ability to reach users on mobile, web, or desktop through the same app lets them reach their full audience from day one, rather than having limits due to technical considerations. Especially for larger organizations, the ability to deliver the same experience to all users with one codebase reduces complexity and development cost, and lets them focus on improving the quality of that experience.
With support for mobile, desktop, and web apps, our mission expands: we want to build the best framework for developing beautiful experiences for any screen.
Flutter for Web
This week, we are releasing the first technical preview of Flutter for the web. While this technology is still in development, we are ready for early adopters to try it out and give us feedback. Our initial vision for Flutter on the web is not as a general purpose replacement for the document experiences that HTML is optimized for; instead we intend it as a great way to build highly interactive, graphically rich content, where the benefits of a sophisticated UI framework are keenly felt.
To showcase Flutter for the web, we worked with the New York Times to build a demo. In addition to world-class news coverage, the New York Times is famous for its crossword and other puzzle games. Since avid puzzlers want to play on whatever device they’re using at the time, their development team was attracted to Flutter as a potential solution for their needs. Discovering that they could reach the web with the same code was a huge boon. At Google I/O this week, you can get a sneak peek of their newly refreshed KENKEN puzzle game, which runs with the same code on Android, iOS, web, Mac, and Chrome OS.
Here’s what Eric von Coelln, Executive Director of Puzzles at the New York Times has to say about their experiences with Flutter:
"The New York Times Crossword has more than 400,000 stand-alone subscriptions and is a daily ritual for puzzle solvers. Along with the Crossword, we’ve grown our portfolio of digital puzzles that reaches more than two million solvers each month.
We were already beginning to explore Flutter as a potential solution to the challenge of quickly developing engaging, high-quality mobile experiences. Now the addition of being able to publish to web makes Flutter an even more appealing option to quickly deploy across all of our user platforms. This update of our old Flash-based KenKen game into a multi-platform playable experience is something we’re excited to bring to our solvers this year.”
There’s lots more to say about Flutter for web than we have space for here, so check out the dedicated article about Flutter for web on the Flutter blog.
At this early stage, we’re eager to get your feedback on how you’d like to use Flutter for web. We expect to rapidly evolve the code, with a particular focus on performance, and harmonizing the codebase with the rest of the Flutter project.
Flutter for Mobile Devices
The core Flutter framework also receives an upgrade this week, with the immediate availability of Flutter 1.5 in our stable channel. Flutter 1.5 includes hundreds of changes in response to developer feedback, including updates for new App Store iOS SDK requirements, updates to the iOS and Material widgets, engine support for new device types, and Dart 2.3 featuring new UI-as-code language features.
As the framework itself matures, we’re investing in building out the supporting ecosystem. The architectural model of Flutter has always prioritized a small core framework, supplemented by a rich package community. In the last few months, Google has contributed production-quality packages for web views, Google Maps, and Firebase ML Vision, and this week, we’re adding initial support for in-app payments. And with over 2,000 open source packages available for Flutter, there are options available for most scenarios.
One particularly exciting project that we’re announcing this week at I/O is the ML Kit Custom Image Classifier. Built using Flutter and Firebase, it offers an easy-to-use app-based workflow for creating custom image classification models. You can collect training data using the phone's camera, invite others to contribute to your datasets, trigger model training, and use trained models, all from the same app.
Flutter continues to grow in popularity and adoption. A growing roster of demanding customers including eBay, Sonos, Square, Capital One, Alibaba and Tencent are developing apps with Flutter. And they’re having fun! Here’s what Larry McKenzie, a senior developer at eBay had to say about Flutter:
“Flutter is fast! Features that once took us multiple days to implement can be finished in a single day. Many problems we used to spend a lot of time on, simply no longer occur. Our team can now focus on creating more polished user experiences and delivering functionality. Flutter is enabling us to exceed expectations!”
Another quickly growing Flutter platform is Chrome OS, with millions of Chromebooks being sold every year, particularly in education. Chrome OS is a perfect environment for Flutter, both for running Flutter apps, and as a developer platform, since it supports execution of both Android and Linux apps. With Chrome OS, you can use Visual Studio Code or Android Studio to develop a Flutter app that you can test and run locally on the same device without an emulator. You can also publish Flutter apps for Chrome OS to the Play Store, where millions of others can benefit from your creation.
Flutter for Embedded Devices
As the final example of Flutter’s portability, we offer Flutter embedded on other devices. We recently published samples that demonstrate Flutter running directly on smaller-scale devices like Raspberry Pi, and we offer an embedding API for Flutter that allows it to be used in scenarios including home, automotive and beyond.
Perhaps one of the most pervasive embedded platforms where Flutter is already running is on the smart display operating system that powers the likes of Google Home Hub.
Within Google, some Google-built features for the Smart Display platform are powered by Flutter today. And the Assistant team is excited to continue to expand the portfolio of features built with Flutter for the Smart Display in the coming months; the goal this year is to use Flutter to drive the overall system UI.
We often get asked by developers how they can get started with Flutter. We are pleased today to announce a comprehensive new training course for Flutter, built by The App Brewery, authors of the highest-rated iOS training course on Udemy. Their new course has over thirty hours of content for Flutter, including videos, demos and labs, and with Google’s sponsorship, they are announcing today a time-limited discount of this course from the retail price of $199 to just $10.
Many developers are creating inspiring apps with Flutter. In the run-up to Google I/O, we ran a contest called Flutter Create to encourage developers to see what they could build with Flutter in 5KB or less of Dart code. We had over 750 unique entries from around the world, with some amazing examples that pushed what we imagine would be possible in such a small size.
Today, we’re announcing the winners, which can be found on flutter.dev/create. Congratulations to the overall winner, Zebiao Hu, who wins a fully-loaded iMac Pro worth over $10,000!
Flutter is no longer a mobile framework, but a multi-platform framework that can help you reach your users wherever they are. We can’t wait to see what you’ll build with Flutter on the web, desktop, mobile, and beyond!
Flutter 1.2 is the first feature update for Flutter. We've focused this release on a few major areas:
Improved stability, performance and quality of the core framework.
Work to polish visual finish and functionality of existing widgets.
New web-based tooling for developers building Flutter applications.
Having shipped Flutter 1.0, we focused a good deal of energy in the last couple of months on improving our testing and code infrastructure, clearing a backlog of pull requests, and improving performance and quality of the overall framework. We have a comprehensive list of these requests in the Flutter wiki for those who are interested in the specifics. This work also included broader support for new UI languages such as Swahili.
We continue to make improvements to both the Material and Cupertino widget sets, to support more flexible usage of Material and continue to strive towards pixel-perfect fidelity on iOS. The latter work includes support for floating cursor text editing, as well as showing continued attention to minor details (for example, we updated the way the text editing cursor paints on iOS for a faithful representation of the animation and painting order). We added support for a broader set of animation easing functions, inspired by the work of Robert Penner. And we added support for new keyboard events and mouse hover support, in preparation for deeper support for desktop-class operating systems.
Lastly, Flutter 1.2 includes the Dart 2.2 SDK, an update that brings significant performance improvements to compiled code along with new language support for initializing sets. For more information on this work, you can read the Dart 2.2 announcement.
(As an aside, some might wonder why this release is numbered 1.2. Our goal is to ship a 1.x release to the 'beta' channel on about a monthly basis, and to release an update approximately every quarter to the 'stable' channel that is ready for production usage. Our 1.1 last month was a beta release, and so 1.2 is therefore our first stable release.)
New Tools for Flutter Developers
Mobile developers come from a variety of backgrounds and often prefer different programming tools and editors. Flutter itself supports different tools, including first-class support for Android Studio and Visual Studio Code as well as support for building apps from the command line, so we knew we needed flexibility in how we expose debugging and runtime inspection tools.
A widget inspector, which enables visualization and exploration of the tree hierarchy that Flutter uses for rendering.
A timeline view that helps you diagnose your application at a frame-by-frame level, identifying rendering and computational work that may cause animation 'jank' in your apps.
A full source-level debugger that lets you step through code, set breakpoints and investigate the call stack.
A logging view that shows activity you log from your application as well as network, framework and garbage collection events.
We plan to invest further in this new web-based tooling for both Flutter and Dart developers and, as integration for web-based experiences improves, we plan to build these services directly into tools like Visual Studio Code.
What's next for Flutter?
In addition to the engineering work, we took some time after Flutter 1.0 to document our 2019 roadmap, and you'll see that we've got plenty of work ahead of us.
A big focus for 2019 is growing Flutter beyond mobile platforms. At Flutter Live, we announced a project codenamed "Hummingbird", which brings Flutter to the web, and we plan to share a technical preview in the coming months. In addition, we continue to work on bringing Flutter to desktop-class devices; this requires work both at the framework level as described above, as well as the ability to package and deploy applications for operating systems like Windows and Mac, in which we're investing through our Flutter Desktop Embedding project.
Flutter Create: what can you do with 5K of Dart?
This week, we're also excited to launch Flutter Create, a contest that challenges you to build something interesting, inspiring, and beautiful with Flutter using five kilobytes or less of Dart code. 5K isn't a lot -- for a typical MP3 file, it's about a third of a second of music -- but we're betting you can amaze us with what you can achieve in Flutter with such a small amount of code.
The contest runs until April 7th, so you've got a few weeks to build something cool. We have some great prizes, including a fully-loaded iMac Pro developer workstation with a 14-core processor and 128GB of memory that is worth over $10,000! We'll be announcing the winners at Google I/O, where we'll have a number of Flutter talks, codelabs and activities.
Posted by Filip Hracek, Program Manager, Dart Videos from last month’s Dart Developer Summit are up on YouTube and we thought we’d cherry-pick the highlights for you. The summit keynote is a summary of all the major news and of the direction the team is taking now. It’s where we announced that Dart is the fastest growing language at Google. Teams switching to Dart report up to twice the productivity and development speed of what they had previously.
Later in the day, Ted Sander launched AngularDart Components — the material design widgets Google is using in customer-facing apps like AdWords and AdSense. Hundreds of Google engineers work with these components every day. Watch the video to learn how they make our teams more productive, and our web apps more performant.
Another presentation that made waves was the Flutter keynote from Day 2 of the summit. Eric Seidel impressed the audience by showing just how fast mobile development can be with Flutter.
After Eric’s talk, John McCutchan and Todd Turnidge went into details about Flutter hot reloading. They also showed, for the first time, code rewind in Dart.
These are just 6 out of the 18 talks that are available on YouTube. For example, Will Ekiel’s talk titled Learnings from building a CRM app at Google gives a perspective on managing a product built with Dart and deploying it across both web and mobile. Another interesting practical presentation on using Dart in production is the one given by Faisal Abid and Kevin Birch about their large-scale JS-to-AngularDart rewrite. And the list goes on. We’re very happy how the event went, and we’re already looking forward for next year’s summit. In the meantime, follow our blog, our Twitter account, our G+ page, or join the conversation in any other way. We want to hear from you. Thanks for building in Dart.
We’re here at the Dart Developer Summit in Munich, Germany. Over 250 developers from more than 50 companies from all over the world just finished watching the keynote.
This is a summary of the topics we covered:
Dart is the fastest growing programming language at Google, with a 3.5x increase in lines of code since last year. We like to think that this is because of our focus on developer productivity: teams report 25% to 100% increase in speed of development. Google has bet its biggest business on Dart — the web apps built on Dart bring over $70B per year.
Google AdSense recently launched a ground-up redesign of their web app, built with Dart. Earlier this year, we announced that the next generation of AdWords is built with Dart. There are more exciting Dart products at Google that we’re looking forward to reveal. Outside Google, companies such as Wrike, Workiva, Soundtrap, Blossom, DG Logic, Sonar Design have all been using and enjoying Dart for years.
Our five year investment in this language is reaping fruit. But we’re not finished.
We learned that people who use Dart love its terse and readable syntax. So we’re keeping that.
We have also learned that Dart developers really enjoy the language’s powerful static analysis. So we’re making it better. With strong mode, Dart’s type system becomes sound (meaning that it rejects all incorrect programs). We’re also introducing support for generic methods.
We have validated that the programming language itself is just a part of the puzzle. Dart comes with ‘batteries included.’ Developers really like Dart’s core libraries — we will keep them tight, efficient and comprehensive. We will also continue to invest in tooling such as pub (our integrated packaging system), dartfmt (our automatic formatter) and, of course, the analyzer.
On the web, we have arrived at a framework that is an excellent fit for Dart: AngularDart. All the Google web apps mentioned above use it. It has been in production at Google since February. AngularDart is designed for Dart, and it’s getting better every week. In the past 4 months, AngularDart’s output has gotten 40% smaller, and our AngularDart web apps got 15% faster.
Today, we’re launching AngularDart 2.0 final. Tune in to the next session.
With that, we’re also releasing — as a developer preview — the AngularDart components that Google uses for its major web apps. These Material Design widgets are being developed by hundreds of Google engineers and are thoroughly tested. They are written purely in Dart.
We believe all this makes Dart an even better choice for web development than before. Dart has been here for a long time and it’s not going anywhere. It’s cohesive and dependable, which is what a lot of web developers want.
We’re also very excited about Flutter — a project to help developers build high-performance, high-fidelity, mobile apps for iOS and Android from a single codebase in Dart. More on that tomorrow.
One of the best parts of my job at Google is 20 percent time. While I was hired to help developers use Google’s APIs, I value the time I'm afforded to be a student myself—to learn new technologies and solve real-world problems. A few weeks prior to the recent Australian election an opportunity presented itself. A small team in Sydney set their sights on helping the 15 million voters stay informed of how to participate, track real-time results, and (of course) find the closest election sausage sizzle!
Our team of designers, engineers and product managers didn't have an immediate sense of how to attack the problem. What we did have was the power of Google’s APIs, programming languages, and Cloud hosting with Firebase and Google Cloud Platform.
The result is a mish-mash of some technologies we'd been wanting to learn more about. We're open sourcing the ausvotes.withgoogle.com repository to give developers a sense of what happens when you get a handful of engineers in a room with a clear goal and a immovable deadline.