Git Commit and Push
Quick Start
When committing and pushing changes:
-
Check git status to see what changed
-
Stage all changes with git add .
-
Generate descriptive commit message following conventional commits
-
Commit with the message
-
Push to remote repository
Tras el push (deploy en Vercel): Si se cambiaron assets o se quiere que la actualización se vea pronto en todos los dispositivos, recordar purgar caché: npm run cache:purge (o Vercel → Settings → Caches). Ver skill build-start y docs/CACHE_PURGE_ANTES_DEPLOY.md .
Commit Message Format
Use Conventional Commits format:
<type>(<scope>): <subject>
<body>
<footer>
Types
-
feat : New feature
-
fix : Bug fix
-
docs : Documentation changes
-
style : Code style changes (formatting, missing semicolons, etc.)
-
refactor : Code refactoring
-
perf : Performance improvements
-
test : Adding or updating tests
-
chore : Maintenance tasks, dependencies, build config
-
ci : CI/CD changes
Scope (Optional)
Component, module, or area affected (e.g., auth , products , admin )
Subject
-
Use imperative mood: "add" not "added" or "adds"
-
First letter lowercase
-
No period at the end
-
Max 72 characters
Body (Optional)
-
Explain WHAT and WHY, not HOW
-
Wrap at 72 characters
-
Use bullet points for multiple changes
-
Reference issues: "Closes #123"
Footer (Optional)
-
Breaking changes: BREAKING CHANGE: <description>
-
Issue references: Closes #123 , Fixes #456
Examples
Simple Feature
git commit -m "feat(products): add lazy loading to product images
- Implement lazy loading for offscreen images
- Add sizes attribute for responsive images
- Optimize image decoding with async
Impact: ~250ms improvement in image loading performance"
Multiple Changes
git commit -m "feat: optimizaciones de performance post-deploy
- Optimización de JavaScript: lazy loading de framer-motion en 5 componentes
- Optimización de imágenes: agregado lazy loading, sizes y decoding async
- Optimización de base de datos: aplicados 7 índices para queries críticas
- Documentación: agregado resumen completo de optimizaciones
Impacto estimado: ~1.6s de mejora en métricas de performance
- JavaScript no utilizado: ~1.3s
- Imágenes offscreen: ~100ms
- Sizing de imágenes: ~150ms
- Tiempo de respuesta del servidor: ~44ms"
Bug Fix
git commit -m "fix(auth): resolve session expiration issue
- Fix session token refresh logic
- Add proper error handling for expired tokens
- Update session timeout configuration
Fixes #123"
Performance Improvement
git commit -m "perf(database): optimize product queries with indexes
- Add composite index on products(brand, is_active, created_at)
- Add index on product_categories(category_id, product_id)
- Reduce query time by ~44ms
Closes #456"
Workflow Steps
- Check Status
git status
Review what files changed. Identify the type of changes (feature, fix, refactor, etc.)
- Stage Changes
git add .
Or stage specific files:
git add path/to/file1.ts path/to/file2.tsx
- Generate Commit Message
Analyze the changes and create a commit message:
-
If multiple related changes: Group them under one commit with bullet points
-
If unrelated changes: Suggest separate commits
-
If breaking changes: Include BREAKING CHANGE: in footer
-
If fixes issues: Reference issue numbers in footer
- Commit
git commit -m "type(scope): subject
body
footer"
For multi-line messages, use:
git commit -m "type(scope): subject" -m "body line 1" -m "body line 2"
- Push
git push
Or specify branch:
git push origin main
Best Practices
-
One logical change per commit: Don't mix unrelated changes
-
Write clear, descriptive messages: Future you (and teammates) will thank you
-
Use present tense, imperative mood: "add feature" not "added feature"
-
Reference issues: Link commits to issues/tickets when applicable
-
Keep commits focused: If you made many changes, consider multiple commits
-
Test before committing: Ensure code works before committing
-
Review staged changes: Use git diff --staged before committing
Common Scenarios
Performance Optimizations
git commit -m "perf: optimize component rendering
- Implement React.memo for expensive components
- Add lazy loading for below-fold content
- Reduce bundle size by 40KB
Impact: ~1.3s improvement in initial load time"
Database Migrations
git commit -m "feat(database): add indexes for product queries
- Create composite index on categories(display_order, name)
- Add index on products(slug, is_active)
- Optimize JOIN queries with product_categories indexes
Migration: 20260123_optimize_data_server_queries"
Documentation Updates
git commit -m "docs: add performance optimization guide
- Document optimization strategies
- Add examples and best practices
- Include metrics and impact analysis"
Bug Fixes
git commit -m "fix(images): resolve lazy loading issue
- Fix images not loading with lazy attribute
- Add proper error handling for failed loads
- Update sizes attribute for responsive images
Fixes #789"
Error Handling
If push fails:
-
Check if remote branch is ahead: git fetch
-
Pull and merge: git pull origin main
-
Resolve conflicts if any
-
Push again: git push
If commit fails:
-
Check git config: git config user.name and git config user.email
-
Verify you're on the correct branch: git branch
-
Check for uncommitted changes: git status
Notes
-
Always verify changes with git status before committing
-
Use git diff --staged to review what will be committed
-
Consider using git commit --amend for small fixes to last commit (before pushing)
-
Use git commit --no-verify only when absolutely necessary (bypasses hooks)