DevOps in Action (Workshop)

In this workshop, you’ll collaborate on a real-world CI/CD workflow using GitHub, Vercel, PostgreSQL, and the Person App (CRUD) project.

✅ Assumptions

One student (the Branch Owner) has already forked Callum's Person App repo, deployed the main branch to Vercel Production, and connected it to a PostgreSQL database on Vercel Storage using Neon Postgres.

The team will use GitHub for version control and collaboration, Vercel for deployments, and Prisma ORM for database access and schema migrations.

👥 Team Roles

RoleResponsibilities

Branch Owner

Manages the GitHub repo, creates the dev branch, connects and deploys to Vercel (Production and Staging), configures environments, handles PR approvals, and controls database access for UAT and Production.

Collaborators

Each creates their own local Postgres DB via Neon (Vercel Storage), implements features, raises and revises PRs, and handles their own Prisma migrations locally.

🧩 Assigned Tasks

Each team member completes one of the following tasks using a feature branch:

TaskBranch Example

Add current year in footer

feat/footer-year

Enhance nav bar

feat/nav-enhancement

Update landing page

feat/landing-page

Improve login page UI

feat/login-page

Enhance dashboard

feat/dashboard-ui

Remove unused variables

chore/cleanup-vars

Refactor functions to typed declarations

refactor/typed-functions

🛠 Local Development Setup (All Developers)

Create your own Postgres DB instance using Vercel Storage (Neon):

Go to your Vercel dashboard → Storage → Neon → Create new project.

Copy the database connection URL.

Add your DB URL to .env (or .env.local):

1DATABASE_URL=postgresql://<your-credentials>@<your-db>.neon.tech/<db-name>

Install dependencies:

1npm install

Run your own Prisma migrations locally:

1npx prisma migrate dev --name init

⚠️ You are responsible for managing your own schema locally using your own DB.

🔒 Environment Credential Management

EnvironmentWho ManagesShareable?

Local (.env.local)

Each developer

✅ (your own instance)

Staging/UAT (.env.staging)

Branch Owner

❌

Production (.env.production)

Branch Owner

❌

⚠️ Only the Branch Owner has access to UAT and Production DB credentials.

🔧 If your feature requires schema changes (Prisma migration) on UAT or Production, the Branch Owner must perform the migration after merging.

🔁 Git Workflow Summary

1# Checkout dev
2git checkout dev
3git pull origin dev
4
5
6# Create feature branch
7git checkout -b feat/<task>
8
9# Push branch
10git push origin feat/<task>

🔃 Raise a Pull Request (PR)

On GitHub → Pull Requests → New Pull Request

Base branch: dev, compare with your feat/<task> branch

Add a clear title and description

Tag a peer reviewer

Submit PR for review

💬 Peer Review & Commenting

As a reviewer:

View Files changed tab on the PR

Add inline comments or suggestions

Under Review changes, select:

✅ Approve

🔁 Request changes

💬 Comment only

❌ PR Not Approved – What To Do

Option 1: Revise Existing PR

Stay on your feature branch

Apply the requested changes

Push updates:

1git add .
2git commit -m "fix: addressed PR feedback"
3git push origin feat/<your-task>

GitHub will automatically update the existing PR

Option 2: Close and Create a New PR

Close the existing PR on GitHub

Create a new feature branch from dev:

1git checkout dev
2git pull origin dev
3git checkout -b feat/<task>-v2

Reapply your changes, commit, and push

Raise a new PR and link the previous one for context

🔥 Urgent Fix on main – Rebasing Workflow

Branch Owner performs urgent fix on main:

1git checkout main
2# Make fix
3git commit -am "fix: urgent production issue"
4git push origin main

Rebase dev onto updated main (Branch Owner only)

1git checkout dev
2git fetch origin
3git rebase origin/main
4# Resolve conflicts if needed
5git push origin dev --force

Collaborators: Rebase feature branch onto updated dev

1git checkout feat/<your-task>
2git fetch origin
3git rebase origin/dev
4# Resolve conflicts
5git add .
6git rebase --continue
7git push origin feat/<your-task> --force

📦 Deployment Flow

BranchDeployment

dev

Vercel Staging

main

Vercel Production

🧠 Commit Message Convention

TypePrefixExample

Feature

feat:

feat: add footer year

Chore

chore:

chore: remove unused imports

Fix

fix:

fix: redirect issue

Refactor

refactor:

refactor: use typed function

✅ Completion Checklist

Each dev created a Postgres DB via Neon and set .env.local

Prisma migration performed on local Neon instance

PR raised to dev

Peer review completed or feedback given

PR revised or resubmitted if needed

Branch Owner reviewed and merged PR

Prisma migration done on UAT/Prod by Branch Owner (if required)

Vercel Staging and Production deployments verified