Introducción a Git
¿Por qué usar un sistema de control de versiones como Git?
¿Qué es Git?
Instalando Git y GitBash en Windows
Instalando Git en OSX
Instalando Git en Linux
Editores de código, archivos binarios y de texto plano
Introducción a la terminal y línea de comandos
Comandos básicos en Git
Crea un repositorio de Git y haz tu primer commit
Analizar cambios en los archivos de tu proyecto con Git
¿Qué es el staging y los repositorios? Ciclo básico de trabajo en Git
¿Qué es branch (rama) y cómo funciona un Merge en Git?
Volver en el tiempo en nuestro repositorio utilizando reset y checkout
Git reset vs. Git rm
Flujo de trabajo básico en Git
Flujo de trabajo básico con un repositorio remoto
Introducción a las ramas o branches de Git
Fusión de ramas con Git merge
Resolución de conflictos al hacer un merge
Trabajando con repositorios remotos en GitHub
Cambios en GitHub: de master a main
Uso de GitHub
Cómo funcionan las llaves públicas y privadas
Configura tus llaves SSH en local
Conexión a GitHub con SSH
Tags y versiones en Git y GitHub
Manejo de ramas en GitHub
Configurar múltiples colaboradores en un repositorio de GitHub
Flujos de trabajo profesionales
Flujo de trabajo profesional: Haciendo merge de ramas de desarrollo a master
Flujo de trabajo profesional con Pull requests
Utilizando Pull Requests en GitHub
Creando un Fork, contribuyendo a un repositorio
Haciendo deployment a un servidor
Hazme un pull request
Ignorar archivos en el repositorio con .gitignore
Readme.md es una excelente práctica
Tu sitio web público con GitHub Pages
Multiples entornos de trabajo en Git
Git Rebase: reorganizando el trabajo realizado
Git Stash: Guardar cambios en memoria y recuperarlos después
Git Clean: limpiar tu proyecto de archivos no deseados
Git cherry-pick: traer commits viejos al head de un branch
Comandos de Git para casos de emergencia
Git Reset y Reflog: úsese en caso de emergencia
Reconstruir commits en Git con amend
Buscar en archivos y commits de Git con Grep y log
Bonus sobre Git y Github
Comandos y recursos colaborativos en Git y GitHub
Tu futuro con Git y GitHub
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
No todos los archivos que agregas a un proyecto deberían ir a un repositorio. Por ejemplo, cuando tienes un archivo donde están tus contraseñas que comúnmente tienen la extensión .env
o cuando te estás conectando a una base de datos; son archivos que nadie debe ver.
Por diversas razones, no todos los archivos que agregas a un proyecto deberían guardarse en un repositorio. Esto es porque hay archivos que no todo el mundo debería de ver, y hay archivos que al estar en el repositorio ralentizan el proceso de desarrollo (por ejemplo: los binary large objects, blob, que tardan en descargarse).
Para que no se suban estos archivos no deseados se puede crear un archivo con el nombre .gitignore en la raíz del repositorio con las reglas para los archivos que no se deberían subir: Aquí puedes ver la sintaxis de los .gitignore.
Las razones principales para tomar la decisión de no agregar un archivo a un repositorio son:
Aporte creado por: David Behar.
Aportes 453
Preguntas 95
Paso a paso para utilizar imgur
<p><a href="https://imgur.com/P0uCD21"><img src="https://i.imgur.com/P0uCD2l.jpg" width="100%" title="descripcion de la imagen" /></a></p>
Por diversas razones, no todos los archivos que agregas a un proyecto deberían guardarse en un repositorio, ésto porque hay archivos que no todo el mundo debería de ver, y hay archivos que al estar en el repositorio alentan el proceso de desarrollo (por ejemplo los binary large objects, blob, que se tardan en descargarse).
.
Para que no se suban estos archivos no deseados se puede crear un archivo con el nombre .gitignore
en la raíz del repositorio con las reglas para los archivos que no se deberían subir (ver [sintaxis de los .gitignore(https://git-scm.com/docs/gitignore)).
.
Las razones principales para tomar la decisión de no agregar un archivo a un repositorio son:
.
.env
)node_modules
que genera npm al correr el comando npm install
Apuntes!
Reto
<html>
<head>
<title>Hyperblog 2.0, es un blog del futuro</title>
<link rel="stylesheet" href="css/estilos.css" />
</head>
<body>
<div id="container">
<div id="cabecera">
<img id="logo" src="imagenes/dragon.png" />
Hyperblog
<span id="tagline">Tu blog de cabecera</span>
</div>
<div id="post">
<h1>Aquí empieza la historia de una gran proyecto</h1>
<p>Y este es el párrafo de inicio donde vamos a explicar las cosas increíbles que se pueden hacer con ramas</p>
<p><img src="https://staticz.womenalia.com/images/avatar/blogs/post/7047/mi-primer-proyecto-web_1502728801.png" width="100%"</p>
<p>Los blogs son la mejor forma de compartir información y tus ideas. Mucho mas que ir a conferencias o salir en Youtube. Excepto si eres un rockstar. Pero estadísticamente no lo eres.... por ahora.</p>
<p>Suscribete y dale like</p>
</div>
<div id="footer">
Hecho con amor en Platzi <3
</div>
</div>
</body>
</html>
hola! les comparto la foto del equipo que usa Freddy para el ejemplo de esta clase.
Genial, utilice google Drive como repositorio de imagen de esta manera , cuando de di para compartir me dejo un link como este :
https://drive.google.com/file/d/1TzRsYiyHNo-bSxrzf2ZCLJC1jaK1Qe05/view?usp=sharing
bien investigue y llegue a que esta parte del link es un id 1TzRsYiyHNo-bSxrzf2ZCLJC1jaK1Qe05 y que si esta compartido en publico le puedes pedir de otra manera al drive la imagen agregándole el prefijo https://drive.google.com/uc?id=AQUI VA TU ID quedaría así
https://drive.google.com/uc?id=1TzRsYiyHNo-bSxrzf2ZCLJC1jaK1Qe05
y de esta forma si pues utilizarlo en el scr de tu pagina web 😃
si van a trabajar con "node, laravel, djando, …etc…"
en este sitio podes encontrar un .gitignore muy completo
https://www.gitignore.io/
Imgur es una herramienta muy facil de usar para subir las imagenes, solo hay que arrastrar la imagen a la pantalla y ya está. Imgur le da una URL a la foto se copia la URL y se pega en el archivo html de la siguiente forma:
<img src="https://imgur.com/N7svTE9.jpg" width="100%">
Nota: Observar que en el archivo .html al link se le debe agregar la extensión del archivo.
Que bien yo eh usado los S3 AWS de amazon para guardar imágenes, y desde ahí solo colocar la dirección que me genera el mismo sitio y solo lo pego en mi HTML
Yo hice un “touch .gitignore” para probar mis conocimientos en linea de comandos
 se pueden subir y agregar fácilmente a la página que Freddy mencionó. Por eso les voy a mostrar mi implementación en HTML y para que además ustedes no se tengan que loguear en imgur.com.
Nota: la segunda imagen fue elegida por un complicado algoritmo cerebral desarrollado por miles de años de evolución. No juzgar. Hablando en serio puedes cambiar las dos fotos a gusto personal agregando el link de la img en el: src=“aquí!” 😃
HTML
<img id="logo" src="https://i.imgur.com/Tl8ApMq.png" />
<p><img src="https://i.imgur.com/vR4Lekf.png" width="600" height="600"></p>
El .gitignore es el siguiente
#images
/imagenes/*
gitignore es la forma es la q excluimos cosas que no se van a subir a repositorio de nuestro github, y como buena practica no deben subirse las imagenes a los proyectos, sino referenciarla despues de tenerla en un banco o imagenes por ejemplo
Reto cumplido
Por alguna razón no me funcionaba así:
<img src="https://i.imgur.com/4C42apr.png" title="source: imgur.com" width="80"/>
Entonces decidí dejarlo así:
<p><a href="https://imgur.com/4C42apr.png"><img src="https://i.imgur.com/pfew3PY.jpg" title="source: imgur.com" width="100%"/></a></p>
Reto cumplido:
HTML
<img src="https://i.imgur.com/Dxp1wt0l.jpg" id="imgGato"/>
CSS
#imgGato{
margin-left: auto;
margin-right: auto;
display: block;
}
Es una excelente forma de no subir contenido que no se necesita tener en el repositorio. Hay una página gitignore.io que si pones el nombre del lenguaje de programación, librería, IDE de programación, framework de desarrollo, te da el gitignore que deberías de usar en tu proyecto.
En php hay una carpeta llamada vendor que no debería de ser subida al repositorio ya que estas librerías se pueden instalar con composer.
Despues de intentar e intentar con IMGUR .com, fuí a IMGBB pero seguía el problema de que no renderizaba la imagen… pues, no la mostraba, la única forma fué hacerlo con google drive.
Buscar Tecnoapuntes Insertar img desde google drive a pag web.
Yo referencié la imagen así:
Adjunto el código:
HTML
<p><img id="imgPerro" src="https://i.imgur.com/VK5Ai1B.jpg" alt="foto de un perro" width="100%" /></p>
CSS
#imgPerro {
height: 380px;
width: 330px;
display: block;
margin: 0 auto;
}
Otra alternativa para crear y editar archivos es:
El comando touch namefile, sirve para crear archivos desde git.
Ej. touch .gitignore
Luego con el editor de texto (ej. vim) podemos hacer la lista de archivos a ignorar.
si eres como yo, que no te quedas con lo de la clase entonces te habrá pasado que quisiste ignorar un archivo al que ya le habias hecho commit, pues le diste en el gitignore algo así : /archivo.txt y luego fuiste a github y seguias viendo el archivo, entonces es como WTF, pero si lo estoy ignorando.
La respuesta es que git ya lo tiene trackeado, entonces tienes que desvincularlo con el comando
git rm --cached archivo
después de darle esto, le das al commit , vas a github y boola, ya no t aparece el archivo.
solo queria compartirlo porque en este video de 7 minutos m demoré casi 3 horas encontrando esa respuesta xDDDDDDDDDDDDDD
Porque hay archivos que pueden dar información confidencial de los proyectos (conexiones a DB, API ) o simplemente son archivos que no son relevantes para el proyecto (archivos intermedios de una compilación) o son archivos binarios como imágenes.
Para ignorar archivos se debe:
- Crear archivo llamado
.gitignore
(la lista de archivos a ignorar)- Listar archivos y carpetas a ignorar
- En cada línea estableceremos el fichero, directorio o patrón a ignorar
- Las líneas vacías o en blanco no se consideran
- Las líneas que comienzan con
#
se consideran comentarios, es decir, no se ejecutan- Las líneas que comienzan con
!
permiten realizar excepciones (niega el patrón)- Si la línea termina en
/
, sólo se aplicará sobre directorios- Utilizaremos
*
**** como carácter comodín- Pueden realizarse patrones a través de expresiones regulares
- Agregar el archivo
.gitignore
al repositorio
Estar haciendo un proyecto y de la nada volver a alguna clase para repasar cosas! 😃
entra en la pagina
sube la imagen (no es necesario estar registrado)
copia la direccion url que se le asigna a la imagen
en tu archivo html dentro la etiqueta para un nuevo parrafo escribre la etiqueta para crear una nueva ancla <a></a>
dentro de los signo de la primera a escribe el vinculo href=tu_url
dentro de la etiqueta para el ancla escribe la etiqueta de la imagen espesificando la direccion, la cual sera igual a la direccion del hipervinculo pero con una i al principio y terminando con .jpg
cierras la etiqueta de ancla y cierras la etiqueta del parrafo
Excluir archivos de ser ignorados:
ignorar/*
!ignorar/no-ignorar.jpg
!ignorar/noignorar
Pero importante, el asterisco en ignorar/* es imprecindible ya que si se hace de esta forma:
ignorar/
!ignorar/no-ignorar.jpg
Se ignora la carpeta completa sin analizar los archivos que tiene dentro, pero con el asterisco se analiza el contenido de la carpeta, dando chance a excluir archivos o carpetas
Si alguno tiene el problema de que les sale el cuadro blanco cuando ponen la url en el html del blogpost.
Pueden usar la url de la foto exacta para ello:
Van a la url de imgur
le dan click secundario
Abrir enlace en una pestaña nueva. Capturan esa nueva url y la usan.
Ignorar archivos en el repositorio con .gitignore
Crear un archivo llamado .gitignore es la raíz del proyecto
Dentro de .gitignore se ponen los nombres de archivo o directorios que no se deben agregar a git
*.jpg # Igonorar todos los archivos con extención .jpg
/content/themes # Ignorar la carpeta themes que esta dentro de content
/content/themes/casper # No ignorar la carpeta casper dentro de content/themes
Agregar una imagen dentro de un elemento p no es buena practica. Es mejor agregar la imagen dentrode un elemento figure. En el Curso Definitvo de HTML y CSS el maestro Diego de Granda lo explica mejor.
No se si a otros les pasaba pero Visual Studio me creaba siempre una carpeta .vs en mi proyecto y era muy molesto que siempre le tenia que hacer commit!
En git ignore puse
/.vs
Y listo!
Listo ya subí my foto a esta pagina.
Esta es la imagen que subí:
https://imgur.com/XupvmvG
Para hacer referencia puedo hacerlo de la siguiente manera.
En HTML
<img src="https://imgur.com/XupvmvG">
En CSS
background: url("https://imgur.com/XupvmvG");
<p><a href=“https://imgur.com/a/wAIxoDR”><img src=“https://i.imgur.com/VldHYZI.jpg” width=“100%” alt=“Equio de Platzi”/></a></p>
Pueden subir su imagen a google drive:
Para los que no les aparece la imagen sino apenas el icono de una imagen predeterminada, asegurense de tomar el link cuando de: click derecho a la imagen en imgur -> abrir imagen en una nueva pagina. Ese es el link que deben tomar, no en el que estan en imgur como tal.
<code>
<p><img id="frontSecretsMovies" src=https://i.imgur.com/FmlLfPY.jpg width="100%"/></p>
ignoren los .DS_Store y .idea
Se pueden usar expresiones regulares en los .gitignore?
Listo 😃
encontré este recurso que he utilizado para generar plantillas del .gitignore por si alguien lo necesita, es interesante y bastante práctico
Para los que quieran tener la imagen de equipo.jpg acá está:
https://twitter.com/platzi/status/1094258626418655232
¿Qué hacemos con archivos que están trackeados?
Si recordamos en la clase de “Git rm vs Git reset” nos enseñan como untrackear archivos 💀
git rm --cached "nombre archivo"
Con esto git ya lo dejará de rastrear 😎
Este es mi blog, jajaj lo hice mientras hablaba con mi novio:
Super saber lo del gitignore.
Gracias por la explicacion
Esta url puede ser muy util para lo que inician
https://www.toptal.com/developers/gitignore
Esa página básicamente genera todo el .gitignore por ti
#Otros tips para ignorar archivos:
//ignorar todos los archivos que terminen en .log
*.log
//excepto production.log
!production.log
//ignorar los archivos terminados en .txt dentro de la carpeta doc (pero no sus subdirectorios)
doc/*.txt
//ignorar todos los archivos terminados en .pdf dentro de la carpeta doc y sus subdirectorios
doc/**/*.pdf
Tomado de:
https://guias.makeitreal.camp/git/gitignore#:~:text=En git es posible ignorar,gitignore .
.gitignore es una buena practica para evitar subir tanto archivos binarios como archivos que no deberian estar en un repositorio y más si es de carácter público u open source.
Esto es una prueba, no hagan caso, nunca supe cómo subir una imagen en un comentario de platzi
<p><a href="https://i.imgur.com/87nAeKYpng"><img src="https://i.imgur.com/87nAeKY.png" width="100%" title="descripcion de la imagen" /></a></p>
Reemplazar el imgur por su url.
Recuerden que deben dejarle el i.
adelante y la extensión del archivo al final (.png)
para que se pueda visualizar! Ya que de lo contrario estamos subiendo la pagina html de imgur
Por si a alguien le sirve, les dejo un sitio que genera el .gitignore en automático, solo pones en la caja de texto qué tipo de framework usas para tu proyecto (p.ej. “Angular”) y le das a “create”, el sitio en automático te dará una plantilla con el texto que debes de poner en tu .gitignore para no subir archivos y/o directorios que no deban de ir ahí.
Tiene muchos frameworks y es un excelente punto de partida para tener un proyecto sano.
yo recomiendo 100% Pinterest, pruébenlo en serio les va ir mejor
Reto cumplido !!! 😁👌👍
una buena practica antes de hacer un PUSH pues que se haga un PULL.
Creen que es una buena practica??
.gitignore
Es un archivo en la base del proyecto que nos indica que archivos no se deben de guardar en el git.
El archivo .gitignore nos sirve para no discriminar archivos con extensiones que que no queremos que aparezcan en nuestro repositorio o que por buenas practicas no deben incorporarse. Ej. de extensiones .bin, .cer, .key, .jpg, .png
Dentro el archivo .gitignore tambien podemos indicar excepciones a estas discriminaciones colobando un / al inicio de la línea.
*.key
*.png
#Excepciones
/imagenes/*.png
Esta pagina genera los .gitignore “estandar” para cada tipo de proyecto y asi limpiar el repo de archivos cache , o demas cosas inecesarias
https://www.toptal.com/developers/gitignore
espero les sea util
🤦🏽♂️ Ok, creo que fue muy mala idea entrar a imgur. Pasé mucho rato así:
Mi resultado de usar una imagen de imgur.
(Por favor ignoren tanta cosa escrita en mi página, pero es el resultado de hacer tantas pruebas en varios lados para aprender jajaja!)
cundo agregue el .gitignore al momento de escribir los archivos ignorados puse un espacio antes de * y no me funcionaba por si a alguien también le ocurre la solución es quitarle el espacio
Adicional a https://imgur.com pueden usar pinterest pinterest.com cargan mucho mas rapido las imagenes.
No sabía que era un buena practica ignorar los archivos binarios en un repositorio. Qué content delivery managers utilizan? El que dijo Freddy en clase es imgur.com. correcto?
Muy bueno! Realmente suma muchísimo saber acerca de las buenas prácticas en la industria.
Por que ignorar archivos: No todos los archivos que agregas a un proyecto deberían ir a un repositorio, por ejemplo cuando tienes un archivo donde están tus contraseñas que comúnmente tienen la extensión .env o cuando te estás conectando a una base de datos; son archivos que nadie debe ver.
.gitignore: Es una lista donde se ignoraran los archivos que querramos, por ejemplo para ignorar archivos binarios de tipo de imagen colocamos:
IMPORTANTE Esta es una forma de proteger datos que no queremos compartir como tal dentro del proyecto, ademas por una buena gestion de tiempo de carga y optimizacion del proyecto los binarios no deberian ir en el proyecto.
wow, imgur.com es un sitio viejísimo. Recuerdo que tenían de logo una ranita y en un tiempo dijeron que iban a borrar todo el contenido así que asumí que ya no existía. Yo lo usé mucho tiempo atrás. Ahora que volví a entrar veo que es un sitio totalmente nuevo.
había oído de imgur pero nunca lo había usado, en lo personal me parece genial para hacer content delivery
<img src="https://i.imgur.com/2MPefLJ.jpg" width="500">
Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.