Página Web del HackLab Unipopular

En esta sección se presentan los recursos discutidos en el grupo de trabajo de la página web del HackLab Unipopular.

Página web estática vs CMS

CMS

Pros	Contras	Tecnologías
Mayor usabilidad por usuarixs sin conocimientos tecnicos / Más habitual fuera de entornos técnicos (el esfuerzo de aprender a usarlo tiene mas probabilidades de ser util mas alla del hacklab)	Mayor complejidad, curva de aprendizaje media.	Wordpress (GPLv2 or later)
Mayor escalabilidad	Requiere de mantenimiento	Ghost
Mayor flexibilidad, infinidad de plugins gratuitos en el caso de WordPress	Menor seguridad
Documentación, recursos audiovisuales en varios idiomas… en resumen gran accesibilidad.

Página Web Estática

Pros	Contras	Tecnologías
Facilidad de despliegue gratuito (solamente hace falta servir archivos estáticos)	Usabilidad, se necesita saber usar Markdown y git y/o la interfaz gráfica de un sistema de control de versiones	Hugo
No require mantenimiento.	No es tan personalizable	Jekyll
Menor complejidad, menor curva de aprendizaje.	Menos utilizado que otras alternativas	Gitlab pages
Mayor seguridad		Nikola
Podemos hostear en framagit (empresa sin ánimo de lucro, leer abajo)		Pelican
		Mkdocs

Alojamiento

CMS

Entidades/colectivos afines

Pros:

Tejer redes
Contras:

Entidades pequeñas: mayor volatibilidad, menos redundancia, soporte, etc.

Páginas web estáticas

Framagit

Pros:

Es un GitLab autoalojado por una comunidad sin ánimo de lucro (Framasoft). Al ser una asociación sin ánimo de lucro, no tienen ninguna intención de monetizar los datos que puedan recopilar al visitar la web alojada en sus servidores. “Framasoft es una red popular y educativa que utiliza software libre creada en 2001 por Alexis Kauffmann. Desde diciembre de 2003, cuenta con el apoyo de una asociación con el mismo nombre con sede en Lyon, Francia. Se divide en tres grandes ramas de actividades basadas en un modelo colaborativo: promoción, difusión y desarrollo de software libre, y enriquecimiento de la cultura del software libre y de los servicios en línea.” https://es.wikipedia.org/wiki/Framasoft
Contras:

Tardan 2 o 3 de días en validar una cuenta nueva.

GitLab.com

Pros:

Es una plataforma Open Source https://gitlab.com/gitlab-org/gitlab y tiene un servicio de CI/CD potente y configurable (GitLab CI, se basa en imágenes de Docker)
Contras:

Está mantenido y el alojamiento lo ofrece una empresa.

GitHub

Pros:

Contribuyen al Open Source https://github.com/github y tienen un servicio de CI/CD configurable (GitHub Actions)
Contras:

Es una plataforma privativa, el servicio está mantenido y el alojamiento lo ofrece una empresa. “Microsoft compró GitHub por la cantidad de 7500 millones de dólares.“https://es.wikipedia.org/wiki/GitHub

Dominio

Subdominio entidades/colectivos afines

Pros:

Delegamos la responsabilidad de la gestión del domino.
Contras:

Perdida de autonomia y necesidad de colaboraciones adicionales.

No-ip/servicio de nombres para ips dinámicas

Pros:

Gratuito.
Contras:

Requiere una persona responsable de la cuenta con el proveedor.

Requiere renovación mensual de forma manual por el adminstrador de la cuenta (por lo menos en No-Ip).

Compra de dominio

Pros:

Autonomia absoluta sobre la gestión del dominio.

Podemos crear subdominios para las distintas organizaciones dentro de la ferro.

Se puede elegir el nombre más apropiado.
Contras:

Requiere de los datos personales de una entidad/persona

Coste asociado anual

Dependencia del proveedor del DNS (https://en.wikipedia.org/wiki/2021_Epik_data_breach)

ENS: https://ens.domains/

Pros:

Descentralizado.

Compatible con IPFS como alternativa de hosting.
Contras:

Altamente experimental.

Requiere capital (ether) para articularlo y ponerlo en funcionamiento.

Las criptos tienen mala fama.

Referencias

https://dev.to/ashenmaster/static-vs-dynamic-sites-61f

Hugo

En esta sección o capítulo se explican los primeros pasos para crear y desplegar una página web estática generada con Hugo en GitLab pages.

Generación de una página web con Hugo

¿Cómo crear una nueva página web con Hugo?

Pasos:

Instalar Hugo

Si estás en Debian o Ubuntu puedes correr:
```
sudo apt-get install hugo
```
Si usas Mac asumiendo que tienes Homebrew:
```
brew install hugo
```
Si estás con Windows y usas Chocolatey:
```
choco install hugo -confirm
```
Elegimos un tema. Por ejemplo, el tema de esta web es ReLearn. Además, al final de esta página se exponen algunos temas recomendados.
Creamos un nuevo proyecto con:
```
hugo new site <name-project>
```
Nos desplazamos a la carpeta e inicializamos el repositorio.
```
git init
```

Clonamos el tema elegido en la carpeta themes o añadimos el submódulo del repositorio. Por sencillez, se recomienda la opción de clonar el tema.

Mediante https:

git clone https://github.com/McShelby/hugo-theme-relearn.git themes/relearn

Mediante SSH:

git clone git@github.com:McShelby/hugo-theme-relearn.git themes/relearn

O añadimos el submódulo, e:

git submodule add https://github.com/McShelby/hugo-theme-relearn.git themes/relearn

Editamos el fichero de configuración config.toml y añadimos:
```
baseURL = "http://localhost:1313/"
theme = "relearn"
```
Servimos la página web con el siguiente comando y está disponible en la ruta http://localhost:1313/.
```
hugo server
```
Crear nuevo contenido en Hugo. Por ejemplo en el tema Learn, crearemos un nuevo capítulo con el siguiente comando:
```
hugo new --kind chapter hugo/_index.md
```
O si queremos crear una nueva entrada, escribimos:
```
hugo new hugo/quick_start.md
```
Publicamos el proyecto en GitLab.

Algunos temas de Hugo recomendados

Documentación técnica:
- ReLearn
- Docsy
Organización/Empresa:
- Fiction
- Hugo Scroll
E-commerce:
- Fur

Despliegue en Gitlab pages

¿Cómo desplegar el proyecto en GitLab pages?

Configuramos la integración y despliegue contínuo creando el archivo .gitlab-ci.yml con la plantilla de Hugo. Si realizamos esto desde GitLab, en el contenido de la plantilla de GitLab, será necesario modificar la rama master por main.

# This file is a template, and might need editing before it works on your project.
---
# All available Hugo versions are listed here:
# https://gitlab.com/pages/hugo/container_registry
image: registry.gitlab.com/pages/hugo:latest

variables:
  GIT_SUBMODULE_STRATEGY: recursive

test:
  script:
    - hugo
  except:
    - main

pages:
  script:
    - hugo
  artifacts:
    paths:
      - public
  only:
    - main

Modificar la URL base que tiene esta estructura baseURL = "https://<gitlab-user>.gitlab.io/<project-name>/".
Habilitar el acceso a todos los públicos a GitLab. Navegar en los ajustes del proyecto de GitLab y expandir Visibility, project features, permissions > Pages > Everyone.