Curso tutorial de GIT y GITHUB desde 0 - Módulo 2 - Nuestro primer proyecto

Curso de Git y GitHub

curso-git-y-github-modulo-2-nuestro-primer-proyecto

En este segundo módulo del curso de git y github, vamos a ver como crear nuestro primer proyecto y subirlo a github. Hay que recordar que git y github fueron diseñados para cualquier tipo de archivo que te imagines, no hace falta ser programador o diseñador para utilizarlos, por ejemplo: si eres escritor y quieres subir tu proyecto para un futuro libro puedes hacerlo y no solo eso también gracias a github tendrás colaboración online con tus amigos o otros escritores, no importa a que te dediques si tienes algún archivo para subir y quieres compartirlo con el mundo y tener colaboración puedes hacerlo tranquilamente.

Vamos a ver 2 formas de subir un proyecto a GitHub, la primera mediante su interfaz gráfica y la segunda mediante la terminal y utilizando Git trabajando en conjunto con GitHub.

Curso completo: Curso de Git y GitHub

Temario: Módulo 2 - Nuestro primer proyecto

  1. Objetivos del módulo 2
  2. Crear un proyecto en GitHub
  3. Clonar un repositorio con GitHub Desktop
  4. ¿Qué es un Commit?
  5. Realizar cambios a nuestro proyecto en GitHub Desktop
  6. Subir nuestros cambios a GitHub desde GitHub Desktop
  7. Primeros pasos con Git: Configuración
  8. Primeros pasos con Git: Fundamentos de Git
  9. Primeros pasos con Git: Clonar un repositorio remoto con Git
  10. Primeros pasos con Git: Realizar un commit con Git
  11. Primeros pasos con Git: Subir nuestros cambios a GitHub con Git

Objetivos del módulo 2

Este módulo tiene como objetivo enseñarte como clonar un repositorio remoto, modificarlo realizando un commit y luego volverlo a subir para que se sincronice con tu repositorio remoto en la nube que en este curso sera almacenado en GitHub, todo esto lo veras mediante el cliente oficial de GitHub que es GitHub Desktop y luego desde Git en la terminal trabajando en conjunto con GitHub.

Primeros pasos con GitHub: Crear nuestro primer proyecto

GitHub hizo un gran trabajo en su interfaz web por lo tanto será muy fácil crear y publicar nuestro primer proyecto personal Muy bien vamos a empezar paso a paso como crear tu primer proyecto en GitHub...

  1. Iniciar sesión en GitHub y ir a github.com/new:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-1
  • Podemos ingresar a 'Start new project' o simplemente ir '+' y 'New repository'. ¿Qué es un repositorio?: es un lugar dónde se pueden guardar o almacenar los archivos que vamos a subir a GitHub.
  1. Ahora simplemente hay que crear nuestro repositorio:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-2
  • El nombre es importante ya que será nuestra URL final y como buscaremos nuestro repositorio, en este caso: github.com/gpost1/gburu.net-git-github. Es público porque usamos una cuenta gratuita por lo tanto será indexado por los motores de búsquedas y visto por todo el mundo, recuerda que si vas a guardar archivos de importancia o para un proyecto comercial compra una cuenta en GitHub su plan privado y mas barato es de 7 dólares por mes y cancelar cuando quieras, marque el cuadro de iniciar con el archivo README, esto quiere decir que creara un archivo de descripción principal en nuestro repositorio, generalmente en el README se habla sobre el proyecto y sus instrucciones de uso, etc.
  1. Ya creado podemos publicarlo y listo, tenemos nuestro primer proyecto subido a GitHub:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-3
  • Ya tenemos nuestro primer proyecto subido a GitHub, lo demás no tiene que preocuparnos ahora mas adelante veremos en detalle de cada rincón de GitHub.
  1. En GitHub Desktop el proceso es parecido:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-4

Primeros pasos con GitHub: Clonar un repositorio con GitHub Desktop

Clonar un repositorio es igual a decir descargar un repositorio, es lo mismo. Por lo tanto ahora que tenemos publicado nuestro primer proyecto es hora de clonarlo en nuestro entorno de trabajo local, vamos a tener una copia exacta en la web en de forma local. Para eso vamos a utilizar el cliente gráfico llamado GitHub Desktop que ya vimos en el primer módulo de este curso de git y github de como descargarlo e instalarlo, bien veamos como hacerlo:

  1. Clonar un repositorio desde GitHub Desktop:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-5
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-6
  • Elegir la ubicación es fundamental para tener un buen lugar de trabajo y poder encontrar el repositorio clonado.
  1. Finalmente lo clonamos:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-7
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-8
  • Como vemos por ahora solo tenemos un solo archivo que es el README.md, y aparece algo nuevo que es el 'Initial Commit', en este módulo pero mas adelante veremos que son los commits.

¿Qué es un Commit?

Un commit es una función que tiene Git y la misma nos sirve para archivar versiones de nuestro proyecto de forma ordenada y segura, por ejemplo cada vez que realizamos un cambio en un archivo podemos decirle a git que lo guarde como una nueva versión, pero que no borre la versión anterior, por lo tanto si nos arrepentimos del nuevo cambió podemos facilmente regresar al commit anterior y nuestro archivo volverá a quedar como antes de modificarlo. Esto es vital a la hora de trabajar en un proyecto porque si cometemos un error solo basta con volver al commit anterior y ya esta.


Estructura de un Commit

Un commit esta formado por 4 datos importantes:

  1. Commit ID: es el identificador que tienen los commit para que sean únicos entre todos los commits que puede tener un proyecto, se logra gracias al algoritmo SHA-1 que es una cadena de 40 caracteres hexadecimales (0-9 y a-f). Se calcula en base a los contenidos del archivo o estructura de directorios esto nos garantiza una máxima integridad y muy poco riesgos de colisión con otro ID igual. Ejemplo de ID: "24b9da6552252987aa493b52f8696cd6d3b00373".
  2. Parent: es el ID del commit anterior, es decir los commit tienen una relación padre-hijo, esto es vital para volver atrás cuando queramos.
  3. Author: es el autor del commit.
  4. Date: fecha exacta de cuando se creó el commit.

Despues tenemos el nombre y la descripción, van a ayudarnos para entender que cambios hicimos o hizo un miembro de nuestro equipo. No tienes que hacer commits cada vez que respiras, se recomienda hacer commits cuando realizamos un cambió que consideremos importante, pero no me gusta decirte que debes hacer con tu proyecto ni como usar git por lo tanto puedes hacer commits cuando quieras, es solo una recomendación general.

Primeros pasos con GitHub: Realizar cambios a nuestro proyecto en GitHub Desktop

Ahora nos toca añadir cambios en nuestro proyecto ya clonado, en otras palabras vamos a realizar nuestro primer commit en GitHub Desktop. En mi caso voy a agregarle un simple texto al README.md que tenemos.

  1. Modificar el README y guardarlo:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-8
  2. Una vez guardado, vamos a GitHub Desktop y vemos que nos indica en 'Changes' que hay cambios sin guardar, significa que no hemos realizado un commit con esos cambios y no solo eso, con un color azul (puede variar) nos indica específicamente donde se realizó el cambio en el archivo que editamos o puede editar un miembro de nuestro equipo:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-9
  3. Crear nuestro primer commit desde GitHub Desktop, es muy sencillo abajo de todo hay un cuadro donde podemos agregar un titulo y una descripción lo hacemos y depues damos en 'Commit to Master':
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-10
  4. Volvemos a 'History' y ahora vemos que tenemos 2 commits realizados:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-11

Primeros pasos con GitHub: Subir nuestros cambios a GitHub desde GitHub Desktop

Ya pudimos realizar nuestro primer commit ahora vamos a ver como subir esos cambios realizados en GitHub Desktop de manera local a nuestro proyecto en la nube, sería como sincronizar nuestro espacio de trabajo con nuestra versión del proyecto que esta en GitHub. Además, vamos a ver como estar pendiende de los cambios que se realizan en un proyecto desde la interfaz web de GitHub y como poder asignarle comentarios al cambio realizado.

En este caso voy a ir a la carpeta donde almacene el repositorio clonado desde GitHub, para añadir un archivo nuevo llamado "nuevo.txt", con esto repetiré el paso anterior donde vimos como realizar nuestro primer commit pero en esta ocasión vamos a sincronizar ese commit con nuestro proyecto en la nube, para que se vean iguales. Muy bien empecemos...

  1. Creamos el archivo y realizamos el commit, como vimos anteriormente en este curso de git y github:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-12
  2. Ahora vamos a realizar un 'Push origin', con esto podemos subir nuestro cambió, al proyecto alojado en la nube:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-13
  3. Cuando terminé de subir los cambios a GitHub, vamos a nuestro proyecto: github.com/gpost1/gburu.net-git-github, vemos que tenemos 3 commits y nuestro proyecto ahora tiene 2 archivos:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-14
  4. Al ingresar a github.com/gpost1/gburu.net-git-github/commits, vemos información detallada de los commits que se fuerón realizando en este proyecto:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-14
  5. Si ingresamos al último commit realizado nos da toda la información del mismo, podemos ver que tiene una cadena larga de número y letras aleatorios esto es el algoritmo SHA-1. Además, vemos el Parent ID que como vimos anteriormente hace referencia al ID del commit anterior, por lo tanto vemos la relación padre-hijo:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-15
  6. Algo muy útil que tiene GitHub son los comentarios a los commits, podemos hacerlos de 2 formas, a 1 sola línea del archivo o al commit en general:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-16

Terminamos esta parte del módulo donde vemos como utilizar GitHub Desktop trabajando con GitHub, ahora veremos como hacer todos estos pasos pero desde la terminal utilizando Git con GitHub. Para eso vamos a crear un proyecto nuevo en donde voy a subir mi CMS que es Ghost, mas adelante voy a publicar un curso sobre Ghost, esto nos servirá para ver como se puede trabajar en un proyecto un poco mas serio desde la terminal usando Git, para ver la instalación de Git tenemos que ir al módulo anterior.

Primeros pasos con Git: Configuración

Antes de comenzar a utilizar Git es importante configurar nuestro entorno para que sea mas profesional y podamos trabajar en equipo.

  • Versión: podemos ver nuestra versión de Git con el comando: git --version:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-16
  • Nombre de usuario: tenemos que indicarle a Git nuestro nombre de usuario para que podamos firmar los commits y demás cambios, lo vamos a hacer de forma global para que lo configuremos una sola vez. git config --global user.name "tu_nombre":
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-17
  • Correo electrónico: también tenemos que configurar nuestro correo electrónico: git config --global user.email "[email protected]":
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-18
  • Para comprobar que la configuración que agregamos funciono, hay que fijarnos mediante git config --list, otro comando que a futuro nos sera de ayuda es git help
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-19

Primeros pasos con Git: Fundamentos de Git

Gran parte de lo que sucede en Git es local

La mayoría de las operaciones en Git sólo necesitan archivos y recursos locales para operar. Por lo general no se necesita información de ningún otro ordenador de tu red. Como tienes toda la historia del proyecto ahí mismo, en tu disco local, la mayoría de las operaciones parecen prácticamente inmediatas.

Los 3 estados de Git

Esto es vital para entender lo que sucede en Git cuando realizamos las operaciones comunes, ahora presta atención. Esto es lo más importante a recordar acerca de Git, Git tiene tres estados principales en los que se pueden encontrar tus archivos:

  • confirmado (committed): significa que los datos están almacenados de manera segura en tu base de datos local
  • modificado (modified): significa que has modificado el archivo pero todavía no lo has confirmado a tu base de datos
  • preparado (staged): significa que has marcado un archivo modificado en su versión actual para que vaya en tu próxima confirmación.

3 secciones principales

Esto nos lleva a las tres secciones principales de un proyecto de Git:

  • Directorio de Git (Git directory): es donde Git almacena los metadatos y la base de datos de objetos para tu proyecto. Es la parte más importante de Git, y es lo que se copia cuando clonas un repositorio desde otro ordenador.
  • Directorio de trabajo (working directory): es una copia de una versión del proyecto. Estos archivos se sacan de la base de datos comprimida en el directorio de Git, y se colocan en disco para que los puedas usar o modificar.
  • Area de preparación (staging area): es un sencillo archivo, generalmente contenido en tu directorio de Git, que almacena información acerca de lo que va a ir en tu próxima confirmación. A veces se le denomina índice, pero se está convirtiendo en estándar el referirse a ella como el área de preparación.

curso-git-y-github-modulo-2-nuestro-primer-proyecto-20

El flujo de trabajo básico en Git es algo así:

  1. Modificas una serie de archivos en tu directorio de trabajo.
  2. Preparas los archivos, añadiendolos a tu área de preparación.
  3. Confirmas los cambios, lo que toma los archivos tal y como están en el área de preparación, y almacena esas instantáneas de manera permanente en tu directorio de Git.

Git sabe absolutamente todo lo que sucede en nuestro directorio de trabajo, que archivo se añade o modifica. Pero el no hará nada hasta que le digamos que haga algo.

Primeros pasos con Git: Clonar un repositorio remoto

Para comenzar esta práctica con Git vamos a clonar un repositorio que yo mismo prepare, se trata de un nuevo proyecto en el cual se almacena Ghost y en el trabajaremos.

  1. Ir a una carpeta que vamos a utilizar para nuestro proyecto y vamos a clonar el repositorio remoto git clone https://github.com/gpost1/git-github-2.git:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-21
    Git ya preparo una carpeta donde esta guardado en nuestro entorno local el repositorio remoto.

¿Como obtener la dirección de un repositorio remoto?

Hay 2 formas de obtenerla:

  • La primera es mediante la URL simplemente al final le agregamos un ".git", y la segunda es ir 'Clone or Download' y copiamos la URL en 'Clone with HTTPS':
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-22

Como vemos clonar un repositorio remoto con git es muy sencillo simplemente ejecutar git clone <dirección_remota.git> y comenzará descargar el repositorio.

Primeros pasos con Git: Realizar un commit con Git

Lo primero que tenemos que hacer al trabajar con un proyecto que tiene a Git para controlar sus versiones es el iniciador de Git, git init, en este caso no pasará nada ya que es un proyecto traido de GitHub y es lógico que ya contenga a Git dentro de el:
curso-git-y-github-modulo-2-nuestro-primer-proyecto-23

  1. Tenes que saber en que directorio estamos, mediante git status:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-24
  • En este caso estamos limpios y listos para trabajar sobre los archivos.
  1. Vamos a modificar algo del proyecto, el archivos sera 'config.development.json' en el vamos a cambiar el puerto por 9898 y luego guarden el archivo:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-25
  • Un cambio muy simple, ustedes modifiquen lo que quieran...
  1. Ahora que ya modificamos el archivos, vamos a comprobar si Git se dio cuenta de eso con git status:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-26
  • Git ya sabe que modificamos el archivos, esto nos dice que estamos en el directorio de trabajo (working directory) y tenemos archivos para que sean pasados al área de preparación (staging area).
  1. Agregar archivos modificados al área de preparación con: git add <nombre_archivo> de forma individual o git add -A de forma completa (todos los archivos en rojo):
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-27
  • Archivo listo para que se realice un commit, y el verde nos indica que ya esta en el área de preparación.
  1. Realizar un commit en Git es muy sencillo git commit -m "nombre descriptivo del commit" y nada mas:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-28
  • Luego de realizar nuestro commit comprobamos con git status y el commit fue exitoso.

Primeros pasos con Git: Subir nuestros cambios a GitHub con Git

Ya realizamos nuestro cambió y también realizamos nuestro commit para ahora solo basta con subir ese cambio al repositorio remoto que esta alojado en este caso en GitHub puede ser cualquier otro cliente.

  1. Tenemos que agregar un repositorio remoto a nuestro proyecto, donde enviemos nuestro cambios que realizemos de manera local para eso ejecutar: git remote add origin https://github.com/gpost1/git-github-2.git, prestar mucha atención a que repositorio nos conectaremos:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-29
  • Para saber que repositorio remoto esta enlazado con el proyecto local en el cual nos encontramos trabajando, solo basta con ejecutar git remote -v y veremos que origin tenemos y si queremos eliminarno ejecutar: git remote rm origin y listo.
  1. Y ejecutamos la subida del repositorio local indicandole a GitHub que somos el 'master' es decir el mismo usuario que publicó el proyecto en GitHub, nos pedira que iniciemos sesión para comprobarlo, git push -u origin master:
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-30
    curso-git-y-github-modulo-2-nuestro-primer-proyecto-31
  • Si vemos nuestro repositorio en GitHub, el commit se realizo con exito y la subida también, por lo tanto ya podemos trabajar con Git de manera local y subir los cambios al repositorio remoto.

Terminamos este módulo, ahora puedes clonar repositorios remotos, editar y realizar commits y finalmente subir los cambios a la nube con GitHub Desktop o Git desde la terminal. Nos vemos en el próximo módulo de este curso de Git y GitHub gratuito, puedes compartir este módulo en las redes sociales o dejar tu comentario!!

Tenemos más cursos para vos en: gburu.net/cursos

¡Dejá tu Comentario!