Memoria resiliente y distribuida

Agenda

Al final de este capítulo deberíamos estar en condiciones de:

  • Crear un repositorio de Fossil en la carpeta raíz del tema (~/Documentos/IndieWeb/blog/).
  • Agregar la entrada de ejemplo (.md .html) y hacer un commit.
  • Lanzar la interfaz web local (fossil ui) y leer la línea de tiempo, los diffs y las vistas archivos.
  • Personalizar el repositorio.
  • Sincronizar repositorios locales y remotos (ejp con ChisselApp).

En el ejercicio anterior, instalamos un blog y creamos una entrada en el mismo. En esta sección veremos cómo podemos almacenar ese micrositio del blog en un repositorio de manera que podamos publicarlo en línea y tener copias de seguridad de la información.

Un repositorio nos sirve para almacenar, publicar y distribuir información. Para ello los repositorios nos permiten guardar archivos y la historia de sus cambios. Debido a ello, también nos permiten trabajar colaborativamente. Los repositorios que usamos en Brea los provee Fossil1

El siguiente ejercicio práctico nos ayudará a enteder el uso de los repositorios. Veremos cómo se realiza paso a paso en las siguientes secciones.

Crear el repositorio local y abrirlo

  1. Nos ubicamos en la carpeta donde instalamos el blog y creamos el repositorio:

    cd ~/Documentos/IndieWeb/blog/
    fossil init indieweb.fossil
  2. Veremos algo como esto:

    project-id: 97f1b535aa8f0c670b999062f6b795e1eef98899
    server-id:  7405329c63175e2385f17b0beb700f21b75dc265
    admin-user: offray (initial password is "tpsPh9Me5f")
  3. Para abrirlo hacemos lo siguiente:

    cd ~/Documentos/IndieWeb/blog/
    fossil open indieweb.fossil

    (Si aparece un mensaje referido a la opción --force, la agregamos al comando con fossil open indieweb.fossil --force)

Agregar contenidos

  1. En principio agregaremos la entrega al blog que hemos creado, en sus dos formatos: fuente en Markdown y exportado en HTML.

    fossil add entrada/entrada-ejemplo.*
  2. La salida será algo como esto:

    ADDED  entrada/entrada-ejemplo.html
    ADDED  entrada/entrada-ejemplo.md
  3. Y ahora enviamos las entradas al repositorio, con una operación que será muy habitual en nuestro flujo de trabajo, llamada commit.

    fossil commit -m "Primera entrada al blog."

    (Lo que está entre comillas puede ser cualquier comentario descriptivo y corto).

    Podríamos ver algo como:

    ./entrada/entrada-ejemplo.html contains CR/LF line endings. Use --no-warnings or the "crlf-glob" setting to disable this warning.
    Commit anyhow (a=all/c=convert/y/N)?

    Tecleamos a o y y aparece algo como esto:

    New_Version: 79d3c4e3a4d2fdec810e559055d5c32cb29114e5ce66833fa74b26b084f62ea1
  4. Lo que aparece allí, una vez hemos realizado el commit es un checksum que es como una huella digital única que identifica el estado del repositorio en ese momento.

En la siguiente sección veremos cómo luce el repositorio y sus transformaciones.

Línea de tiempo y vistas de la información

  1. Fossil integra una interfaz web que nos permite examinar el estado del repositorio. Para lanzarla, desde la consola de comandos, en la carpeta donde abrimos el repositorios, ejecutamos lo siguiente:

    fossil ui

    Veremos algo como esto:

    que corresponde a la línea de tiempo y que nos permite ver las transformaciones en el repositorio en la medida en que agregamos, borramos y modificamos archivos.

  2. Para ver la primera transformacion hacemos click en dos de los “circulitos” de dicha línea de tiempo. Veremos algo de este estilo:

En verde aparecen las líneas agregadas a los archivos y en rojo las borradas (en el primer commit sólo habrán líneas verdes, pues sólo estamos agregando cosas). Esta diferencia entre dos estados del repositorio se conoce como el diff.

  1. Hay otra vista importante, que es la vista de archivos. Para ella hacemos click en Files en la barra superior. Si hacemos click en ella y luego en “Tree view”, veremos algo como esto:

    Vista de archivos.

  2. E incluso podemos ver la información asociada a un archivo en particular, haciendo click en el mismo:

:::danger

Agregar la vista previa de documentación. Falta como pasar de la línea de tiempo a la vista de documentación y https://localhost:8080/doc/ckout/entrada/entrada-ejemplo.html

:::

  1. En esta vista está sólo el archivo HTML, sin las fuentes, los estilos (CSS) y los scripts que hacen que la misma se vea como la tenemos en nuestro sistema de archivos local. Agregaremos dichos archivos.

    • Los CSS

      fossil add assets/css/*
      ADDED  assets/css/fontawesome-all.min.css
      ADDED  assets/css/main.css
    • El javascript:

      fossil add assets/js/*
      ADDED  assets/js/breakpoints.min.js
      ADDED  assets/js/browser.min.js
      ADDED  assets/js/jquery.min.js
      ADDED  assets/js/main.js
      ADDED  assets/js/util.js
    • Las fuentes:

      fossil add assets/webfonts/*
      ADDED   assets/webfonts/fa-brands-400.eot
      ADDED   assets/webfonts/fa-brands-400.svg
      ADDED   assets/webfonts/fa-brands-400.ttf
      ADDED   assets/webfonts/fa-brands-400.woff
      ADDED   assets/webfonts/fa-brands-400.woff2
      ADDED   assets/webfonts/fa-regular-400.eot
      ADDED   assets/webfonts/fa-regular-400.svg
      ADDED   assets/webfonts/fa-regular-400.ttf
      ADDED   assets/webfonts/fa-regular-400.woff
      ADDED   assets/webfonts/fa-regular-400.woff2
      ADDED   assets/webfonts/fa-solid-900.eot
      ADDED   assets/webfonts/fa-solid-900.svg
      ADDED   assets/webfonts/fa-solid-900.ttf
      ADDED   assets/webfonts/fa-solid-900.woff
      ADDED   assets/webfonts/fa-solid-900.woff2

    Hacemos el commit de los nuevos archivos:

    fossil commit -m "Fuentes, estilos y scripts."

Al cargar la página http://localhost:8080/doc/tip/entrada/entrada-ejemplo.html veremos algo como:

Personalización

Una vez hemos ingresado al repositorio, cambiamos ciertas parte. Para ello hacemos click en la solapa “Admin” desde la interfaz web.

Entramos a configuration y colocamos

  • El nombre del proyecto

  • La descripción.

  • Y donde dice “Index Page” escribimos la página del repositoiro que queremos que se vea por omisión al visitarlo. En nuestro caso es:

    /doc/trunk/web/index.html

Y finalmente damos “Apply Changes”

Por omisión ahora Fossil habilita un Política de Seguridad de Contenidos (o CSP, por sus siglas en inglés) bastante rígida que no permite embeber contenidos alojados en sitios de terceros, pues ahora se usan habitualmente esta forma de embeber para hacer perfilados de navegación (Facebook es famoso por esto, pero seguramente Google y otros lo hagan). Para poder habilitar el contenido de terceros tendremos que cambiar esa política de manera que se puedan traer dichos contenidos. Eso es lo que haremos a continuación:

Dentro del repositorio desde la interfaz administrativa vams a Admin>Settings.

Se desplegarán una serie de opciones y veremos la que correponde al CSP:

Y donde dice default-csp escribimos asterisco (*), es decir que habilitaremos todas las opciones de contenido externo y al final hacemos Apply Changes.

Al habilitar cualquier contenido externo, los proveedores de dicho contenido pueden usar los embebidos para perfilar hábitos de navegación en nuestro sitio.

Entramos al enlace “Users” y allí seleccionamos nuestro usuario (por ejmplo offray, leo, julith) y la cambiamos la contraseña por algo significativo y difícil o gestionado por un gestor de contraseñas.

Cliqueamos “Apply Changes”

Cerramos el repositorio desde la consola de comandos y en la carpeta donde lo temos abierto tecleando fossil close.

Al final del procedimiento tendremos un archivo indieweb.fossil que contiene los elementos del blog personalizados y la configuración que acabamos de hacer. Este archivo lo sincronizaremos con un repo remoto en ChisselApp en siguiente sección.

Sincronizar con el repositorio remoto

En la sección anterior vimos cómo configurar un repositorio de Fossil para guardar el contenido de nuestro sitio IndieWeb. Sin embargo, el repostorio está sólo en nuestro computador. Esta sección mostrará cómo publicar y sincronizar nuestro computador con la Internet.

Esencialmente son dos pasos:

  1. Subir el repo local a un repositorio remoto.
  2. Sincronizar el repositorio remoto y el local.

Los veremos en detalle, a continuación.

  1. Subir el repo local a un repositorio remoto

    1. Nos registramos en ChisselApp

    2. Entramos a la parte donde dice “Upload Repository”.

    3. Diligenciamos el nombre del repositorio.

    4. Colocamos la contraseña del repo que configuramos locamente.

    5. Seleccionamos el archivo indieweb.fossil.

Por ejemplo este repositorio que corresponde a los ejercicios hechos en las Data Rodas:

  1. Ahora vamos a sincronizar los repositorios remotos y los locales.

    1. Abrimos el repo local.

      cd ~/Documentos/IndieWeb/blog
      fossil open indieweb.fossil
    2. Sincronizamos los repositorios:

      cd ~/Documentos/IndieWeb/blog
      fossil sync https://{username}@chiselapp.com/user/{chiselab-user}/repository/{repository-name}

      Nos pedirá de nuevo el usuario y la contraseña que ya configuramos en los pasos previos

  • Repositorios:
    • Vamos a crear un repositorio de Fossil en la carpeta raíz del tema (~/Documentos/IndieWeb/blog/).
    • Agregar la entrada de ejemplo (.md .html) y hacer un commit.
    • Lanzar la interfaz web local (fossil ui).
    • Ver cómo luce la entrada en la dirección: https://localhost:8080/doc/ckout/entrada/entrada-ejemplo.html

  1. Fossil es una alternativa a Git, GitHub o Gitea, más sencilla.↩︎


||