How I Created An Instagram Clone With Flutter And Firebase

Introduction Learn how I created an Instagram clone with Flutter and Firebase. Fun fact: Creating the UI took the most time! However, it was really easy overall. Here is a deep dive for you! Instagram is a well-known app with hundreds of millions of users. The newsfeed with posts, likes, comments, and images is the main feature that stands out. I wanted to know what it takes to build a small app with those features. So here is how I created an Instagram clone with Flutter and Firebase. ...

March 13, 2024 · 12 min · xeladu

6 Easy Tips When Working With SetState In A Flutter Application

Introduction Follow these 6 easy tips when working with setState in a Flutter application and learn more about the mechanics of setState. Stick to the best practices to not encounter any unwanted errors. The setState function of the StatefulWidget is a simple approach to managing the state within a Flutter app. But there are several pitfalls you need to avoid when you want your app to be working and performant. Here are some best practices you should stick to. So here are 6 easy tips when working with setState in a Flutter application. ...

March 12, 2024 · 4 min · xeladu

Boost Your Flutter App Performance With These 6 Tips

Introduction Get better scrolling and animations, less memory consumption, and more execution speed. Boost your Flutter app performance with these 6 tips. And if you want more, I have a free ebook with additional tips for you at the end! Here are some easy-to-use best practices for Flutter apps when it’s all about performance. Use them if you notice any problems but don’t optimize prematurely. Flutter apps are fast by default and you won’t have any trouble usually. Here is how you can boost your Flutter app performance with these 6 tips. ...

March 12, 2024 · 4 min · xeladu

Choose the Best Data Storage Solution for Your Flutter App

Introduction Learn how to choose the best data storage solution for your Flutter app between local storage, secure storage, or a cloud database. With this guide, they won’t be any open questions about what’s the correct approach for your app! Depending of what type of app you develop, you might need different data storage solutions. In this article, I’ll introduce various options for Flutter developers of how to manage data storage in your apps. Afterwards, you will be able to choose the best data storage solution for your Flutter app. The following topics will be covered: ...

March 12, 2024 · 7 min · xeladu

How To Add A Google Map To Your Flutter App

Introduction Let’s learn how to add a Google map to your Flutter app and use location services to display the current position. Everything you need to know to get started with Google Maps in Flutter is right here! If your app relies on location data and a map, you can integrate a Google map quite easily. I’ll guide you through the setup process and show you how you can customize the map the way you want it to be. Here is how to add a Google map to your Flutter app. ...

March 12, 2024 · 5 min · xeladu

How To Create Windows Apps With Flutter

Introduction Here is a short guide on how to create Windows apps with Flutter. Learn how to build executables and MSIX packages. Use the power of Flutter Desktop and create beautiful apps for Windows! Since the release of Flutter 2.10, the Windows desktop is flagged as stable. In this article, I am going to show you what needs to be done to build executables and MSIX packages. So here is how to create Windows apps with Flutter. If you didn’t catch the news, here are the relevant sources about all the changes. ...

March 12, 2024 · 4 min · xeladu

How To Mock Dependencies In Your Flutter Tests With Mockito

Introduction Learn how to mock dependencies in your Flutter tests. Create, configure, and use mocks with the mockito package. Make your apps more robust and detect bugs earlier with proper testing. During testing, there will always be a point where you need a mock. This mock will save you from setting up complex environments for a test because it allows you to focus on the parts you want to test. Assume you have a logger in multiple places in your application that writes into a database. Of course, you have tests for your logger to ensure its correct functionality. But when you test, for example, your login mechanism, you don’t care about the logger. That’s where a mock is useful. It handles the calls to the logger and reacts the way it was configured. Here is how to mock dependencies in your Flutter tests. ...

March 12, 2024 · 3 min · xeladu

How To Organize Your Flutter App Assets, Styles, Colors, Images

Introduction A large app contains many resources in different places. Learn how to organize your Flutter App assets, styles, colors, images. Here are some ideas to give more structure to your projects. In this article, we are looking at resource management in Flutter apps. A resource in this context is, for example, a style, an image, a constant, a utility, or a color that will be used within your app. I will show you ways how to organize them inside your app so that it will still be manageable despite a large codebase. The advantage is that you don’t have redundant code parts and if you want to change anything you will only have to look at one place in your source code. Let’s get started right away with some ideas on how to organize your Flutter app assets, styles, colors, images! ...

March 12, 2024 · 5 min · xeladu

How To Send Push Notifications With Firebase

Introduction Using Firebase Cloud Messaging and Firebase Cloud Functions we can achieve this. Learn how to send push notifications with Firebase. This vital feature needs to be part of every app in today’s world! Today we are going to focus on how to send push notifications from a Flutter app. Therefore Firebase will be used as it provides packages that can be used within a Flutter app. In this scenario, a push notification will be triggered and sent to your own device. Firebase offers some of its services only for paying users but they charge you for your usage. If you don’t use the services, you won’t be charged anything. So here is how to send push notifications from Flutter apps with Firebase to any device. ...

March 12, 2024 · 9 min · xeladu

How To Use Flutter Image Picker And Firebase Storage

Introduction Let’s have a look at how to use Flutter image picker and Firebase storage to save your images in the cloud. Create device-independent apps so that your users can always access their data! Saving images in the cloud is a convenient way to ensure that it is available on any device. In this article, I want to show you how to use Flutter image picker and Firebase storage to do exactly that. We will pick a file (or take a picture), upload it to Firebase Storage, and display it in our app. Let’s get started! ...

March 8, 2024 · 3 min · xeladu

How To Enable Firestore Cache In Flutter Web Apps

Introduction Reduce database load and add offline capabilities to your apps. Here is how to enable Firestore cache in Flutter web apps. If you target Android or iOS, caching is enabled by default! In case you didn’t know yet: Firebase Firestore can be used offline by enabling an internal cache. Your read and write operations work normally in offline mode and will synced with the database once the device is online again. This feature is enabled on Android and iOS by default. But for web apps you need to enable it yourself. Here is how to enable Firestore cache in Flutter web apps. ...

February 15, 2024 · 3 min · xeladu

How To Deploy Your Flutter Web App To Microsoft Azure

Introduction Microsoft and Flutter aren’t the best friends. But anyway, here is how to deploy your Flutter web app to Microsoft Azure. If you are familiar with Firebase Hosting, then you’ll notice a few similarities! Usually, Firebase is my preferred choice when it comes to cloud services for Flutter apps. But recently, I played around with Microsoft Azure and to my surprise it works rather well. I have a Flutter web app that I wanted to deploy similar to Firebase Hosting. For Azure, Microsoft offers the service Static Web Apps as part of the Azure App Service. It supports a bunch of frameworks including Flutter. Here is how to deploy your Flutter web app to Microsoft Azure. ...

February 8, 2024 · 4 min · xeladu

How To Send Emails For Free With The Brevo REST API

Introduction Brevo offers a powerful free bulk-email service. Here is how you can send emails for free with the Brevo REST API. Grab your free package with 300 emails per day with Brevo! In this guide, I’ll show you how to send free emails with the Brevo REST API. While Brevo is more than just an bulk-email service, we will focus on that part here. What you need To use the REST API you need a free Brevo account and an API key. In the free version you can send up to 300 emails per day. When you exceed the limit, the API will deny your requests until the quota is reset. ...

February 6, 2024 · 4 min · xeladu

How To Add New Firebase Features With Extensions

Introduction Firebase allows installing various extensions to further increase functionality. Here is how to add new Firebase features with extensions. Instead of writing everything from scratch, you can pay some cents and use a plug and play extension from Firebase! Firebase Extensions is an easy way to enhance Firebase and your app with additional capabilities without having to implement them yourself. They help with sending emails, translating text, resizing images, making payments, and other stuff. The possibilities are huge and it takes only minutes to set up these extensions. Instead of investing hours of development work to integrate 3rd parties into your app, look for an extension and save a lot of time! ...

February 2, 2024 · 3 min · xeladu

How To Control Apps With Firebase Remote Config

Introduction Here is how to control apps with Firebase Remote Config without the need to release a new update for your apps. You can also do A/B testing and create feature flags with this service! Wouldn’t it be great if you had some control over your apps after they are distributed via a store? You could disable a feature that still has flaws. Or your users could be part of a limited group of A/B testers. Or you might want to show a different ad banner in your app without releasing a new version. All these scenarios (and many more) are possible with Firebase Remote Config. I’ll show you how to set it up in Firebase and your app code. There will be a complete code example available at the end. Here is how to control apps with Firebase Remote Config from the backend. ...

February 2, 2024 · 6 min · xeladu

How To Easily Use Firebase Storage From Your Flutter App

Introduction In this article, I’ll show you how to easily use Firebase Storage from your Flutter app to read and write data. Make your app cloud-ready with this guide! Firebase Storage is an object storage provider in the cloud to store and serve data. Possible scenarios include profile pictures for your users or documents like PDF files that are uploaded during a registration process. In this article, I’ll show you how to set it up, read and write data, and implement basic access control rules. Here is a list of the topics: ...

February 2, 2024 · 7 min · xeladu

How To Host Your Flutter Web App With Firebase Hosting

Introduction Here is how to host your Flutter web app with Firebase Hosting. This article guides you through all the steps needed. This service is free of charge! Flutter apps are available for various platforms like Android, iOS, desktop systems, and also the web. With Firebase Hosting, there is an easy tool to deploy your Flutter web app and access it in a browser. This is a simple way to distribute apps to testers or automate the release process of new versions. Here is how to host your Flutter web app with Firebase Hosting. ...

February 2, 2024 · 3 min · xeladu

How To Secure Your Firebase Backend With App Check

Introduction Here is how how to secure your Firebase backend with App Check. I’ll demonstrate the setup with a Flutter app. Don’t let intruders make your bill go crazy! Securing your backend saves you a lot of trouble. Think about data loss or a huge bill at the end of the moment. Firebase provides its service App Check to greatly reduce the possibility of an attacker being successful. Here is how how to secure your Firebase backend with App Check. ...

February 2, 2024 · 6 min · xeladu

How To Work With Firebase Cloud Functions In Flutter Apps

Introduction In this article, I will demonstrate how to work with Firebase Cloud Functions in Flutter apps in the most simple way. This is your entry into the world of cloud computing! Firebase Cloud Functions is a service from Google that enables you to execute code in the cloud. A major benefit is scalability. If your app has many users, you won’t have a bottleneck when using Firebase. I will show you how to work with Firebase Cloud Functions in Flutter apps in the most simple way. The following sub-topics will be covered in this article: ...

January 31, 2024 · 6 min · xeladu

How To Create A New Flutter Project

Introduction This short article shows how to create a new Flutter project in 3 different ways, so you can start working on your app. Here is how to do it with Visual Studio Code, Android Studio, and the command line. I will show you three ways how to create a new Flutter project. You can do it with the IDEs Visual Studio Code or Android Studio or by using the command-line tool from the Flutter SDK. You need to have the Flutter SDK installed, otherwise non of these tips will work. To install the Flutter SDK, see the Flutter homepage. ...

January 30, 2024 · 2 min · xeladu