Git&GitHubWorkshop

1

Accede y Forkea el Repositorio

Ve al repositorio oficial en GitHub y familiarízate con el proyecto. Revisa el README y la estructura del proyecto. Luego dale click a Fork y crear un fork del repositorio.

Paso 1: Acceder al repositorio
Click para ampliar
# URL del repositorio
https://github.com/Dav082004/XperienceCampusWorkshop
2

Haz Fork del Repositorio

Haz clic en el botón "Fork" en la esquina superior derecha del repositorio. Esto creará una copia del proyecto en tu cuenta de GitHub.

Paso 2: Fork del repositorio

El fork te permite trabajar en tu propia copia sin afectar el original.

3

Verifica tu Fork

Verificar que se forkeo correctamente y está en tu perfil. Debe decir tu_perfil / XperienceCampusWorkshop y mostrar que fue forkeado del repositorio principal. Esto te permitirá realizar cambios sin afectar el repositorio original.

Paso 3: Verificar fork

El repositorio debe mostrar "forked from Dav082004/XperienceCampusWorkshop"

4

Crear Codespace

Haz clic en el botón "Code" verde y luego ve a "Codespaces" y dale clic a "Create codespace on main". Esto te dará un editor de código remoto que ya está preconfigurado con LiveServer, Image Preview y Git.

Paso 4: Crear Codespace

El Codespace incluye todas las extensiones necesarias preinstaladas

5

Verificar Estado Inicial

Una vez dentro del Codespace, verifica que estás en la rama main de tu repositorio forkeado usando git status. También puedes usar git branch --all para ver todas las ramas disponibles. Solo debería aparecer la rama main.

Paso 5: Verificar estado inicial
# Verificar estado actual
git status

# Ver todas las ramas
git branch --all
6

Crear Nueva Rama

Para seguir el GitFlow correctamente, crea una nueva rama específica para tu contribución. Usa git checkout -b feat/new-profilexde (reemplaza con tu nombre). Verás que donde decía (main) ahora aparece el nombre de tu nueva rama.

Paso 6: Crear nueva rama
# Crear y cambiar a nueva rama
git checkout -b feat/new-tu-nickname

# Verificar cambio de rama
git branch
7

Crear tu Archivo JSON

Ahora que estás en una nueva rama, crea un archivo tu-nickname.json dentro de la carpeta contributors. Agrega tu información: nombre, nickname, GitHub, LinkedIn, Instagram (opcionales), imagen (puedes usar tu avatar de GitHub agregando .png), descripción y hasta 4 hobbies.

Paso 7: Crear archivo JSON

Puedes encontrar el template en templates/contributor-template.json. Recuerda que JSON no permite comentarios, así que debes quitar las líneas con // del template.

{
  "name": "Tu Nombre",
  "nickname": "TuUsuario",
  "github": "https://github.com/TuUsuario",
  "linkedin": "https://www.linkedin.com/in/tu-linkedin",
  "instagram": "https://www.instagram.com/tu-instagram/",
  "image": "https://github.com/TuUsuario.png",
  "description": "Breve descripción sobre ti.",
  "hobbies": ["Hobby1", "Hobby2", "Hobby3", "Hobby4"]
}
8

Preparar y Hacer Commit

Usa git add . para preparar todos los cambios para el commit. Luego realiza el commit con un mensaje descriptivo usando git commit -m "mensaje del commit". Después de esto, git status mostrará que la rama está limpia.

Paso 8: Preparar commit
# Preparar cambios
git add .

# Hacer commit
git commit -m "feat: add new profile for [tu-nickname]"

# Verificar estado
git status
9

Subir Cambios a GitHub

Ahora que tu commit está listo, sube los cambios a tu repositorio forkeado usando git push origin feat/new-profilexde (reemplaza con el nombre de tu rama). Esto subirá tu nueva rama con todos los cambios a GitHub.

Paso 9: Push a GitHub
# Subir rama al repositorio forkeado
git push origin feat/new-tu-nickname
10

Comparar y Pull Request

Verifica que ahora tienes 2 ramas en tu repositorio. GitHub te permitirá "Comparar y hacer Pull Request". Puedes ver que el último autor del cambio fuiste tú. Haz clic en el botón verde "Compare & pull request".

Paso 10: Comparar y PR

GitHub detecta automáticamente tu nueva rama y te permite crear el PR

11

Crear Pull Request

Verifica que el Pull Request se hará entre el repositorio principal y la rama main, mergeando los cambios de tu repo forkeado y tu nueva rama. Agrega un mensaje descriptivo explicando tus cambios y haz clic en "Create Pull Request".

Paso 11: Crear PR
11.1

Revisar Cambios en Código

Puedes revisar todos los cambios realizados en código antes de finalizar el Pull Request. Esto te permite verificar que todo esté correcto.

Paso 11.1: Ver cambios en código
12

Pull Request Abierta

Tu PR está ahora abierta para revisión. Las personas con roles suficientes pueden comentar, rechazar o aprobar la PR.

Paso 12: PR abierta
13

Aprobación y Merge

Cuando no hay conflictos y todo está correcto, un revisor puede aprobar la PR y hacer el merge. Tus cambios serán integrados al repositorio principal.

Paso 13: Aprobación y merge
14

Historial de Commits

Puedes ver el historial de commits donde aparece tu commit junto con el commit del auditor que aprobó los cambios. Tu contribución forma parte oficial del proyecto.

Paso 14: Historial de commits
15

¡Felicitaciones!

¡Tu contribución ha sido exitosa! Ahora apareces en la página colaborativa con tu perfil, información y enlaces. Eres oficialmente parte del proyecto.

Paso 15: Resultado final

¡Has completado tu primera contribución!

  • Fork realizado correctamente
  • Codespace configurado y usado
  • Rama nueva creada siguiendo GitFlow
  • Cambios realizados y commitados
  • Pull Request creado y aprobado
  • 🎉 ¡Apareces en la página!

Sistema de Validación Automática

Validación de Formato

El sistema verifica que el formato de tu contribución sea correcto y que todos los campos requeridos estén presentes.

Auto-merge

Si todas las validaciones pasan, tu PR será automáticamente mergeado y aparecerás en la página principal.

Corrección de Errores

Si hay errores, recibirás comentarios específicos sobre qué corregir. Puedes hacer nuevos commits para solucionarlos.

Ejemplos de Contribución

Ejemplo Correcto

{
  name: "Ana María González",
  nickname: "anagonzalez",
  github: "https://github.com/anagonzalez",
  linkedin: "https://linkedin.com/in/ana-gonzalez-dev",
  description: "Estudiante de Ingeniería de Sistemas especializada en desarrollo web",
  hobbies: ["Programación", "Lectura", "Yoga", "Fotografía"]
},

Errores Comunes

Falta la coma al final del objeto
URL de GitHub incompleta o incorrecta
Más de 4 hobbies en el array
Descripción demasiado larga (más de 150 caracteres)
Nickname duplicado (ya existe en el sistema)