Ilusionismo con GitHub Pages

Cristina Fernández

Desarrolladora front-end

awwwards.com

Ejemplos páginas web en www.awwwards.com

Presentación Cinematógrafo (1895)

Mi GitHub (2016)

Git, GitHub y GitHub Pages

  • Subir cambios a GitHub (gif de cohete en Viaje a la Luna, de Georges Méliès)
  • GitHub (gif de la luna en Viaje a la Luna cuando impacta el cohete)
  • Resultado en GitHub (ya en la luna, en Viaje a la Luna, de Georges Méliès)

    • pages.github.com

    Página de GitHub Pages

    User site y Project sites 

    https://user.github.io
    una sola página (git con un único Georges Méliès) 
    https://user.github.io/repository
    una página por repositorio (gif con muchos Georges Méliès)

    User site y Project sites

    Nombre del repositorio es username.github.io para User site 
    git clone git@github.com/user/repository.git
    cd repository
    git add .
    git commit -m "Mensaje"
    git push origin master

    Project sites

    Ejemplo de repositorios de mi GitHub

    Habilitar GitHub Pages

    Ir a pestaña Settings
    Habilitar GitHub Pages en master o en /docs en la pestaña Settings

    Dominio personalizado

    Ir a pestaña Settings Habilitar Dominio personalizado en Settings
    Crea fichero CNAME en la raíz

    Ejemplo de uso: Presentación

    Repositorio en GitHub
    Resultado en el navegador

    Ejemplo de uso: Blog

    Repositorio en GitHub
    Resultado en el navegador

    Hugo

    Hugo, película homenaje a Méliès

    ¡Gracias!

    @cristinafsanz

    cristinafsanz

    Créditos