A Glimpse Under the Hood

• A simplified diagram showing three commit objects, each pointing to a "tree" object.
• The "tree" object points to "blob" objects (files) and other "tree" objects (directories).
• Arrows show the parent-child relationship between commits, forming a Directed Acyclic Graph (DAG).
• Text: "Git is a content-addressable filesystem with a version control UI on top."

Where Do Hooks Fit In?​

• The same DAG diagram from the previous slide.

• An animated "PAUSE" icon appears between the developer action (git commit) and the creation of the final "commit" object on the graph.

• A callout from the "PAUSE" icon says: pre-commit: "Should I proceed?"

• Another animated "EDIT" icon appears on the commit message text file before it's finalized, with a callout: prepare-commit-msg: "Let me add some info."

 A Tour of the .git/hooks Directory

• A screenshot of a terminal showing the output of ls -l.git/hooks.

• The list shows files like pre-commit.sample, commit-msg.sample, pre-push.sample, etc.

• Highlight the .sample extension.

Key Hooks by Category

• Category 1: Client-Side: Local Workflow

  • pre-commit: Runs before a commit is created. Use for linting, formatting, security scans.

  • prepare-commit-msg: Runs before the commit message editor opens. Use for templating messages.

  • commit-msg: Runs after the message is written. Use for validating the message format.

  • post-commit: Runs after a commit is successfully created. Use for notifications.

• Category 2: Client-Side: Pushing Code

  • pre-push: Runs before git push. Use for running tests, ensuring you're not pushing broken code.

• Category 3: Client-Side: Workflow Events

  • post-merge: Runs after a successful merge. Use for installing dependencies, rebuilding caches.

Lab 1 - Hello, Hook!

• Objective: Create a basic pre-commit hook that blocks a commit based on a simple condition.

• Link: github.com/your-repo/LAB-1.md

• A timer pre-set to 25:00.

The Hook Lifecycle Diagram

• A clear, left-to-right workflow diagram.
• Developer Action: git add files -> [HOOK: pre-commit] -> Developer Action: git commit -> [HOOK: prepare-commit-msg] -> Commit Editor Opens -> [HOOK: commit-msg] -> Commit is created -> Developer Action: git push -> [HOOK: pre-push] -> Code sent to Remote -> Developer Action: git merge other-branch -> [HOOK: post-merge] -> Workspace updated.

The Commit Lifecycle

• Focus on the commit portion of the diagram.

• pre-commit: The Guardian. Asks "Is this code good enough to commit?" Perfect for automated checks that should be fast: linters, formatters, syntax checkers, credential scanners.

• prepare-commit-msg: The Assistant. Asks "Can I help you write a better message?" It can auto-insert information, like a JIRA ticket number from the branch name, before you even start typing.

• commit-msg: The Inspector. Asks "Does this message meet our team's standards?" It validates the message you've written against a specific format (e.g., conventional commits).

The Network Lifecycle

• Focus on the push portion of the diagram.

• pre-push: The Final Gateway. Asks "Are we absolutely sure this is ready to be shared with the team?" This is your last chance to stop a mistake on your local machine.

• Use Case: Since it runs less frequently than pre-commit, it's the perfect place for slightly slower checks, like running a critical subset of unit tests.

The Workflow Lifecycle

• Focus on the merge portion of the diagram.

• post-merge: The Janitor. Asks "Now that we've brought in new code, does our environment need any cleanup or setup?" It runs after a successful merge.

• Use Case: Automatically run npm install if package.json changed, or pip install -r requirements.txt if requirements.txt changed. A huge quality-of-life improvement.

Lab 2 - The Guardian

• Objective: Write a pre-commit hook that runs a linter on staged files and blocks the commit if errors are found.

• Link: github.com/your-repo/LAB-2.md

• A timer pre-set to 30:00.

Lab 3 - The Automator

• Objective: Build a two-part hook system to enforce policy and automate chores.

• Part 1 (commit-msg): Enforce that commit messages contain a JIRA-style ID based on the current branch name.

• Part 2 (post-merge): Automatically run a dependency installer if a package file has changed after a merge.

• Link: github.com/your-repo/LAB-3.md

• A timer pre-set to 35:00.

Real-World Impact

Module 3: The Case for Frameworks & The "Common Problems Bingo" (20 mins)

The Honeymoon is Over...

• A simple, text-only slide.

• "So, manual hooks are great, right? They're powerful, flexible, and have no dependencies."

• "...what happens when you try to share them with your team?"

The "Common Hook Problems" Bingo Card

• A visual 3x2 bingo card grid.

• Each square contains one of the common problems:

  • "It works on my machine!" (macOS sed vs. Linux sed)

  • "I forgot to run chmod +x"

  • "New dev joined, forgot to install the hooks"

  • "Our hooks aren't even in version control!"

  • "I just used --no-verify to bypass it..."

  • "Managing Python, Node, and Ruby hooks is a nightmare"

Manual Hooks vs. Frameworks: The Trade-Offs

Introducing: pre-commit

• Logo for the pre-commit framework.

• Tagline: "A framework for managing and maintaining multi-language pre-commit hooks."

• Website: pre-commit.com

How pre-commit Works

• A simple three-step diagram:

• 1. You write a .pre-commit-config.yaml file. (Shows a snippet of the YAML).

• 2. You run pre-commit install. This installs a tiny, smart script into .git/hooks/pre-commit.

• 3. On commit, the script reads the YAML. It then downloads the specified tools into isolated, cached environments and runs them against your staged files.

Anatomy of the.pre-commit-config.yaml

A code block with a well-annotated example YAML file.

Lab 4 - The Great Migration

• Objective: Replace the manual linter hook from Lab 2 with a framework-managed hook using pre-commit
• Link: github.com/your-repo/LAB-4.md
• A timer pre-set to 25:00.

The Onboarding Document

• A screenshot of a CONTRIBUTING.md file on GitHub.
• A highlighted section titled "Developer Setup".
• The highlighted text contains only two commands:

  • pre-commit install

  • pip install pre-commit

Pinning for Sanity: The rev Field

• The YAML example from before, with a large red arrow pointing to rev: v4.3.0.

• Text: "Always pin to a specific tag or SHA. Avoid using master or main to prevent unexpected updates and ensure reproducible builds for all developers."

My Professional "Aha!" Moment

A simple slide with a lightbulb icon.

Title: "The Story of the Skeptical Team"

What About JavaScript? Introducing Husky

• The Husky logo.

• A code block showing a sample package.json configuration for Husky.

• Text: "Husky is the go-to hook manager for the Node.js ecosystem. It leverages package.json and npm scripts for configuration."

Hooks and CI: Better Together

A diagram with two columns.

• Column 1: Git Hooks (Your Laptop)

  • Icon: Laptop

  • Fast, Individual Feedback

  • Runs on every commit

  • Jobs: Linting, Formatting, Secret Scanning, Syntax Checks

• Column 2: CI/CD Pipeline (The Server)

  • Icon: Server/Cloud

  • Slower, Authoritative Team Feedback

  • Runs on every pull request

  • Jobs: Full Unit/Integration Test Suites, Building Artifacts, Deploying

• An arrow connects them, labeled "Partners in Quality".

 Hooks Aren't Just for Saying 'No'

• A transition slide with a large, bold statement:

• "So far, we've used hooks to prevent bad things."

• "Now, let's use them to create good things."

Productivity Hacks

• The Automatic Ticket Inserter (prepare-commit-msg)

  • Reads branch name feature/PROJ-451-login

  • Automatically prepends PROJ-451:  to the commit message.

  • "Turns a manual chore into an invisible, automated process."

• The Automatic Dependency Installer (post-merge)

  • Detects changes to package.json after a merge.

  • Automatically runs npm install.

  • "Handles a common follow-up task without any user intervention."

Workflow Enhancements

• The "Did you run migrations?" Reminder (post-merge)

  • Detects changes in the db/migrate/ directory.

  • Prints a big, bold, colorful message to the console: "ATTENTION: New migrations were pulled. Remember to run rails db:migrate!"

  • "A low-effort, high-impact nudge at the perfect moment."

Fun & Quirky Hooks!

• The Commit-Triggered Sound Effect (post-commit)

  • On successful commit, runs afplay level-up.mp3.

  • "Provides positive, ambient feedback."

• The ASCII Art Signature (prepare-commit-msg)

  • Appends a block of ASCII art to the end of every commit message.

  • "Adds a bit of personality and fun."

• (Optional: A short screen recording demonstrating one of these).

The Call to Action

• A large question on the screen:

• "What is a repetitive, annoying, or manual task in your personal workflow that a simple script could solve?"

A 4-Step Strategy for Your Team

• A numbered list of actionable steps.

• 1. Start Small & Provide Value: Don't boil the ocean. Introduce a single, undeniably useful hook first. An auto-formatter like Black or Prettier is a perfect start because its value is immediately obvious.

• 2. Get Buy-In, Don't Mandate: Share a success story (like the secret-scanning one). Show, don't just tell. Frame it as a tool that helps everyone, not a process that is forced upon them.

• 3. Use a Framework for Consistency: Once you have more than one hook or more than one developer, adopt a framework like pre-commit or Husky. This is non-negotiable for team success.

• 4. Document the Setup: Add the two-line installation guide to your CONTRIBUTING.md or team wiki. Make it the path of least resistance.

Thank You & Q&A

• Title: Q&A
• Instructor Name
• Email / Twitter / LinkedIn
• Link to GitHub Repo
• Link to Workshop Feedback Form