General Assembly logo

Lab 4: Collaborative Version Control

Introduction

In professional software development, version control systems (like Git) help teams collaborate, track changes, and maintain clean histories of project evolution. In this lab, you will simulate that workflow without Git, using manual folder versions, written changelogs, and AI-generated commit-style summaries. This hands-on exercise builds intuition for how version control works under the hood and prepares you to transition smoothly into Git-based workflows in later labs.

You will create multiple versions of a small HTML/CSS project, document your changes clearly, and practice describing modifications using concise commit-style messages—an essential professional skill. By the end, you'll experience how disciplined version management improves clarity, collaboration, and project structure.

Learning Objectives

By the end of this one-hour lab, you will be able to:

  • Organize project iterations using clearly labeled versioned folders
  • Document code changes using a structured CHANGELOG.md
  • Use AI to generate concise commit-style messages and documentation summaries
  • Compare manual versioning with real version control concepts (branches, commits, diff)
  • Practice a collaborative development mindset and documentation discipline

Getting Started

Prerequisites

Before beginning this lab, you should have:

  • Basic knowledge of HTML/CSS
  • Ability to create and manage local folders/files
  • Access to ChatGPT or another AI assistant
  • A text editor (VS Code recommended)

No Git experience is required—this is a conceptual precursor.

Setup Instructions

Step 1: Download the Starter Project

Your instructor or LMS will provide a small starter project folder called:

project_starter/
  index.html
  styles.css

Copy this folder somewhere convenient—Documents, Desktop, or a dev workspace.

Step 2: Create Your Lab Workspace

Make a new folder for the lab:

lab4_manual_version_control/

Inside it, create a folder for your first version:

v1_initial/

Copy the starter project files into v1_initial.

Lab Structure

This lab contains the following conceptual components:

  • README.md – This file (lab instructions)
  • v1_initial, v2_feature, v3_fix, ... – Your progressively created project versions
  • CHANGELOG.md – A cumulative record describing changes across versions
  • instructor_guide.md – Theory reference for instructors (20–30 min module)

Exercise Overview

In this lab, you will create three sequential versions of your project:

  1. Version 1 – Initial State
  2. Version 2 – New Feature (student-selected enhancement)
  3. Version 3 – Bug Fix / Cleanup

For each version, you will:

  • Duplicate the previous folder
  • Make meaningful HTML/CSS edits
  • Write a descriptive changelog entry
  • Use AI to generate a commit-style message and documentation summary

This simulates Git concepts:

Git Concept Manual Equivalent
Commit New folder version + changelog
Commit message AI-generated summary
Branch Parallel folders (optional extension)
History CHANGELOG.md

How to Work Through the Lab (1 Hour)

Below is the recommended timeline.

Part 1 — Create Version 1

  1. Open the v1_initial folder in your editor.
  2. Review the HTML and CSS starter files.
  3. Create a new file in the root lab folder:
CHANGELOG.md
  1. Add an entry:
# Version 1 — Initial Project
- Copied starter files into v1_initial.
- No modifications yet.
  1. Ask AI:

Generate a concise commit-style message describing Version 1.

Paste the result at the end of the entry:

Commit: <AI message>

Part 2 — Create Version 2: Add a New Feature (20 minutes)

  1. Duplicate v1_initial → create a new folder:
v2_feature/
  1. Choose one new feature to add:

Examples:

  • Add a navigation bar
  • Add a hero section with headline
  • Add a styled footer
  • Add a card component
  • Add a responsive section
  1. Implement the feature in HTML/CSS.
  2. Open CHANGELOG.md and add:
# Version 2 — Added Feature
- Description of the feature you added (1–3 bullet points)
  1. Ask AI:

Generate a professional, concise commit message summarizing this feature addition.

Add it to the entry:

Commit: <AI message>

Part 3 — Create Version 3: Fix or Improve Something (20 minutes)

  1. Duplicate v2_feature → create:
v3_fix/
  1. Apply a bug fix or improvement:

Ideas:

  • Fix layout spacing
  • Fix text contrast
  • Improve the color scheme
  • Clean up repeated CSS
  • Improve class names
  • Add comments
  1. Update your CHANGELOG.md:
# Version 3 — Bug Fix / UI Improvement
- Bullet points describing the fix or improvement
  1. Ask AI:

Generate a commit-style summary describing this fix/improvement concisely.

Append it to the entry.

Part 4 — Reflection (10 minutes)

Add a new section to your CHANGELOG.md:

# Reflection

Answer:

  • Which manual step felt most similar to real version control?
  • What would Git automate for you?
  • How did commit-style summaries help clarify the changes?
  • How might this workflow support collaboration among multiple developers?

Tips for Success

  • Keep folder names predictable (v1_, v2_, v3_).
  • Write changelog entries before generating the commit message—AI does better with context.
  • Keep changes small per version—this mirrors best practices in Git.
  • Commit messages should be short, imperative, and actionable.
  • Compare folders side-by-side to understand the concept of diffs.

What to Expect

After completing the lab, you will have:

  • A lab_manual_version_control/ folder with three fully documented project versions
  • A professional CHANGELOG.md with structured history
  • A set of clean AI-generated commit-style messages
  • A practical understanding of iterative version control thinking