<![CDATA[I should go to sleep]]>https://ishouldgotosleep.com/https://ishouldgotosleep.com/favicon.pngI should go to sleephttps://ishouldgotosleep.com/Ghost 4.1Thu, 16 Sep 2021 17:32:25 GMT60<![CDATA[This week in Flutter #20]]>Big news this week! Google announced Dart 2.14 and Flutter 2.5: Apple Silicon support and standard lints are the prominent updates for Dart.

For Flutter there are performance improvements, Material You support, camera and image picker updates, Widget Inspector improvements, and a new starter project.

Read these recap

https://ishouldgotosleep.com/this-week-in-flutter-20/613c5e2d2b4564000115228aSat, 11 Sep 2021 10:11:17 GMTBig news this week! Google announced Dart 2.14 and Flutter 2.5: Apple Silicon support and standard lints are the prominent updates for Dart.

For Flutter there are performance improvements, Material You support, camera and image picker updates, Widget Inspector improvements, and a new starter project.

Read these recap by Motabar Javaid, Ozan Taskiran,

- Michele Volpato

Development 🧑‍💻

🔗 Flutter Performance Tips

Here is a short list of tips to improve the performance of your Flutter app. Each tip has a link to a longer explanation if you want more information about it. A nice list by Hasan Basri Bayat.

🔗 Clean Network Layer in Flutter [Dio + Freezed + Json_Annotation]

Create your network layer once and use it in all your projects, with this easy-to-follow tutorial by Ercan Garip.

🔗 Flutter Bloc: A Complete Guide

I stopped using the original BLoC some time ago, I find it too complicated to understand for new developers when they join the team. But if you want to learn more about it, Dhruv Nakum published a nice article where he creates a simple weather app.

🔗 Using GraphQL with Flutter: A tutorial with examples

GraphQL is getting used more and more by API providers. There are some packages in Flutter/Dart that help you with using it in your app. I believe that graphql_flutter is one of the best and in this article, Chidume Nnamdi shows you how to use it with a tutorial.

🔗 Cubit 101: What is It, How to Use it and More

And after the article about BLoC above, here is an article about Cubit, an evolution of BLoC. I always say that I stopped using BLoC, but I can see myself starting to use Cubit in the future. This is a well-written article, I suggest you read it even if you already know Cubit. Via Gianfranco Pigatto.

🔗 Exploring the Stripe Flutter SDK

Stripe is a payment service system with good APIs. Emmanuel Etukudo shows you how you can integrate it into a Flutter app, with support with Apple Pay and Google Pay.

🔗 Getting to know Flutter: Pull to refresh with online data

The pull to refresh is a common UX feature of apps with lists. Learn how to implement it with this article by TheOtherDev/s. This article uses an external package: pull_to_refresh, but...

🔗 RefreshIndicator (Flutter Widget of the Week)

...you can also use the standard RefreshIndicator.

🔗 Implementing SVG in Flutter with flutter_svg

Did you know you can easily use SVG in your Flutter app? Majid Hajian knows that, and he wrote an article about it.

🔗 Advance Scrolling in Flutter - Part (1)

An extensive article about scrolling in Flutter, with examples and GIFs, so that you do not have to implement everything yourself to test it. By Dhruv Nakum.

Architecture 🏛

🔗 Flutter: MVVM architecture best practice using Provide & HTTP

MVVM, MVC, MVA, MVP, DDD, BYOB: there are many architectures you can follow when working on a mobile app. The best one is the one you feel most comfortable with. In this article, Maraj Hussain shows you an example of using MVVM in a Flutter project.

Tools 🛠

🔗 Simplify test new features in Flutter app with debug_friend

Stanislav Ilin published a package to help you during the development of a Flutter app. The package is called debug_friend and it adds some views to your app giving information like device info, the possibility to delete app data, and viewing detail UI values, like sizes and borders. A real debug friend, indeed.

Backend 🗄

🔗 Magic URL authentication with Flutter + Appwrite

Appwrite recently added Magic URL as a password-less authentication method. Learn how to implement it in your Flutter app with this tutorial by Damodar Lohani.

Others 🤷‍♂️

🔗 Add CarPlay to your Flutter App 🚗

My first Flutter app was a simple screen showing whether there was an available parking spot in the company parking lot. If you were too late and all spots were taken, you had to park in a public parking lot down the street and walk back. The app saved you the time to check at the company facilities whether there was room for your car or not: if the app told you there was no room, you just went directly to the public parking space. A colleague asked me if we could have the app on CarPlay, but that was not possible at the time. Now, with the flutter_carplay package published by Oguzhan Atalay, we can try it again, once we are all back to the office.

<![CDATA[This week in Flutter #19]]>https://ishouldgotosleep.com/this-week-in-flutter-19/61332215522680000161fdb4Sat, 04 Sep 2021 08:00:10 GMTSome weeks there is not a lot of Flutter content published by the community. Some other weeks there is a lot of content out there. This week is one of the latter. My job is to select the best content for you, so let's get started right away: there is a lot to cover today.

- Michele Volpato

Development 🧑‍💻

🔗 Using the Flutter BLoC Pattern with AWS Amplify Datastore

You might not know it, but AWS has a tool that helps mobile developers creating backends for their app: Amplify. It comes with (beta) Flutter packages. In this article, Derek Bingham shows a simple implementation of the BLoC pattern that handles the state from Amplify DataStore.

🔗 Building a Drawing App in Flutter

Learn about CustomPaint widgets and how to render and control a custom UI in Flutter with this well-written tutorial by Samarth Agarwal.

🔗 Explore Animation in Flutter - PART 1

Adam Kif started a series of articles about animations in SwiftUI and Flutter. This is the Flutter one. If you are just getting started with animation, this is a good starting point.

🔗 Flutter with the TomTom Maps APIs: Part 1

Developers at TomTom try to use Flutter with their Maps API. The result is this video and this article. It's nice to see bigger companies experimenting with Flutter.

🔗 How to create Flutter charts with charts_flutter

There is a simple package, developed by Google, to draw charts in your Flutter app: charts_flutter. Learn how to use it with this article by Samson Omojola.
One of the projects I am working on will need charts and I am looking forward to applying what I learned from this article.

🔗 How To Integrate Customized Google Map in Flutter

You can add Google Maps to your Flutter app, and it is quite easy. But what if you want to have a custom map in your app? In this detailed article, Jaimil Patel deep dives into customizing your Google Map in Flutter. There is a lot to read, so grab a snack before you start.

🔗 Flutter Navigator 2.0 with BLoC: The Ultimate Guide

I still have problems with Navigation 2.0 in Flutter. More in detail, the interaction between the state of the app and removing/adding pages to the page stack. In this article, Jalal Addin Okbi integrates Navigator 2.0 and the BLoC pattern. I have abandoned BLoC more than a year ago, but if you are into it, then enjoy it.

Tools 🛠

🔗 Flutter Version individual for every project - Flutter Version Manager

I am working on many Flutter projects. Most of them get updated to the latest stable Flutter version fairly soon after its release. One of them is still on Flutter 1, and, for many reasons, I don't see my team migrating it soon. This means I need at least two versions of Flutter on the same machine. I use aliases because I only need two versions. Aditya Agarwal explains how to use aliases or Flutter Version Manager.

🔗 Flutter Integration Test for Android and IOS on Firebase Test Lab

When you work on a mobile app, testing can become a difficult task. In the office we have half a dozen devices, Android and iOS, we use to do exploratory testing, but in the last year and a half, we have been working from home most of the time. That is where cloud-based app testing services come in handy. Get started with Firebase Test Lab with this article by Benson Thew.

🔗 Raster thread performance optimization tips

So you have a Flutter app that works. Its performance is fine, but it could be better. What do you do? You buy a faster smartphone. Or you follow this article by Filip Hracek from the Flutter team to learn how to find where the app is not performing well.

Backend 🗄

🔗 It’s Here! Announcing Appwrite 0.10 and the new Realtime API!

Appwrite, the open-source backend server that winks at Firebase, added the Realtime API: a way to subscribe to your data to get updates as they happen. The Appwrite team treats Flutter as a first-class citizen, they release the Flutter SDK and documentation as fast as any other platform. Well done!

🔗 Getting Started with Appwrite Realtime for Flutter

And after the announcement, a new tutorial popped up, by Damodar Lohani.

Others 🤷‍♂️

🔗 How to create Dart packages for Flutter

Have you ever published a Dart package? No? Me neither. If you want to know how to do it, check this article by Chidume Nnamdi.

🔗 Increment - Mobile

Increment is a publication by Stripe, with issues touching topics like DevOps, Remote working, testing, etc. The latest issue is about mobile, with the article "How can mobile teams best use feature flags?" by Pooja Bhaumik, who is very active in the Flutter content creator community.

🔗 When We Went to the DART Side

If you are an Android developer and you are worried about moving to Flutter, read this article by Shivarpit Sharma.

🔗 Updating theming on an old app (The Boring Flutter Development Show, Ep. 51)

A new episode of The Boring Show is out. Do you ever go back to an old project and say "what was I even thinking when I wrote this?" This is exactly what happens all over again in this episode 😅. My favorite quote: "I am starting to think this app is not production-ready."

<![CDATA[This week in Flutter #18]]>https://ishouldgotosleep.com/this-week-in-flutter-18/6129e630e80f9f0001f7b015Sat, 28 Aug 2021 08:55:50 GMTGoogle Summer of Code is a way to help students get started with open source development. This year there were three Dart projects. One of them is a Flutter desktop app that helps developers choosing lint rules to apply to their projects.

Abdullah Deshmukh, the student working on the project, published an article about the project and his experience in the Summer of Code program.

I never attended a program like Summer of Code when I was a student. It looks like an amazing opportunity to learn from experienced people: you get assigned a mentor who will guide you during the process.

- Michele Volpato

🧑‍💻 Development

Flutter: How to draw a task completion ring with CustomPainter

Andrea Bizzotto publishes (another) lesson from his Flutter Animation Masterclass. In this one, he uses CustomerPainter to draw a "task completion" widget that looks a lot like a progress indicator.

Flutter: Animated Task Completion Ring with AnimationController and AnimatedBuilder

And right after the "task completion" widget, learn how to animate it with this related article.

How to create a custom Scrollbar using RenderShiftedBox

In the latest project I worked on, I had to implement a custom ScrollBar, but it wasn't as cool as the one Elina Safaryanova implemented in this article.

Flutter state management for purists

We are always eager to try new packages, and there are plenty of them that help us with state management. But what if we do not need them? Certainly for a small app or some sample code, using what is already available in the Flutter framework is enough. Inclu Cat on the Gentle Trail elaborates more on this subject in this article. He also mentions another article, from Suragch, called "Flutter state management for minimalists" which I also recommend reading.

🤷‍♂️ Others

Introducing package:flutter_lints

The next major release of Flutter (2.3.0) ships with a new package called flutter_lints. New projects will use it by default, deprecating the old linting rules which are "heavily outdated".

package:html (Flutter Package of the Week)

"Are you tired of Flutter's widget tree?"
"Are you feeling nostalgic for an HTML DOM?"

- YouTube comment

Still package:html can be useful in many ways in your app. Learn more about it from the Flutter team.

<![CDATA[This week in Flutter #17]]>https://ishouldgotosleep.com/this-week-in-flutter-17/6120afa5c956270001fae1f5Sat, 21 Aug 2021 10:39:53 GMTI am not a big fan of Medium for tech articles. It is a closed platform, with a horrible user experience - try to copy and paste some terminal command in a medium article and let me know.

So I was pleased when I learned that Hashnode got (more) funding. Hashnode is a blogging platform for developers, like Dev.to. If you are starting a tech blog, and you do not want to host your own website then look at those two before going to Medium.

- Michele Volpato

🧑‍💻 Development

An approach to error handling on Flutter

Rafael Áquila shows a couple of ways to handle errors in a Dart program. He starts with the usual "print on catch" code, and then he provides the ResultWrapper<T> class that you can use to hold the error or the expected result. Finally, he also shows a functional approach using Dartz, a functional programming package for Dart.

How to Parse JSON in Dart/Flutter with Code Generation using Freezed

As a continuation of the article from last week, Andrea Bizzotto pushes JSON parsing to the limit with code generation. I am all for automating repetitive tasks, but I do not use code generation intensively. I find the needed annotations annoying, and not easy to understand for a new member of the team. I still use it sometimes, and when I use it I commit the generated files to the repository. Andrea argues that the code reviews become harder to perform, but you can easily exclude generated files from the merge diff.

The Ultimate Flutter Layout Guide

Ok, I am not sure this is the "ultimate" guide, but it is a good idea to keep it next to you when you really cannot understand why that container is not properly aligned/sized/visible. Thanks, Aditya Sharma.

Keys In Flutter - UniqueKey, ValueKey, ObjectKey, PageStorageKey, GlobalKey

In this comprehensive article, Dhruv Nakum talks about Keys in Flutter. We have seen keys in a previous issue, but Dhruv goes straight to the point in this article.

Creating a custom progress indicator

Get your hands dirty with some CustomPaint and create a new progress indicator with this article by Daniel Ko. Warning: there is math in there.

Flutter Timer vs Ticker: A Case Study

Andrea Bizzotto publishes a lesson from his Flutter Animation Masterclass, where he explains why you should use Ticker instead of Timer when building a stopwatch. I bought the course, and I must say that it is well done. If you are learning Flutter, and want to know more about animations, you should consider it. Just to be clear: I am not affiliated with Andrea and I paid full price for the course.

A guide to theming your app in Flutter

A quick and easy article about getting started with adaptive_theme and Riverpod to handle themes in your app, by Chinedu Imoh.

Master The Art of Dependency Injection 🐱‍👤

Dependency injection is important to keep your code loosely coupled and highly testable. Are there special considerations about dependency injection when working on a Flutter app? We could have a very deep widget tree, forcing us to inject the dependency from the root to the leaf. Read more about dependency injection in Flutter from Dhruv Nakum.

🛠 Tools


A tool like Crashlytics but for threats. You deploy it with your app, and it notifies you about attempts to clone it or reverse engineer it. I am not sure about what you can do after being notified. I consider the apps I distribute as at risk of being studied and cloned. You should not have secrets in the app, because it runs on a device you have no control of. Secrets should be managed only on platforms you fully control, like a backend server.

🤷‍♂️ Others

Flutter Hot Reload

If you want to know how Hot Reload works, and how it has been improved in Flutter 2.2, read this article by Jens Johansen.

Yellow underline text | Decoding Flutter

It happened to everybody. In your app, often in a text hero widget, your text has two yellow underlines. It happens when a Text widget does not have a TextStyle. Filip Hráček explains it to you and gives you a solution in this short video.

<![CDATA[This week in Flutter #16]]>https://ishouldgotosleep.com/this-week-in-flutter-16/61177071c3edc30001809894Sat, 14 Aug 2021 09:36:01 GMTGitHub is moving forward with its Codespaces tool. You can fire up a project from a GitHub repository in seconds and work on the code from a browser or Visual Studio Code.

Will it be possible to have your project running in a macOS environment stack? You do not need it for Flutter development, and Codespaces seems to be marketed to web developers.

Working on a Flutter app via browser from an iPad, preview the web version, and then trigger a test build on your CI to test the mobile versions does not sound smooth to me. What do you think? Would you like to be able to code your Flutter app from a browser?

- Michele Volpato

🧑‍💻 Development

How to Parse JSON in Dart/Flutter: The Essential Guide

Your app likely needs to get data from some APIs. Such data is probably provided in JSON format. Andrea Bizzotto shows you the basics of parsing JSON data in Dart.

Integrate Amazon Lex With Flutter App

Chatbots are becoming more and more important for the support strategy of a company. Amazon Lex is one of the tools you can use to provide such a feature in your app. Monikinderjit Singh has a simple tutorial to get it integrated with a Flutter app.

Subtle Flutter mistake I made today

When you share your code, you want to share your achievements, not your mistakes. That is why I like this small article by Indy Garcia. I must say that I made that mistake as well in the past, and I am sure you did as well.

🤷‍♂️ Others

Validating flutter at scale

If you tried to buy or sell a house in the Netherlands, then you know Funda. On their website, you find the majority of houses for sale, and you can contact the estate agent directly. In this article, the engineering team explains how they evaluated Flutter "for feature teams to build features simultaneously on web and mobile apps".

HeroMode (Flutter Widget of the Week)

HeroMode helps to disable the hero animation of a Hero widget. Why would you want to disable the animation of a Hero widget you added to the tree willingly? The most common case is when you have nested Navigators. You want the widget to animate only when the child Navigator is used.

History of Flutter

Are you curious about how Flutter was born and released? Tadas Petra published a short video telling you all the main events since the Sky Engine.

What can we do better to improve Flutter? — Q2 2021 user survey results

The results for the quarterly survey from the Flutter team are out. Surprisingly, some developers are concerned about expanding Flutter to web and desktop apps. They would prefer the team to focus on mobile. My team and I were very happy with porting a mobile app to the web. The process was fairly painless, it saved time and money. I do not think we would have been able to release the web version in time if it was not for Flutter.

<![CDATA[This week in Flutter #15]]>https://ishouldgotosleep.com/this-week-in-flutter-15/610e398d3a42cb00013d0610Sat, 07 Aug 2021 09:20:45 GMTMicrosoft is pushing development for the Surface Duo. They published a package for dual-screen apps. Personally, I do not see this kind of device becoming popular.  also did not see taking pictures using a tablet becoming popular, but they keep adding cameras on the back of entry-level tablets, so my opinion does not count much 😅.

In a small team, you need to make some compromises when you decide what to work on from the backlog, and if you have to choose between supporting dual-screens and, well, anything else, you often choose the latter. At least until Apple announces a dual screen tablet.

- Michele Volpato

🧑‍💻 Development

Flutter counter app, but using isolates

In Flutter, you can use *Isolates* to run code in parallel. If you need to perform some laborious task in the background, like searching inside a big zip file, then you can defer the computation to a separate thread by spawning an Isolate. In this short and simple article, Hrishikesh Pathak recreates the counter app using Isolates.

Side Effects in Flutter: What they are and how to avoid them

When you start with Flutter, you often end up adding a lot of code in the build method. For instance, you might fire a Future, or change the state. That leads to chaos. Andrea Bizzotto teaches you how to avoid such chaos. This is a must-read for new Flutter developers. Print the DOs and DONTs at the end of the article and stick them on the ceiling in your bedroom.

Adding Micro-Interactions With AnimatedSwitcher

Micro-interactions are those small animations that you do not notice, but that make the user experience so much better. They can be the reason why users keep or stop enjoying your app. Alejandro Ulate Fallas shows you how to get started with micro-interactions in your app.

🛠 Tools

XD to Flutter v3.0

A new major version of XD to Flutter has been released, congratulations to Grant Skinner. I only used the first version of the plugin, and my team was evaluating the second version, as a prototyping tool our designer could use. Happy to see that the project is still active.

<![CDATA[This week in Flutter #14]]>https://ishouldgotosleep.com/this-week-in-flutter-14/6105029d4d37620001966da0Sat, 31 Jul 2021 10:34:45 GMTI had to make some changes to an iOS app written in Swift. I have been working mainly in Dart/Flutter for the last months, but I was surprised by how quickly I got back into Swift mode.

That makes me think of Swift as a very good language. I have the same with Dart. I do NOT have the same experience with JavaScript, but this is just my personal experience.

Which programming languages make you eager to use them, and which ones make you feel like you just want to run away?

- Michele Volpato

🧑‍💻 Development

Social Authentication in Customized Flutter Applications

If there is something I learned about authenticating users in your apps, is that you should never build your own authentication service. It is too complicated. So complicated that there exist companies which business model is just to provide an authentication layer for you. All backend-as-a-service platforms give you an authentication service, as well. Another approach you can take is authenticating users with their existing social accounts.

In this article, Jaimil Patel shows you how to integrate social authentication in your Flutter app. Just remember that if you allow users to authenticate via Google or Facebook on iOS, you also must let them authenticate via Apple.

Responsive layouts in Flutter: Split View and Drawer Navigation

Andrea Bizzotto teaches us how to transform a Drawer into a split view when the screen has enough room for it. In the article, he creates a custom component SplitView and uses Riverpod to hold a global application state. The article is well written, and I particularly like that he touches on the concept of reusability of components. Tutorials are too often just a bunch of code that you can't reuse in your own projects.

How to implement a shake text effect in Flutter

Another article from Andrea Bizzotto. In this one, he shows us how to create a simple shake animation as feedback to user input. Pretty neat.

Flutter Hooks

There are different ways you can manage the state of your app in Flutter. You can use simple state management with stateful widgets, or you can use packages, like flutter_bloc, Provider, and Riverpod. Kefeh Collins claims that just a step above simple state management, there are Flutter hooks. Learn more about them in this article.

🛠 Tools

Flutter UME

ByteDance, the company behind TikTok, released an in-app debug tool called UME. When you use it, as a developer dependency, in your app, you can see debug information directly in your app. ByteDance was featured in the latest Google I/O.

Managing multi-package Flutter projects with Melos

When you are working on a simple app, you have a single pubspec.yaml, and all your code is in a single lib folder. But if you are working on a much bigger project, you might need to keep code separated into different development packages, which increases the complexity of your project. Melos can make that simpler for you, and Sagar Suri shows us how.

🤷‍♂️ Others

Experimenting with Dart and Wasm

WebAssembly (Wasm) was designed with the idea of deploying high-performance applications on a web browser, but it can be also used in other apps.

Liam Appelbe and Michael Thomsen tell us about the interoperability between Dart and Wasm. Quite a technical article, I understood less than half of it 😅.

640 Pages in 15 Months

Bob Nystrom is well known to the Dart/Flutter community. He is writing a book called Crafting Interpreters, and he used Dart to create a build system for the book. Read more about the challenges he encountered in this article.

Collection (Flutter Package of the Week)

I was following a course about image processing during my bachelor's. One of the assignments was to implement a lossless image compression program. I implemented my own version of the data structure used to hold the color information in memory and the memory usage exploded quite quickly.

Do not make my mistake, use existing libraries. The Collection library contains all those data structures you studied in your computer science course but never used.

<![CDATA[This week in Flutter #13]]>https://ishouldgotosleep.com/this-week-in-flutter-13/60fbb7958ca9a40001b0bd98Sat, 24 Jul 2021 09:20:43 GMTWe have many resources about testing and some about Firebase Realtime Database. It is almost like content creators agree on the subject of the content they publish.

I give a lot of space to other developers in this newsletter so I think I deserve to share some of my achievements: this week I joined the Flutter team at raywenderlich.com as a tech editor 🎉.

The content available at raywenderlich.com is always of high quality, so I am honored to be part of the team.

- Michele Volpato

🧑‍💻 Development

Better Bloc and Cubit Unit Testing

Did you ever have problems creating unit tests while using the BLoC pattern?
I surely did. This was one of the reasons why I am not using it anymore in the new apps I work on. Daniel Cardona Rojas comes to the rescue with this article, explaining his solution to the problem...

Generating Fake Data in Flutter using the Factory Pattern for Unit Testing

... and after you learn how to write tests, you might need to create fake data for such tests. Carlo Miguel Dy shows you how in this article.

Unit testing DateTime.now() with the help of Dart extensions

Using DateTime.now() in your code makes unit testing more difficult. You do not know how much time passed between the call to DateTime.now() and the moment you test its value, so you cannot compare timestamps. Reme Le Hane proposes a solution based on extending DateTime. I wonder if you can separate the two static methods into two different extensions, so that you can declare the setter only for testing, to avoid accidentally use it in your production code.

Another solution is to have a World service that you can inject into other classes. This service will provide values like DateTime.now() in production, or the real value for some sensors, or GPS location. While during testing it can be fully mocked.

Cat and Mice – Part 4: Implementing the AI

Bart van Wezel is continuing the implementation of his game with some artificial intelligence. He also implements some UI. The game is taking shape.

🗄 Backend

The Firebase Realtime Database and Flutter - Firecasts

Watch Todd Kerpelman in a new video about using Realtime Database with Flutter, finally clarifying (to me) when to use Realtime Database and when to use Firestore.

Firebase Realtime Database Tutorial for Flutter

Two good resources about Realtime Database and Flutter in the same week. Is this a coincidence? Yes, it is. If you prefer to read rather than watch the Firebase video, you can follow this tutorial by Vincenzo Guzzi.

🧑‍🎨 Design

Flutter for Single-Page Scrollable Websites with Navigator 2.0

In this series of articles, Cagatay Ulusoy shows different ways to create a single-page website using Flutter. You might think this is an easy topic, but a lot is going on and there are some choices you will need to make even before starting to code.

🛠 Tools

Flutter Code Generation: Getting Started

We all used code generators in Flutter. Maybe to create some classes for a database we use in the app. But do we understand them?
In this article, Aachman Garg dives into what they are and how they work in Flutter.

🤷‍♂️ Others

Finding the importance of proper null safety migration (The Boring Flutter Development Show, Ep. 50)

At the end of the previous The Boring Flutter Development Show, Filip and Fitz encountered a bug. In this episode, they will find out what is happening.

Capturing a Flutter widget as an image using RepaintBoundary

This is an interesting article. What if you want to create an image from a widget in your app? For instance, you want the user to be able to share a piece of art created by them. Jordan Holland answers your questions.

<![CDATA[This week in Flutter #12]]>Google hosted the Games Developers Summit 2021 this week. There is not much about Flutter, but some talks might be useful for Flutter developers as well. For instance, Personalizing your app in real-time: Powered by Firebase and ML, or What’s new for Firebase LiveOps.

Let me know if

https://ishouldgotosleep.com/this-week-in-flutter-12/60f2824ff3f66000015aca7eSat, 17 Jul 2021 09:28:51 GMTGoogle hosted the Games Developers Summit 2021 this week. There is not much about Flutter, but some talks might be useful for Flutter developers as well. For instance, Personalizing your app in real-time: Powered by Firebase and ML, or What’s new for Firebase LiveOps.

Let me know if there was some other talk that you found interesting.

- Michele Volpato

🧑‍💻 Development

Understand Constraints in Flutter

Do you ever wonder why sometimes you set the width of a container and nothing changes in your layout? That is because you did not understand constraints. Learn about constraints in Flutter in this article by Dany Tulumidis.

Getting Started With Flutter

Jonathan Sande updated the beginner tutorial about Flutter on raywenderlich.com to Flutter 2.2. The previous version was for Flutter 1.7, a bit outdated 😁.

Flutter Tutorial - Keep Screen Awake [2021] Wakelock

Did you know you can prevent the device screen from going into sleep mode directly from your Flutter app? I did not. Here is a very short tutorial on how to do it by Johannes Milke.

Cat and Mice – Part 3: Implementing the Game

Bart van Wezel is back with the next iteration of his game built from scratch with Flutter. This week he implements the menu and the game logic. It is nice to follow the app being built, reading about the challenges he faces.

A deep and detailed article by Andrea Bizzotto on Flutter animations. In the article, he discusses implicit animations, tweens, explicit animations, and built-in explicit transition widgets. He also provides an app you can download to showcase all the animations shown in the article, and more. Definitely recomended.

The flutter “const” Keyword demystified

We have all written

    padding: EdgeInsets.all(16.0),
    child: ...

But should we be using const?

    padding: const EdgeInsets.all(16.0),
    child: ...

In this article, Kefeh Collins teaches us about the const keyword, what it represents, and when we should use it.

🧑‍🎨 Design

How to use Google Fonts in a Flutter application

Chris Bongers shares how easy it is to use Google Fonts in your Flutter app. If you are a beginner, you should check Chris' website. He is learning Flutter and sharing daily something new he learns.

🛠 Tools

Excluding Dart files from static analysis

Jordan Holland shows us how to get rid of all those problems that the static code analyser finds in generated code. You should not edit generated code, so you either avoid using code generating tools 😢, or  exclude the generated files from the analysis 🥳.

🤷‍♂️ Others

Flutter Web: Should I use it? (Part 4— I believe so)

Reme Le Hane concludes the Flutter Web: Should I use it? series with suggestions for developing an app that is for both mobile devices and web browsers. I am a big fan of reusing your code as much as possible. I keep all the code that can be shared in some shared widgets, and I use separated widgets when the code differs.

<![CDATA[This week in Flutter #11]]>A couple of weeks ago Majid Hajian started a weekly video show about Flutter news. How did I miss it? It looks like I have a couple of videos to watch to catch up on.

I have noticed an increase in content about Flutter and Dart lately, both written and

https://ishouldgotosleep.com/this-week-in-flutter-11/60e94a51f3f66000015ac91cSat, 10 Jul 2021 09:36:25 GMTA couple of weeks ago Majid Hajian started a weekly video show about Flutter news. How did I miss it? It looks like I have a couple of videos to watch to catch up on.

I have noticed an increase in content about Flutter and Dart lately, both written and video. Even bigger players, like raywenderlich.com, are publishing more articles and tutorials.

It is good for the community to get more content, and, hopefully, one day we will get to the level of quantity and quality of other languages and frameworks. 🤞

- Michele Volpato

🧑‍💻 Development

Unlocking Your Flutter Widgets With Keys

Flutter uses keys to preserve state when you move around in your widget tree. In this article from raywenderlich.com, you will learn what keys are and how they work, when to use a key, and how to work with different types of keys.

🏛 Architecture

Cat and Mice – Part 2: Architecture

Bart van Wezel keeps going with the weekly series about creating a new Flutter app. This week he discusses the architecture of the app, starting from the navigation. He wonders if this architecture will also support authentication: read the article and give your opinion about it.

🗄 Backend

Announcing Appwrite 0.9: The open source Firebase alternative

Appwrite released a new version with support for Flutter desktop. Now you can register Linux, Windows, and Mac apps. 🎉

🧑‍🎨 Design

Principles Of 3D Design For Flutter

In this article, Manas Pratap Thakur shows two things: how to use Matrix4 to transform a widget to give a 3D perspective, and how to fake a 3D image by changing the visible frame depending on the value of the explicit animation. The latter feels a bit clunky to me, but it can be a good starting point.

🛠 Tools

Run Flutter tests with GitHub Actions

My CI/CD to go tool is Bitrise[1], but you can use any CI/CD tool of your choice to automatically run tests on your Flutter project. If, for instance, you want to run tests every time a new pull request is created in your GitHub project using GitHub actions, you can follow this easy tutorial by Jordan Holland.

  1. this is a referral link. ↩︎

🤷‍♂️ Others

Flutter Web: Should I use it? (Part 3 — Other considerations)

Reme Le Hane continues the Flutter Web: Should I use it? series with some considerations about whether Flutter is a good idea for your app depending on the project you are working on. From the platforms your app needs to be built for and the skills your team possesses. The next article will be the last one in the series, with suggestions for you, if you decide to use Flutter for your web app, stay tuned.

<![CDATA[This week in Flutter #10]]>Recently GitHub (Microsoft) introduced Copilot, a tool that uses AI to write code. It uses OpenAI Codex, a system similar to GPT-3. If you did not understand a single word, do not worry. Watch this video from Mangirdas Kazlauskas to find out how it performs on Flutter.

Will we all

https://ishouldgotosleep.com/this-week-in-flutter-10/60e00e93f3f66000015ac71aSat, 03 Jul 2021 11:47:43 GMTRecently GitHub (Microsoft) introduced Copilot, a tool that uses AI to write code. It uses OpenAI Codex, a system similar to GPT-3. If you did not understand a single word, do not worry. Watch this video from Mangirdas Kazlauskas to find out how it performs on Flutter.

Will we all be replaced by AI in the future? No idea, but they said similar things about Low Code/No Code, and that did not happen yet.

- Michele Volpato

🧑‍💻 Development

How to make your own native library bindings with Dart FFI

In this series of articles, Maksim Lin shares his experience in using Dart FFI to be able to playback audio on Linux. I am looking forward to the next articles in the series.

Working with Firebase Cloud Firestore made easier with "withConverter()"

In version 2.2.0 of the Firestore Flutter package, the Firebase team introduced withConverter, which allows interacting with collections/documents in a type-safe way. Chinmay Kabi shows us how to use it. I must say I added a TODO in the projects I am working on to use it there as well.

Exploring Flutter Navigator 2.0: VRouter

I have implemented Navigation 2.0 in a couple of apps for now, and I am not very happy with it: boilerplate code and increased complexity are my major concerns with it. VRouter might make it simpler. In this article, Naveen Srivastava shows us how to get started with it. Before using it you must take into account that it replaces MaterialApp.

Mixing packages that don't support null safety in Flutter

What do you do when you are migrating to null-safety, but there is just one package which is not updated yet? You do not migrate! Or you can use Jordan Holland's approach described in this article. I would go for not migrating yet. 😅

🗄 Backend

Building a Post Scheduling App with HarperDB & Flutter

This is Alberto Bonacina's article for the hackathon I advertised last week. I think this is my favorite so far. It is simple and useful. He might even publish the app in the stores.

🧑‍🎨 Design

Building Complex UI in Flutter: Magic 8-Ball

A new tutorial from raywenderlich.com. Create a 3D magic 8-ball.

Unbounded height / width | Decoding Flutter

You need to watch this video from the Flutter team. Filip Hráček, with the help of some funny animations, explains what happens when you get an "Unbounded height" error. One hundred pixels!

Creating adaptive layouts with Flutter

I have been experimenting with adaptive layouts in an app I am working on with my team. The app was initially only designed for iOS and Android, but recently the client requested a web version. Happy we went with Flutter from the beginning we had "only" to adapt the layout for bigger screens. Our work also improved the app on tablets. In this article, Touré Holder shows you how to use adaptive_layout to start from the beginning with different screen sizes in mind, so that you do not have to fix it later on.

🛠 Tools

Cat and Mice – Part 1: CI/CD

Last week Bart van Wezel started a weekly series about creating a new Flutter app: design, implementation, publishing, and artificial intelligence. In this article, he sets up CI/CD using Codemagic.

🤷‍♂️ Others

Flutter Web: Should I use it? (Part 2— Performance)

Reme Le Hane continues the article from last week with an article on the performance of a web app developed using Flutter. The results are not encouraging. We must say that the page speed insight is calculated on first load of your web app. After main.js has loaded, the website should get much faster.

How to build any kind of app in Flutter (and overcome Tutorial Hell)

We have all been there. You are learning a new topic and you watch tutorial after tutorial, course after course, and copy and paste code here and there. That is not how learning works. In this article, Andrea Bizzotto explains his workflow when he is learning a new topic. I would add one more state to his Learn and Practice feedback loop: try to explain the topic you are learning to someone who is not familiar with it. You can do that with an online article, or by giving a presentation to your colleagues during a recurring knowledge-sharing meeting.

Google I/O spotlight: Flutter in action at ByteDance

ByteDance got some spotlight during the latest Google I/O. In this interesting article, they share how they got Flutter into their daily workflow. The main point is: they needed to develop for multiple platforms. They also mention the valuable contributions they made to Flutter, reducing the app size, and removing janky UI. Another key point worth mentioning is that they realized it was not productive to re-implement existing products in Flutter, while it was advantageous to use it for new apps.

Top 51 Amazing 🤩 Resources to Learn Flutter & Dart

Are you just starting learning Flutter? Here is a big list of resources, put together by Kushal Goel, you can use to get up to speed. Just be careful not to get stuck in tutorial nightmare.

<![CDATA[This week in Flutter #9]]>Flutter for web has been a game-changer for my team. When a client mentioned that they would like to have a web version of the app we had already built for them, we were glad we used Flutter. Soon we will be able to create desktop apps as well, but

https://ishouldgotosleep.com/this-week-in-flutter-9/60d6d049324e4700019fdab7Sat, 26 Jun 2021 09:24:54 GMTFlutter for web has been a game-changer for my team. When a client mentioned that they would like to have a web version of the app we had already built for them, we were glad we used Flutter. Soon we will be able to create desktop apps as well, but should we?

The desktop experience is much different from the mobile one. A feature like undo, is not common in mobile applications, but it is in desktop ones. Furthermore, you have a full keyboard available to you on desktop, will you make your desktop app working without a mouse?

What do you think?

- Michele Volpato

🧑‍💻 Development

Using Cubit for Managing States in Flutter

Bloc is a well-known library that helps with state management, but using the Bloc package can result in a lot of boilerplate. Cubit is a lighter version of Bloc. Neil Ruaro shows in a simple tutorial how to use it.

flutter_witai: ^0.0.1

Amey Sunu published a package to query Wit.ai, an API that helps with adding natural language experience to your products. The package is at an early stage, but I like to see a student being active in the open-source community.

Calling Native Libraries in Flutter with Dart FFI

I remember some years ago, I was working on an iOS app that used machine learning models to identify some specific sounds. The model, and the functions to use it, was in C code. It was a nightmare. Now, whit Dart FFI it would be much simpler.
This new tutorial on raywenderlich.com explains what Dart FFI is and shows how to use it to access native libraries that support C-interoperability.

Migrating an old app to Flutter 2

The Boring Flutter Development Show is back with a new episode. In this one, Filip and Fitz update the old Hacker News app to Flutter 2. Not without problems. When we migrated a relatively new app to Flutter 2, we did not use the sound null safety migration tool, we migrated manually, to keep everything under control.

How we make Flutter work with CallKit Call Directory

With CallKit you can integrate your calling services with other call-related apps. In this (long) article the authors of the flutter_callkit_voximplant package explain why they needed to create a new package, and how they implemented it. It is not common to read articles about how a package is conceived and implemented.

🗄 Backend

Announcing HarperDB Hackathon on Hashnode!

Hashnode, in collaboration with HarperDB, announced a hackathon. The goal is to build an app in your favorite language (Dart?) and framework (Flutter?), using the HarperDB backend service. You still have some days until the 30th of June, so hurry up.

🤷‍♂️ Others

Flutter Web: Should I use it? (Part 1 — SEO)

Reme Le Hane gives his opinion on why SEO is not that important (for now) for Flutter web apps. I would add to his reasons that the usual Flutter web app does not need to be indexed by a search engine. Your content is probably behind a login screen, and if it is not, it is generated depending on some state the app is in. If your content is static, why using a web app? Just publish an HTML website. If you need your app to be discoverable by search engines, you could have a marketing website with a link to the login screen.

Version Management In Flutter

My team makes and maintains Flutter apps for several clients. Some of these apps are not yet migrated to Flutter 2. Some other apps are using Flutter 2. This means that we need two different versions of Flutter, or even more, on the same machine to maintain such apps. How do we do it? Flutter Version Manager. In this article, Naveen Srivastava shows us how to get started.

Dart the perfect CLI language

Ruby is not my favorite language. Let me rephrase it: Ruby is my second to last favorite language. When I need to work on a Fastlane file, I first check if one of my colleagues is online, hoping to unload the job to them (they read this newsletter, so now I am in trouble).
So why not using one of your preferred languages for command-line applications? Brett Sutton tells us why we should use Dart.

<![CDATA[This week in Flutter #8]]>Ever since I first watched this video from the Inkdrop developer Takuya Matsuyama, I wanted to try vim for Flutter. Robert Brunhage published a video on the topic, but I still have to find the right motivation (and time) to give it a try. If you have suggestions, comments, or

https://ishouldgotosleep.com/this-week-in-flutter-8/60cd9602d4d22d0001765e8aSat, 19 Jun 2021 08:50:56 GMTEver since I first watched this video from the Inkdrop developer Takuya Matsuyama, I wanted to try vim for Flutter. Robert Brunhage published a video on the topic, but I still have to find the right motivation (and time) to give it a try. If you have suggestions, comments, or even if you think I should not do it, please let me know.

- Michele Volpato

🧑‍💻 Development

Create a Simple Responsive GridView with Flutter

Alberto Bonacina shows us how to use flutter_staggered_grid_view to create a responsive grid of widgets, with an explanation of how the layout works.

Flutter Face Detection Using Firebase ML Kit

I have never used Firebase ML in an app. Apparently, it is quite simple. Follow this tutorial to implement face recognition in your app.

Flutter Package Preview: shared_preferences

Carl Wills is back with another introductory article to well-known Flutter packages. This time its shared_preferences.

Flutter GetX Example – Category Selection

Bart van Wezel is also back in this newsletter with an article about how to get started with GetX. There are so many state management packages for Flutter, I suggest you pick one and use that in all your projects. But it is good to know what's available out there, in case you find a package that works better for you.

Dart Basics

A new article by the raywenderlich.com team, about Dart, updated to the recent sound null safety feature.

Flutter Drag and Drop – State Management

Bart van Wezel is back (again) with an article about integrating drag and drop with Riverpod. There is a lot of code in this tutorial, and also a common questions section at the end.

Dependency Injection with Flutter

Dependency injection is a well-known technique to achieve separation of concerns, make your code reusable, and testable. In Dart/Flutter you can apply it by architecting your code around it from the start (my preferred way), or you can use catalyst for Dart and flutter_catalyst for Flutter. Julian Finkler, the developer behind those packages, created a new package to make the process of using them easier. From the repository of catalyst_builder:

Catalyst Builder is a dependency injection provider builder for both, Dart and Flutter. It's easy to use and dependency injection is almost done automatically. You only have to decorate your services with @Service and the build_runner will create a service provider for you.

🗄 Backend

Loading Cloud Storage Images in a Flutter Web App

Recently we adapted a Flutter mobile app we built for a client to the web. The app uses Firebase to host many images. In the mobile version, we cache the images in a folder on the device, using path_provider, but on the web, this is not possible. My colleague Toine Heuvelmans explains in this article how we used hive and CORS configurations to achieve image caching on the web.

🤷‍♂️ Others

A Year as a Flutter Developer

Do you want to read the journey of a Flutter developer, from learning to getting their first full-time contract? Alistair Holmes, co-organizer of Flutter Zimbabwe, shares how he learned Flutter, shared his work, and got a full-time contract (and then a Lead Mobile Dev position) in less than a year. Kudos!

10 Best Visual Studio Code Extensions for Flutter Development

I do not know if these are actually the best extentions for Flutter development, but for sure they are useful. Suresh Mohan not only lists them, but he also shows how they work in this article.

Improving Platform Channel Performance in Flutter

The Flutter team has recently improved performance in communication between the Flutter framework and the host platform. In this article, they explain (in detail - you are warned) how they achieved that. Happy reading.

<![CDATA[Extension methods for generic types]]>Since Dart 2.7 it is possible to add functionalities to existing libraries. If a class is missing a method you would like to use, you can just extend that class with your own implementation of such a method.

You do not need to create a pull request on the

https://ishouldgotosleep.com/extension-methods-for-generic-types/60c8d3f4d4d22d0001765e49Tue, 15 Jun 2021 16:34:15 GMTSince Dart 2.7 it is possible to add functionalities to existing libraries. If a class is missing a method you would like to use, you can just extend that class with your own implementation of such a method.

You do not need to create a pull request on the code of the library you want to update, you can keep the new functionality locally to your code. For example, if you need to format a Duration so that it shows days, hours, minutes, and seconds in the following format: dd:HH:MM:SS, you can define an extension method on Duration:

Extension on generic types

You can not only extend a "concrete" type like Duration. You can also extend the functionalities of a generic type, so that all its concrete instances (and all subclasses) obtain the new extension method.

For instance, if we want to add a firstWhereOrNull to List, where we either return the first element in the list that satisfies a condition, or null if none satisfies that condition, we can create an extension method like this:

By creating the extension method on the generic Iterable<E> we add it to all concrete types of all subclasses of Iterable, like Queue, List, and Set, thus also to List<String>.

<![CDATA[This week in Flutter #7]]>This week I attended the Flutter Netherlands meetup. At this online event, we discussed the announcements from the recent Google I/O, and met a special guest: Chris Sells. We were able to ask him questions and see how good he is in avoid answering some of them 😅.


https://ishouldgotosleep.com/this-week-in-flutter-7/60c44c95d4d22d0001765d3fSat, 12 Jun 2021 07:10:05 GMTThis week I attended the Flutter Netherlands meetup. At this online event, we discussed the announcements from the recent Google I/O, and met a special guest: Chris Sells. We were able to ask him questions and see how good he is in avoid answering some of them 😅.

Key points from the event:

  1. The time between filing an issue in the Flutter repository and closing it (either by fixing or because it is not actionable) has been decreased by 80%. This has been possible by using Firebase testing and by keeping continuous integration up and running. If CI works well and is reliable, the fix can be delivered faster.
  2. Chris is proud that Flutter runs at the speed that the device allows, like a native app, and that the developers express joy with the features available for Flutter, like hot reload and the dev tools. They work a lot on making such features discoverable and easy to use.
  3. Flutter is used by more than 30 teams in Google, with more than a million lines of code. These teams depend on Flutter. It is impossible to stop it now. Do not expect to find Flutter in the Google graveyard soon.

On another note, the WWDC did not introduce many interesting new features, at least from a Flutter developer point of view. I am happy to see async await in Swift, but my hope for being able to use the iPad as a full development machine is lost. 😕

- Michele Volpato

🧑‍💻 Development

Flutter Crash Course

Robert Brunhage published a 30 minutes video where he shows how to create a simple net worth tracker app. A very good resource if you are just starting with Flutter.

Integration testing in Flutter

Recently, the integration_test package was promoted in the Flutter SDK. In two different articles, Shawn Blais and Darshan Kawar tell us why we should use it and how to use it. You should really try, there is something magical in seeing your UI being used by the automated tests.

Flutter localization done right

Jimmy Aumard introduces and explains his Flutter package, intl_flavors. It allows you to easily integrate different translations for different flavors of your Flutter app. I am not a big fan of flavors, but until Flutter adds support for them, for some cases they are unavoidable. The next time I cannot avoid them, I will use give this package a try.

Simplify your Flutter app with Provider

Carl Wills wrote an introductory article to state management and Provider. There are already plenty of articles out there about Provider, but I always welcome well-written articles for beginners, such as this one.

🗄 Backend

The @platform: a Firebase alternative

Joe Muller experimented with @protocol. He started from the challenge of implementing end-to-end encryption in a social media app built on top of Firebase. The @protocol is based on a unique digital identifier, the @sign, which lets you choose what data you want to share, with whom, and for how long. It reminds me (a lot) of the Solid web project. I think the technology is in a very early stage, but I really hope it will improve in the future, data control and ownership should be given back to the users.