3 Tips to hack your Flutter productivity right away!

Today I’m going to introduce you to 3 tips that will take your Flutter development to the next level!

If you like this content, then I would appreciate if you slap the clap button ;)

Let’s get started right away!

Fix all errors

Who doesn’t hate to see this indicator in VSCode?

Often, imports are not needed, there are missing const keywords, or other little problems. But, isn’t there some way to fix these errors in a matter of seconds in the whole project? Yes, there is, and it’s much easier than you think. Just navigate to your project in the terminal and type dart fix --apply. And everything is fixed ;)

Better Error Screen

Everybody, really everybody hates this error screen:

But what if I told you that you can make this screen so much better with a few lines of code? Well, I’m going to show you how to do that:

1. in your main function, add the following:

void main() {
  ErrorWidget.builder = (FlutterErrorDetails details) {
    return const Material();
  }

  runApp(MyApp());
}

2. Now you can create your own error screen inside the material widget. This could look like this:

To display the error message on the screen, you can use the provided FlutterErrorDetails details. Simply use details.exception.toString().

See all your dependencies

Do you want to know all the dependencies in your Flutter project, even the dependencies of your main dependencies? For this, there is a command: flutter pub deps. Now you get a tree that could look like this:

Further reading

That’s it for this article. Do you want to know how the new Flutter Rendering Engine, Impeller works? Then check out this article:

Understanding Impeller: A deep-dive into Flutter’s Rendering Engine

These could also be interesting for you:

From Good to Great: How Adopting SOLID Principles Can Save Your Flutter App from Disaster

Coding with Confidence: Master Testing in Flutter in record time!