PTENES
MÓDULO 1.3

☁️ GitHub: Tu casa en la nube

Hasta aquí tu código solo vive en tu computadora. Ahora aprenderás a llevarlo a la nube: crear una cuenta, conectar el entorno local y el remoto, publicar con un clic y colaborar. GitHub es donde el mundo guarda y muestra lo que construye.

6
Temas
45
Minutos
Básico
Nivel
Práctico
Tipo
1

Crear una cuenta en GitHub

O GitHub es un sitio donde guardas tu código en Internet gratis. Antes de subir cualquier cosa, necesitas una cuenta. Es rápido: es el mismo proceso que crear una cuenta en cualquier sitio, pero con un detalle importante que mucha gente confunde al principio: git y GitHub no son lo mismo.

TU COMPUTADORA 💻 git local git push GITHUB (NUBE) ☁️ usuario/repo respaldo + colaboración Pages SITIO EN LÍNEA 🌐 voce.github.io

Paso a paso para crear la cuenta

  1. 1.Accede github.com y haz clic en Sign up.
  2. 2.Escribe tu correo electrónico. Usa uno al que realmente tengas acceso (tendrás que confirmarlo).
  3. 3.Crea una contraseña fuerte y elige uno nombre de usuario (nombre de usuario). Este nombre aparecerá en la URL de tus proyectos, por ejemplo: github.com/seunome.
  4. 4.Resuelve el desafío de verificación (rompecabezas antirobots).
  5. 5.Abre tu correo, copia el código de confirmación y pégalo en GitHub. Listo.

🧠 Analogía: git es la app de fotos, GitHub es la nube

Piensa en el git como la app de fotos de tu celular: organiza, guarda versiones y todo queda en tu máquina. El GitHub y es la nube (como Google Fotos): envías una copia a Internet, queda segura aunque el celular se rompa y otras personas pueden verla.

  • •git = programa en tu computadora que controla versiones (offline, local)
  • •GitHub = sitio en internet donde guardas y muestras el código (online, en la nube)
  • •Usas git para hacer commits y GitHub para guardar esos commits en la nube

💡 Consejo: elige bien el username

Tu nombre de usuario es casi una tarjeta de presentación profesional. Elige algo sencillo y serio (por ejemplo: joaosilva) en lugar de apodos. Aparecerá en la URL de tus sitios en GitHub Pages, así que piensa en algo que incluirías en tu currículum.

2

Tokens de acceso (PAT)

Aquí hay una sorpresa: tu contraseña de GitHub ya no funciona para enviar código desde la terminal. Por seguridad, GitHub exige un token (Personal Access Token, o PAT). Es como una contraseña desechable con permisos específicos, solo para la terminal.

🧠 Analogía: el token es la llave del hotel

Tu contraseña es la llave maestra que lo abre todo. El token es la tarjeta de una habitación de hotel: abre solo lo necesario, vence por sí solo y, si lo pierdes, basta con cancelarlo y generar otro, sin cambiar toda la cerradura. Por eso GitHub prefiere que uses un token en la terminal y no la contraseña.

Cómo crear un Personal Access Token

  1. 1.En GitHub, haz clic en tu foto (esquina superior derecha) → Settings.
  2. 2.Desplázate hasta el final del menú lateral → Developer settings.
  3. 3.Personal access tokens → Tokens (classic) → Generate new token.
  4. 4.De un nombre (ej.: «mi-pc»), define la validez (ej.: 90 días) y marca el alcance repo.
  5. 5.Haz clic en Generate token e COPIA en el momento. Solo aparece una vez.

👁 Qué vas a ver en la pantalla

# Después de generar, aparece un token así:

ghp_A1b2C3d4E5f6G7h8I9j0K1l2M3n4O5p6Q7r8

# En el primer push, la terminal pide:

Username: seunome

Password: (pega el token aquí, NO la contraseña)

Cuando la terminal pida «Password», pega el token, no tu contraseña. Se rechazará la contraseña.

✓ Qué HACER

  • ✓Guardar el token en un gestor de contraseñas
  • ✓Marcar solo el scope que necesitas (repo)
  • ✓Definir una vigencia y generar otra cuando expire

✗ Qué NO hacer

  • ✗Pegar el token dentro del código del proyecto
  • ✗Enviar el token por correo electrónico o chat a alguien
  • ✗Marcar TODOS los scopes sin necesitarlos

⚠️ Error común

Problema: al dar git push, aparece Authentication failed o Support for password authentication was removed.
Solución: eso casi siempre es un token expirado o escribiste la contraseña en lugar del token. Genera un token nuevo en Settings > Developer settings > Tokens y pégalo en lugar de la contraseña cuando el terminal te lo pida.

3

Conectar Local y Nube

Ya tienes un proyecto con git en tu computadora (módulo anterior) y una cuenta en GitHub. Falta iniciar ambos. Esto se hace con cuatro comandos principales: remote add, push, pull e clone.

git remote add + git push - Enviar a la nube

Primero creas un repositorio vacío en GitHub (botón New). Te muestra la URL. Después, en la terminal, dentro de la carpeta del proyecto:

# Apuntar el proyecto local al repo en la nube

$ git remote add origin https://github.com/seunome/meu-site.git

# Renombrar la rama principal a main (estándar de GitHub)

$ git branch -M main

# Enviar todo por primera vez (-u conecta ambos extremos)

$ git push -u origin main

Enumerating objects: 5, done.

Writing objects: 100% (5/5), 612 bytes, done.

To https://github.com/seunome/meu-site.git

* [new branch] main -> main

branch 'main' set up to track 'origin/main'.

origin y es solo un apodo para la URL del repo. El -u conecta tu branch local con la remota, así que después de esto basta con git push.

git pull - Traer cambios de la nube

Cuando tú (o un colega) cambies algo directamente en GitHub, usa pull para descargar esos cambios en tu computadora.

$ git pull

remote: Enumerating objects: 3, done.

Updating a1b2c3d..d4e5f6g

Fast-forward

index.html | 2 +-

1 file changed, 1 insertion(+), 1 deletion(-)

git clone - Descargar un repo completo

Para empezar a trabajar en un proyecto que ya existe en la nube (tuyo o de otra persona), usa clone. Descarga todo y ya conecta el origin automáticamente.

$ git clone https://github.com/seunome/meu-site.git

Cloning into 'meu-site'...

remote: Counting objects: 100% (8/8), done.

Receiving objects: 100% (8/8), done.

$ cd meu-site

# Listo, ya puedes editar y hacer push

💡 Consejo: el ciclo del día a día

La rutina siempre es la misma: git pull (obtener lo nuevo) → editar → git add . → git commit -m "..." → git push. Haz pull al principio y push al final.

4

GitHub Pages: activar y publicar

Aquí ocurre la magia: GitHub toma el código de tu repo y publica como un sitio web real en Internet, con dirección propia y gratis. Esto se llama GitHub Pages. En pocos clics, tu HTML se convierte en un enlace que cualquier persona del mundo puede abrir.

1

Abre la configuración del repo

En tu repositorio en GitHub, haz clic en la pestaña Settings (en la parte superior). En el menú lateral izquierdo, haz clic en Pages.

2

Elige la branch

En "Source", selecciona Deploy from a branch. En "Branch", elige main y es la carpeta / (root). Haz clic en Save.

3

Espera a que termine la compilación

GitHub tarda de 30 segundos a unos minutos en crear el sitio. Actualiza la página y pronto aparecerá el enlace verde con la dirección. Ten paciencia la primera vez.

👁 Qué vas a ver

# Después del build, aparece un recuadro verde:

✓ Your site is live at

https://seunome.github.io/meu-site/

El patrón de la dirección es usuario.github.io/repo. Haz clic en el enlace y tu sitio se abre en el navegador, en línea y disponible para todo el mundo.

⚠️ Error común

Problema: abro la URL y aparece 404 o una página en blanco.
Solución: revisa tres cosas. (1) Tu archivo principal debe llamarse index.html y estar en la raíz del repo. (2) Es posible que el build no haya terminado; espera un poco más y recarga. (3) La branch seleccionada en Pages tiene que ser la que contiene el código (main).

5

IA en el código: Codex y Copilot

GitHub no solo guarda código: también ofrece asistentes de inteligencia artificial que escriben código contigo. Los más famosos son GitHub Copilot y modelos como el Codex. Completan líneas automáticamente, generan funciones enteras y responden tus dudas dentro del editor.

🧠 Analogía: un copiloto de verdad

Piensa en un vuelo: tú eres el piloto, pero tienes un copiloto al lado que ya conoce el camino y te va sugiriendo el siguiente paso. Tú decides todo, pero él adelanta el trabajo pesado. Copilot hace eso con el código: empiezas a escribir y él sugiere el resto en gris. Presionas Tab para aceptar o lo ignoras.

🤖 GitHub Copilot

Extensión que instalas en VS Code. A medida que escribes, sugiere la continuación del código en tiempo real (autocompletado inteligente).

  • •Sugerencias en gris mientras escribes
  • •Chat para resolver dudas en el editor
  • •Tab acepta, Esc descarta

⚡ Codex y asistentes

Modelos de IA (como Codex) que generan código a partir de una descripción en portugués. Tú pides lo que quieres y el modelo lo escribe.

  • •Generan funciones enteras a partir de texto
  • •Explican código que no entiendes
  • •Aceleran tareas repetitivas

👁 Qué vas a ver en el editor

# Escribes solo un comentario:

// función que suma dos números

# Copilot sugiere (en gris) el resto:

function soma(a, b) {

return a + b;

}

# Presionas Tab y el código aparece listo

💡 Consejo: la IA acelera, pero tú decides

Estos asistentes aumentan mucho la productividad, pero a veces se equivocan. Siempre lee y entiende lo que la IA generó antes de aceptarlo. Úsalo como atajo para el trabajo pesado, no como sustituto del aprendizaje. Quien entiende el código dirige a la IA, no al revés.

6

Ejercicio: desde cero hasta el push

Es hora de reunir todo. Vas a crear un repositorio desde cero, conectarlo con GitHub y enviar tu primer proyecto a la nube. Al final, tu código estará en línea, guardado y listo para convertirse en sitio web.

🎯 Lo que vas a lograr

Un repositorio en GitHub llamado meu-primeiro-repo con un archivo subido, visible en tu cuenta para que todo el mundo lo vea.

Paso 1: Crea el repo en GitHub

En el sitio, haz clic en el + (esquina superior derecha) → New repository. Nombre: meu-primeiro-repo. Deja público e no marca "Add a README". Haz clic en Create repository.

Paso 2: Prepara el proyecto local

$ mkdir meu-primeiro-repo

$ cd meu-primeiro-repo

$ git init

Initialized empty Git repository

Paso 3: Crea y guarda un archivo

$ echo "# Mi Primer Repo" > README.md

$ git add .

$ git commit -m "primer commit"

[main (root-commit) a1b2c3d] primer commit

1 file changed, 1 insertion(+)

Paso 4: Conéctate con GitHub

# Usa la URL que te mostró GitHub

$ git remote add origin https://github.com/seunome/meu-primeiro-repo.git

$ git branch -M main

Paso 5: Sube a la nube

$ git push -u origin main

# Cuando te lo pida, pega el TOKEN en lugar de la contraseña

Username: seunome

Password: ghp_xxxxxxxxxxxx

* [new branch] main -> main

Paso 6: Revisa en el navegador

Abre github.com/seunome/meu-primeiro-repo. Tu README.md está allí, en la nube, para que el mundo lo vea.

✓ Qué HACER

  • ✓Dar commit antes de intentar hacer push
  • ✓Pegar el token cuando te pida la contraseña
  • ✓Verificar el repo en el navegador después

✗ Qué NO hacer

  • ✗Marcar "Add README" al crear (genera un conflicto en el push)
  • ✗Escribir la contraseña en lugar del token
  • ✗Olvidar el git init antes de todo

🏆 ¡Felicitaciones!

Tu código ahora está en la nube. Sabes crear una cuenta, generar un token, conectar los entornos local y remoto, y publicar. En el próximo módulo, vas a unir todo en un proyecto real de principio a fin: una landing page desde cero hasta el deploy.

📚 Resumen del módulo

✓
git y GitHub son cosas diferentes - git y la app local, GitHub y la nube donde guardas
✓
Token (PAT) en lugar de contraseña - creado en Settings > Developer settings, copiado en el momento
✓
remote add, push, pull, clone - conectar, enviar, traer y descargar código
✓
GitHub Pages publica tu sitio - Settings > Pages > branch main, en usuario.github.io/repo
✓
Copilot y Codex aceleran el código - autocompletan y generan, pero tú decides y revisas

Siguiente módulo:

1.4 - Proyecto: Landing Page (combina terminal, git y GitHub en un proyecto real desde cero hasta el deploy)