¿Cómo crear un sitio web de cartera y alojarlo en páginas de GitHub?

En este artículo, aprenderá

• ¿Cómo construir su propio sitio web de cartera?
• ¿Cómo alojar su sitio web en GitHub Pages GRATIS ?

Puede exhibir esta cartera en su currículum. ¡¡Entonces empecemos!!

Descargar plantilla de sitio web de cartera

Buscaremos algunas plantillas de diseño de cartera increíbles y receptivas en línea que son gratuitas. El sitio HTML5up ( https://html5up.net/ ) tiene muchas buenas opciones para un portafolio personal con muchas transiciones profesionales y cosas de CSS/Bootstrap. 

Algunas buenas opciones para la plantilla se enumeran a continuación:

• https://html5up.net/story
• https://html5up.net/estado-solido
• https://html5up.net/minipuerto
• https://html5up.net/dimension

Descargue la plantilla como un ZIP haciendo clic en la opción Descargar en la esquina superior derecha.

¡Personalizar en consecuencia!

Ahora extraiga los archivos del ZIP y eche un vistazo de cerca. Puede ver carpetas como ‘ imágenes ‘, ‘ activos ‘ y archivos como ‘ index.html ‘, ‘ licencia.txt ‘ y ‘ readme.txt ‘.

• Elimine los archivos license.txt y readme.txt .
• Abra el archivo index.html en su editor de código, como VS Code o Sublime , así como en su navegador.
• Comience a hacer los cambios necesarios en el texto desde su editor de código y reflexione sobre los cambios actualizando su navegador.

También puede poner sus propias imágenes y fondo cambiando las imágenes en la carpeta de imágenes, pero recuerde poner el mismo ‘nombre de archivo’ que tiene.

Una vez que haya terminado y esté satisfecho, puede cambiar el CSS y el estilo. Bueno, eso es totalmente opcional si eres un completo novato.

Subir a un repositorio de GitHub

Finalmente, sus archivos ahora deben insertarse en un nuevo repositorio de GitHub y deben alojarse mediante Páginas de GitHub . Para enviar los archivos necesarios del sitio web de su cartera en GitHub, siga los pasos indicados:

• Inicie sesión en https://github.com/ y haga clic en la opción Nueva en el panel del lado izquierdo, justo al lado de los repositorios.

• Nombra el repositorio como ‘ tu-nombredeusuario.github.io ‘. (Por ejemplo, si su nombre de usuario es chandrikadeb7 , nombre el repositorio como chandrikadeb7.github.io ).
• Haga clic en Crear repositorio .

 

Puede cargar todos los archivos necesarios desde su computadora de dos maneras: 
 

1. Uso de la opción de arrastrar/carga del sitio web de GitHub en el navegador

• Haga clic en la opción Cargar archivos desde su repositorio recién creado.
• Seleccione la opción Elija sus archivos para cargarlos desde su computadora local.
• O simplemente arrastre y suelte las carpetas en esta pantalla.

 

2. Uso del control de versiones de Git

• Puede enviar los archivos a su repositorio mediante el sistema de control de versiones de Git .
• Consulte esta guía para instalar Git https://git-scm.com/book/en/v2/Getting-Started-Installing-Git
• Cambie el directorio de trabajo actual a su proyecto local.
• Inicialice el directorio local como un repositorio de Git.

$ git init

• Agregue los archivos en su nuevo repositorio local. Esto los prepara para la primera confirmación.

$git añadir. 
 

# Agrega los archivos en el repositorio local y los prepara para la confirmación. Para eliminar un archivo, use ‘git reset HEAD YOUR-FILE’. 
 

• Confirme los archivos que ha almacenado en su repositorio local.

$git commit -m “Primera confirmación” 
 

# Confirma los cambios rastreados y los prepara para enviarlos a un repositorio remoto. Para eliminar esta confirmación y modificar el archivo, use ‘git reset –soft HEAD~1’ y confirme y agregue el archivo nuevamente. 
 

• En la parte superior de la página de configuración rápida de su repositorio de GitHub, haga clic en el icono del portapapeles para copiar la URL del repositorio remoto.

• En Terminal, agregue la URL del repositorio remoto donde se enviará su repositorio local.

$ git remote add origin remote <repository URL>
# Sets the new remote
$ git remote -v
# Verifies the new remote URL

• Envía los cambios en tu repositorio local a GitHub.

$ git push -u origin master
# Pushes the changes in your local repository up to the remote repository you specified as the origin

Alojamiento usando páginas de GitHub

• Ahora vaya a la pestaña Configuración que se encuentra justo arriba y desplácese hacia abajo para buscar la opción Páginas de GitHub .
• Ahora seleccione master-branch en el menú desplegable Fuente y aparecerá una notificación que indica que está listo para publicar su sitio en uno o dos minutos.

• Haga clic en ese hipervínculo de notificación y listo. ¡Su cartera está alojada en las páginas de GitHub de forma gratuita!

El sitio web de su cartera personal se publica en https://<your-github-username>.github.io 

Puedes echar un vistazo al mío aquí: https://chandrikadeb7.github.io/