loading...
Cover image for A month of Flutter: continuous linting

A month of Flutter: continuous linting

abraham profile image Abraham Williams Originally published at bendyworks.com ・2 min read

a-month-of-flutter (31 Part Series)

1) A month of Flutter 2) A month of Flutter: create the app 3 ... 29 3) A month of Flutter: configuring continuous integration 4) A month of Flutter: continuous linting 5) A month of Flutter: upgrading to 1.0 6) A month of Flutter: initial theme 7) A month of Flutter: no content widget 8) A month of Flutter: a list of posts 9) A month of Flutter: extract post item widget 10) A month of Flutter: post model and mock data 11) A month of Flutter: rendering a ListView with StreamBuilder 12) A month of Flutter: Stream transforms and failing tests 13) A month of Flutter: real faker data 14) A month of Flutter: rendering network images 15) A month of Flutter: FABulous authentication 16) A month of Flutter: configure Firebase Auth for Sign in with Google on Android 17) A month of Flutter: configure Firebase Auth for Sign in with Google on iOS 18) A month of Flutter: Sign in with Google 19) A month of Flutter: mocking Firebase Auth in tests 20) A month of Flutter: delicious welcome snackbar 21) A month of Flutter: navigate to user registration 22) A month of Flutter: user registration form 23) A month of Flutter: testing forms 24) A month of Flutter: setting up Firebase Firestore 25) A month of Flutter: awesome adaptive icons 26) A month of Flutter: set up Firestore rules tests 27) A month of Flutter: Firestore create user rules and tests 28) A month of Flutter: WIP save users to Firestore 29) A month of Flutter: user registration refactor with reactive scoped model 30) A month of Flutter: the real hero animation 31) A month of Flutter: a look back

Originally published on bendyworks.com.

Yesterday I configured CI. Today, in step with @tpolansk's advice, lets set up linting. For this project we'll start with the analysis options that the Flutter team uses. To download the file I'll run the following command within the root directory of the repository.

$ wget https://raw.githubusercontent.com/flutter/flutter/master/analysis_options.yaml

The analysis_options.yaml file tells the dartanalyzer tool the preferences to use when analyzing the codebase. You can now run flutter analyze to see everything in the app that can be improved. Your editor should use this file to show you inline feedback as well.

$ flutter analyze
Analyzing app...

   info • Prefer declare const constructors on {% raw %}`@immutable`{% endraw %} classes • lib/main.dart:29:3 • prefer_const_constructors_in_immutables
   info • Prefer const with constant constructors • lib/main.dart:94:13 • prefer_const_constructors
   info • Prefer const with constant constructors • lib/main.dart:107:16 • prefer_const_constructors

3 issues found. (ran in 0.8s)

Linting is one of the tooling options you want to get into a project as soon as possible so you don't run into issues like @hillelcoren did.

A bit depressing seeing the number of warnings go from 2 to 2,000 but better now than later...

@hillelcoren

But having linting set up in your app doesn't mean developers will run or follow the recommended patterns. So let's enforce it with the CI we set up yesterday.

Add the following to .travis.yml:

matrix:
  include:
  - name: Test
    env: COMMAND=test
  - name: Analyze
    env: COMMAND=analyze

And modify the script line to use $COMMAND instead of test like this:

script:
  - ./flutter/bin/flutter $COMMAND

The matrix option on Travis CI is very powerful. It lets you set up multiple test runs that will perform in parallel.

Now we need to make the suggested improvements. In this case it's as simple as adding a couple of consts where the analyzer says. Using const lets the Dart compiler better optimize your code and improve performance.

Come back tomorrow when I'll be doing talking about Flutter's big announcement.

Code changes

a-month-of-flutter (31 Part Series)

1) A month of Flutter 2) A month of Flutter: create the app 3 ... 29 3) A month of Flutter: configuring continuous integration 4) A month of Flutter: continuous linting 5) A month of Flutter: upgrading to 1.0 6) A month of Flutter: initial theme 7) A month of Flutter: no content widget 8) A month of Flutter: a list of posts 9) A month of Flutter: extract post item widget 10) A month of Flutter: post model and mock data 11) A month of Flutter: rendering a ListView with StreamBuilder 12) A month of Flutter: Stream transforms and failing tests 13) A month of Flutter: real faker data 14) A month of Flutter: rendering network images 15) A month of Flutter: FABulous authentication 16) A month of Flutter: configure Firebase Auth for Sign in with Google on Android 17) A month of Flutter: configure Firebase Auth for Sign in with Google on iOS 18) A month of Flutter: Sign in with Google 19) A month of Flutter: mocking Firebase Auth in tests 20) A month of Flutter: delicious welcome snackbar 21) A month of Flutter: navigate to user registration 22) A month of Flutter: user registration form 23) A month of Flutter: testing forms 24) A month of Flutter: setting up Firebase Firestore 25) A month of Flutter: awesome adaptive icons 26) A month of Flutter: set up Firestore rules tests 27) A month of Flutter: Firestore create user rules and tests 28) A month of Flutter: WIP save users to Firestore 29) A month of Flutter: user registration refactor with reactive scoped model 30) A month of Flutter: the real hero animation 31) A month of Flutter: a look back

Posted on by:

abraham profile

Abraham Williams

@abraham

• Sr. developer Bendyworks • WebTech/Angular Google Developer Expert • Google Chrome CAB • Conference speaker slides.today • GDG Madison/DevFest WI organizer • He/him

Discussion

markdown guide
 

I'm checking back here regularly and a couple questions crossed my mind. It's not really 100% on topic here (linting), but it's at least to do with Flutter.

Do you also have experience with React Native development?

How do they compare in your opinion, especially in terms of stability, project setup and build reliability? I dabbled a bit in React Native and I found it a bit shaky. A freshly created project would for example not build or start on an emulator without some corrections (in my case it was a faulty NPM dev dependency).

I saw that Flutter has a "doctor" tool. It looks like there's already a feature built in for fixing issues like that. Does it work well? Any similar setup and build hurdles to overcome in Flutter land?

How easy / difficult is platform-specific customization?

Are there iOS and Android-specific sub-projects that can be opened with XCode or Android Studio in order to add platform specific code? How is that bridged into Flutter application code?

Is it possible to use custom UI per platform?

I.e. material design for Android, and iOS UI for iPhone?

Is it advisable to use the same UI for both platforms?

Or does it break with user expectations? Is look and feel actually good enough to feel native?

Is the Apple App Store OK with Flutter apps?

AFAIK Flutter renders its own UI on an OpenGL ES accelerated render surface. That's great for consistency and accelerating dev time, but does Apple actually reject Flutter apps if they don't comply with Apple UI standards?

 

There is a lot to unpack but I'll answer what I can.

React Native

I don't have any experience with RN so I can't speak to how it compares with Flutter. There are a fair amount of blog posts floating around though that attempt to do comparisons.

Platform customization

I know you can do platform specific integrations but I've not attempted them. Here are the docs

Platform UI

Yes you can have platform specific UI. Here is a codelab that has iOS and Android customize UI.

User preference of platform UI

This is a often debated topic. I see most brands moving to having their branded UI everywhere, while I see power users complaining when apps are not "platform" enough for them. I recommend siding more on building a great UI and less on being exactly platform perfect.

App Store

There are a number of Flutter apps published to the App Store so it is certainly doable to make Apple compliant apps.

 

From an android platform perspective, I'd say its pretty easy and straight forward. I'm currently attempting to create a flutter pluggin that works with ndk. The limitations that I noticed are that of the platform you're developing for