Understanding Git Hooks

Arindam Majumder - Nov 3 '23 - - Dev Community

Introduction

Git Hooks are a very useful yet overlooked feature of Git. With this feature, we can perform various operations to enhance our Version Control Workflow.

In this article, we will understand What is Git-Hooks, its types and implementation.

Let's dive deep into Githooks!

What are Git Hooks?

Linting Git Commit Messages Using Husky: A Guide to Cleaner Version Control

Git Hooks are the scripts that run automatically when a particular event happens inside our Git Repository.

For example, If we want to make a commit, A git hook can run before and after the commit!

Types of Git Hooks:

There are basically two types of Git hooks:

  1. Client-side/local hooks, which are prompted by events on the local repository, such as when a developer commits or merges code.

  2. Server-side/remote hooks, which are run on the network hosting the repository, and are prompted by events such as receiving pushes.

Why to Use?

There are many reasons to Use Git Hooks! These are some of them :

  • Git hooks automate actions before or after specific Git events.

  • It can also run tests, format code, or trigger deployments.

  • They enhance collaboration by maintaining code consistency.

  • Git hooks help prevent common mistakes and streamline development processes.

Implement Git Hooks:

Now we have a clear understanding of What is Git Hooks And Why we should use them! So, It's time to get our hands dirty with it!

At first, We'll create a Folder and initialize git. Here I have created a Folder named "git-hooks" and added one Index.html file to it.

To initialize git run:

git init
Enter fullscreen mode Exit fullscreen mode

Now we have initialized git in our directory. Let's navigate the files by running the ls command.

Okay, We got the index.html file but where are the other ones (ie. git files)?

Those folders are hidden. Basically, the file name starts with a dot (.), is hidden by default.

To access the hidden folders use the command:

ls -a
Enter fullscreen mode Exit fullscreen mode

We'll get all files and directories, including hidden ones.

Now we'll go to the .git folder and navigate its files.

cd .git
ls
Enter fullscreen mode Exit fullscreen mode

So now we have got the hooks folder. Next, We'll navigate this hooks folder.

Here we can see most of the available hooks, but the .sample extension prevents them from executing by default.

💡
To make these hooks executable remove the .sample part. For example the file name of pre-commit.sample will be pre-commit

Now, Let's navigate one Hooks. We'll check the pre-commit.sample file. For that run this command:

cat pre-commit.sample
Enter fullscreen mode Exit fullscreen mode

After running this code we'll get this :

💡
Hooks are not executable by default, We have to make them executable otherwise they will not work.

To make the hook executable run the following:

chmod +x name-of-the-hook 
# Replace name-of-the-hook with the hook you want to execute!
Enter fullscreen mode Exit fullscreen mode

Here we'll be taking the pre-commit hook and making it executable.

chmod +x pre-commit
Enter fullscreen mode Exit fullscreen mode

Now, Let's test if it works or not! For that, we'll make some changes in the index.html file and commit them.

💡
Don't forget to return back to the main directory that is ./git-hooks . Otherwise, it won't work.

Now we made some changes and committed them using the following command:

git add .
git commit -m "Pre-commit hook test"
Enter fullscreen mode Exit fullscreen mode

And it worked properly! It didn't show anything as we didn't encounter any errors.

In the later sections, we'll create our custom hook and there we'll print statements in the terminal so that we can understand things properly!

How to Navigate Hidden Folders in VS Code:

If we don't want to open the folder in the terminal, We can open these hidden files in VS Code as well. It's pretty simple!

First open Settings in your VS Code. Search Exclude and you will find this:

Now it is simple, Just remove the .git Pattern from the list and you can see the .git folder in your VS Code.

Creating Custom Hooks:

In this section, we'll create our Custom hooks! Sounds Interesting Right?

So Let's jump into it!

We'll create a File named post-commit and start writing our code.

The default files are written as shell scripts, but we can use any scripting language as long as it can be run as an executable. This includes Bash, Python, Ruby, Perl, Rust, Swift, and Go.

At first, we'll define our language of choice in the first line, using the shebang (#!) sign. It helps Git to interpret the subsequent scripts.

💡
Note: you need to include the path of your interpreter. For example, if we want to use bash then the first line will be #!/bin/bash

In this case, we'll be using shell scripts. Here's the code of our custom hook.

#!/bin/sh

echo "I'm post-commit hook"
Enter fullscreen mode Exit fullscreen mode

It will print "I'm post-commit hook" in the terminal after the commit completes.

So let's check that. So, We'll make this file executable. Write the following code in the .git/hooks directory.

chmod +x post-commit
Enter fullscreen mode Exit fullscreen mode

Now let's check if it works or not!

We'll go to the /git-hooks directory then change the index.html file and commit the changes. We'll get :

Amazing It Works!! Now you can create your own custom hooks according to your requirements!

Conclusion

If you found this blog post helpful, please consider sharing it with others who might benefit. You can also follow me for more content on Javascript, React, and other web development topics.

To sponsor my work, please visit: Arindam's Sponsor Page and explore the various sponsorship options.

Connect with me on Twitter, LinkedIn, Youtube and GitHub.

Thank you for Reading :)

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .