Sube tus sitio web a GitLab Pages GRATIS

¿Conoces GitLab? GitLab es una plataforma y herramienta para subir tus códigos, compartirlos y colaborar con otros en un mismo proyecto, ideal para colaboración. Imagina, tener un sitio web, no saber dónde subirlo y tener GitLab, ¿Respuesta? Puedes subir tu sitio web a GitLab Pages y con hosting y SSL totalmente gratis. Seguirás los siguientes pasos:

Lo primero que debes tener en cuenta es un dominio. Si ya tienes un dominio registrado ya estás listo, si no puedes dar clic aquí y registrar el tuyo muy barato.

Lo siguiente es tener una cuenta en GitLab, lo mismo, si ya tienes la cuenta ya estás el doble de listo, si no regístrate ya para continuar.

Por último, para tener el SSL en tu sitio y configurado correctamente, deberás de registrarte en CloudFlare para ello, desde ahí tomarás control de tu dominio en DNS, seguridad, tráfico, entre otras cosas.

Teniendo las tres partes listas (dominio, cuenta de GitLab y cuenta en CloudFlare), necesitarás modificar los DNS de tu dominio dentro de CloudFlare. Si quieres que tu sitio esté en la raíz del dominio, algo como tudominio.com, o en un subdominio, algo como mipagina.tudominio.com,necesitarías, en ambas, poner un registro, es:

  • Como tudominio.com: en un registro A poner la IP 35.185.44.232
  • Como tupagina.tudominio.com: en un registro CNAME poner la URL [nombre-usuario-gitlab].gitlab.io

Nota: Cambiar [nombre-usuario-gitlab] por tu nombre de usuario real cuando te registraste en GitLab.

Ya teniendo bien configurado esa parte podrás ir a instalar el certificado SSL dentro de CloudFlare. Nos dirigimos a la pestaña «Crypto» y le das en «Create Certificate»:

Seleccionas el dominio el cual se instalará ingresándolo en la listade hostnames. le dan en Next, te saldrá:

Dentro de GitLab y de tu proyecto, configurarás dicho proyecto. Añadirás un archivo que se llamará .gitlab-ci.yml y pondrás dentro del archivo lo siguiente:

pages:
stage: deploy
script:
mkdir .public
cp -r * .public
mv .public public
artifacts:
paths:
- public
only:
- master

Con lo anterior, pondrás todos los archivos de tu página web en una carpeta llamada «public» en la raíz con el archivo previamente creado, como se muestra:

Ahora te dirigirás a añadir el dominio o subdominio a tu proyecto previamente creado (si no tienes el proyecto, pues créalo). Te irás a: Settings > Pages > + New Domain.

Añades el nombre del dominio o subdominio en la siguiente pantalla y añades el certificado PEM que te arrojó CloudFlare al crear el SSL:

Antes de darle «Create New Domain», pondrás, dentro del campo «Certificate (PEM)», el certificado válido CloudFlare’s Origin CA — RSA Root:

-----BEGIN CERTIFICATE-----
MIID/DCCAuagAwIBAgIID+rOSdTGfGcwCwYJKoZIhvcNAQELMIGLMQswCQYDVQQG
EwJVUzEZMBcGA1UEChMQQ2xvdWRGbGFyZSwgSW5jLjE0MDIGA1UECxMrQ2xvdWRG
bGFyZSBPcmlnaW4gU1NMIENlcnRpZmljYXRlIEF1dGhvcml0eTEWMBQGA1UEBxMN
U2FuIEZyYW5jaXNjbzETMBEGA1UECBMKQ2FsaWZvcm5pYTAeFw0xNDExMTMyMDM4
NTBaFw0xOTExMTQwMTQzNTBaMIGLMQswCQYDVQQGEwJVUzEZMBcGA1UEChMQQ2xv
dWRGbGFyZSwgSW5jLjE0MDIGA1UECxMrQ2xvdWRGbGFyZSBPcmlnaW4gU1NMIENl
cnRpZmljYXRlIEF1dGhvcml0eTEWMBQGA1UEBxMNU2FuIEZyYW5jaXNjbzETMBEG
A1UECBMKQ2FsaWZvcm5pYTCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoCggEB
AMBIlWf1KEKR5hbB75OYrAcUXobpD/AxvSYRXr91mbRu+lqE7YbyyRUShQh15lem
ef+umeEtPZoLFLhcLyczJxOhI+siLGDQm/a/UDkWvAXYa5DZ+pHU5ct5nZ8pGzqJ
p8G1Hy5RMVYDXZT9F6EaHjMG0OOffH6Ih25TtgfyyrjXycwDH0u6GXt+G/rywcqz
/9W4Aki3XNQMUHNQAtBLEEIYHMkyTYJxuL2tXO6ID5cCsoWw8meHufTeZW2DyUpl
yP3AHt4149RQSyWZMJ6AyntL9d8Xhfpxd9rJkh9Kge2iV9rQTFuE1rRT5s7OSJcK
xUsklgHcGHYMcNfNMilNHb8CAwEAAaNmMGQwDgYDVR0PAQH/BAQDAgAGMBIGA1Ud
EwEB/wQIMAYBAf8CAQIwHQYDVR0OBBYEFCToU1ddfDRAh6nrlNu64RZ4/CmkMB8G
A1UdIwQYMBaAFCToU1ddfDRAh6nrlNu64RZ4/CmkMAsGCSqGSIb3DQEBCwOCAQEA
cQDBVAoRrhhsGegsSFsv1w8v27zzHKaJNv6ffLGIRvXK8VKKK0gKXh2zQtN9SnaD
gYNe7Pr4C3I8ooYKRJJWLsmEHdGdnYYmj0OJfGrfQf6MLIc/11bQhLepZTxdhFYh
QGgDl6gRmb8aDwk7Q92BPvek5nMzaWlP82ixavvYI+okoSY8pwdcVKobx6rWzMWz
ZEC9M6H3F0dDYE23XcCFIdgNSAmmGyXPBstOe0aAJXwJTxOEPn36VWr0PKIQJy5Y
4o1wpMpqCOIwWc8J9REV/REzN6Z1LXImdUgXIXOwrz56gKUJzPejtBQyIGj0mveX
Fu6q54beR89jDc+oABmOgg==
-----END CERTIFICATE-----

Como la siguiente imagen:

Finalmente, le das en «Create New Domain». Si todo salió bien, en la página de GitLab de los dominios te debería de aparecer el dominio que añadiste nuevo.

Volvemos a CloudFlare y, dentro de la pestaña «Crypto», te dirigirás a la opción de «SSL» y activarás la opción de «FULL»:

Ya con todas las partes realizadas correctamente podrás ver tu sitio o proyecto en la web gracias a GitLab.

Nota: tienes que tener por lo menos un archivo HTML en el proyecto para que se muestre correctamente.

¿Tienes dudas? Puedes escribirlos en los comentarios o seguirnos en las redes sociales @elrinconsoft @abraham_moca y enviarnos tus preguntas por ahí.

Fuente: Setting up GitLab Pages with CloudFlare Certificates