Flutter + Git Hooks

→ My GitHub profile.
→ My LinkedIn profile.
→ Get the Ufo theme into your VS Code.

What’s up dev! Today’s post, I’m about to introduce you (or not) to a Git Hook tool and maybe solve some of your coding problems with some ‘Fast and powerful Git hooks manager for any type of projects:’ Lefthook.

Keeping the same code formatting, styling commit message pattern and whatever could may be easy for ones and hard for others, specially the ones working on projects with big teams. The bigger your team, the harder to maintain everyone on the same page about that.

We can agree that there are a lot of ways of doing that, but what about using a tool for helping us doing that? And what if getting this done in just a few minutes? Yeah, it’s possible.

Sections:

• Adding Lefthook to the Project
• Pre-Commit Setup
• Commit-Message Setup
• Pre-Push Setup
• The Complete Script
• The Goal

Let’s get to the next section!

#1 — Adding Lefthook to the project

Lefthook is a ‘Fast and powerful Git hooks manager for any type of projects:

• Fast. It is written in Go. Can run commands in parallel.
• Powerful. With a few lines in the config you can check only the changed files on pre-push hook.
• Simple. It is a single dependency-free binary that can work in any environment.

You can read more about it here. We can install it using npm/yarn, go, ruby, brew, snap and others. Get all the installing instructions here.

If you are a Linux user like me, I suggest you use snap:

lefthook snap install

Now, inside of your project run the following command:

lefthook install command

That command will generate lefthook.yml on the root project with some examples, please erase all the content.

#2 — Pre-Commit Setup

Let’s initiate our configuration with pre-commit scripts, so with this, we are gonna format all the staged *.dart files.

pre-commit

Doing some commit with not formatted files will generate some output like this:

pre-commit output

Easy peasy lemon squeezy right? Yeah! If for some reason the format command fails, the commit will not be done.

#3— Commit-Message Setup

For this example, we are gonna define some commit message pattern, validate it with Regular Expression (Regex) and let the user know about the stats of the commit.

Let’s assume our team uses the Conventional Commits for adding human and machine-readable meaning to commit messages, so some ok messages will be like this: docs: correct spelling of CHANGELOG.

Once we had the message pattern, let’s create a Regular Expression to validate: (fix|feat|wip|none|chore|refactor|docs|style|test)\:.+
I always use the regexr.com for regex validation:

Ok message format

Bad message format

Now, let’s create the validation class on Dart side ❤

Create a file git_hooks/commitMessage.dart in the root project and paste the following content:

commitMessage.dart

As you can see, the script will let the user know about the commit message stats. Now, let’s update the lefthook.yaml:

commit-message

And running it with invalid commit message format:

Bad message format output

And now it with ok commit message format:

Ok message format output

#4 — Pre-Push Setup

In this last setup, our script should run all of our tests and analyzer:

pre-push

As you can see, I’m skipping the v1.0.1 tag just for example and also ignoring the merge and rebase operations.

Now pushing the last commit:

pre-push output

#4 — The Complete Script

lefthook.yaml

#5 — The Goal
We have reached our goal! Formatting the entire code (*.dart), blocking commits with invalid commit messages and letting the user know the stats, running all the tests before the push, ignoring some tag, merge and rebase.

I hope you had enjoyed it, see you soon on the next post!

Please take a look at my other posts about Flutter:

Updating Version Code for Play Store Using GitHub Actions

How Publish Flutter Web App on Heroku & GitHub Pages

How to Safely Build Assigned Flutter App with GitHub Actions

Thank you for reading ❤

“Therefore do not worry about tomorrow, for tomorrow will worry about itself. Each day has enough trouble of its own. MATTHEW 6:34”

Errors or suggestions? Leave a comment with your clap!

→ My GitHub profile.
→ My LinkedIn profile.
→ Get the Ufo theme into your VS Code.