UI DESIGN LAB
  • Home
  • Community
  • Library
  • Knowledge
  • Docs
ZHLogin

Docs

Platform
Site OverviewDevelopment LogCollaboration Guide
Template Library
Prompt BoardStyle Board
Agent Workflow
Agent Deep DiveProject Workflow AgentAgent Output PathPrompt Agent EvalsDesign System PanelsKnowledge Base GuideDeepSeek Agent Incident Notes
UI DESIGN LABDocumentation

Read public Markdown docs; admins can maintain them in editor pages.

Collaboration Guide

Collaboration Guide

A beginner-friendly guide to branches, PRs, rebase, conflict handling, and team roles for this website.

Back to docs

Chapter preview

Core PrinciplesSuggested ResponsibilitiesDaily WorkflowPull Request TemplateWhat Rebase MeansMerge or RebaseAfter MergeRecommended Rhythm

Collaboration Guide

This document explains how the UI DESIGN LAB team should collaborate on website development with GitHub. It is written for collaborators who are still getting comfortable with Git and GitHub.

Core Principles

  • Keep main stable and ready to build.
  • Create one branch for each task.
  • Keep each branch focused on one clear change.
  • Open a Pull Request before merging into main.
  • Avoid large simultaneous edits to the same file, especially global files like src/app/globals.css.

Suggested Responsibilities

  • Product and review: decide priorities, page content, and whether a PR is ready to merge.
  • UI and interaction: own visual details, component states, responsive behavior, and polish.
  • Data and backend: own Supabase, permissions, APIs, auth, and data shape.
  • Docs and content: own the docs hub, template notes, changelog, and tutorials.
  • Codex: inspect branches, explain diffs, resolve conflicts, run builds, and help with review.
  • Daily Workflow

    Start from the latest main:

    git switch main
    git pull origin main

    Create a task branch:

    git switch -c shuyang/menu-purple

    Use branch names like:

    shuyang/menu-purple
    wang/docs-collaboration
    codex/fix-auth-redirect

    Before pushing, verify locally:

    npm run typecheck
    npm run build

    Then commit and push:

    git add .
    git commit -m "Update selected menu color"
    git push -u origin shuyang/menu-purple

    Open a Pull Request on GitHub and target main.

    Pull Request Template

    Use a short, clear PR description:

    What changed:
    - Updated the selected community menu color
    
    How I verified:
    - npm run typecheck
    - npm run build
    
    Notes:
    - CSS-only change, no business logic changed

    What Rebase Means

    rebase means: move your branch onto the latest main, then replay your own changes.

    Before:

    main:        A - B - C
    your branch: A - X

    After:

    main:        A - B - C
    your branch:         X'

    Common commands:

    git switch shuyang/menu-purple
    git fetch origin
    git rebase origin/main

    If there are conflicts, fix the files, then continue:

    git add conflicted-file
    git rebase --continue

    If the branch was already pushed, update GitHub with:

    git push --force-with-lease

    Only use --force-with-lease on your own feature branch. Do not force-push shared branches or main.

    Merge or Rebase

    • Use rebase when updating your own feature branch from the latest main.
    • Use GitHub merge or squash merge when the Pull Request is ready to enter main.
    • Do not rebase main.
    • Do not force-push main.

    Simple rule: your own branch can be cleaned up; the main line should only move forward.

    After Merge

    After the PR is merged, clean up locally:

    git switch main
    git pull origin main
    git branch -d shuyang/menu-purple

    Delete the remote branch from the GitHub PR page, or with:

    git push origin --delete shuyang/menu-purple

    Recommended Rhythm

    1. Branch from latest main
    2. Finish one small change
    3. Run typecheck and build
    4. Push to GitHub
    5. Open a PR
    6. Ask a teammate or Codex to review
    7. Merge into main
    8. Clean up the local branch