CONTRIBUTE.md 3.7 KB

Como contribuir al sitio.

El sitio esta construido bajo la concepcion de que prácticamente cualquier framework iba a introducir más complejidad de lo que le iba a aportar al desarrollo del mismo.

Nuestro framework es sitegen.py, su función principal es construir el sitio usando jinja2 como motor de plantillas.

Además sitegen.py, cuando se corre en modo watch actualiza en tiempo real los cambios que se hacen en el sitio.

Estructura

  • build/

Cuando se construye el sitio, todos los ficheros y carpetas están aquí.

  • languages/

Un diccionario que contiene todas las traducciones del sitio.

  • layout/

Contiene todos los html que conforman el sitio y el esqueleto de lo que se va a generar. Ver mas en #layout.

  • plugins/

Funciones que extienden nuestro framework. (No es muy relevante)

  • root/

Archivos que se van a copiar en la raíz del sitio estático para ser servidos. Cuando se genera el sitio estático, todos los ficheros en esta dirección se copian verbatim para carpeta build/

  • static/

Similar a root (no recuerdo porque tenemos diferenciado root de static). Todo lo que esta en este directorio se copia verbatim para la carpeta build/

  • .gitignore

  • deploy.sh

Function para

  • run_server.sh

Construir el sitio en modo watch, para hacer ver los cambios en tiempo real.

  • sitegen.py

El framework hecho en python

Requerimientos

  • python3 (Disponible en el PATH)
  • jinja2 (Dependencia de python)

Layout

La carpeta layout contiene todas las paginas del sitio. Para los ficheros que comienzan por underscore (_) no se generan páginas en el sitio. (Por ejemplo para _base.html y _work_no_all.html).

Las plantillas se generan usando jinja2, un motor de plantillas por defecto en python. Es el motor de plantillas usado en django.

Aprender jinja en 5 minutos

  • Extend: Usando extend, se "hereda" de otro fichero, lo que significa que se copia el contenido del otro fichero en este. Por ejemplo:

{% extends "_base.html"%}

  • Block: Crea un bloque que se puede sobre escribir cuando una plantilla depende de otra.

Por ejemplo, en el fichero _base.html esta el siguiente fragmento:

    ...
	<main class="main-layout">
		{% block main %}
		{% endblock %}
	</main>
    ...

Eso quiere decir que cualquier plantilla que extienda a _base.html (que son todas) pueden determina el contenido que se genera dentro del tag <main>

Por ejemplo: ver en about-and-contact.html como todo el contenido se encuentra dentro del bloque:

		{% block main %}
            ...
		{% endblock %}

Nota: Hay mas funcionalidades de jinja que se usan, pero no creo que sean muy relevantes por ahora.

Todos los cambios que se deban aplicar al sitio entero (como el banner o cosas así) se deben hacer directamente en el fichero _base.html. Cuando son cambios particulares de alguna vista (como el tamaño de los carteles, o cantidad de columnas) se debe modificar la vista en particular.

Ver por ejemplo illustration.html. Nota como se añade un elemento de <style> y luego se llama a {{ super() }}. Esto último es para indicarle a jinja que ademas de incluir el <style> incluya todo el contenido del bloque del layout del que se hereda (en el que caso particular de illustration.html se hereda de _work_no_all.html).

CSS

Todos los css están en la carpeta static/css y se incluyen en todas las vistas.

Para desarrollar

Correr ./run_server.sh en una terminal. El sitio se construye, y se actualiza automaticamente. Para acceder al mismo, ir a http://localhost:8001.

Desgraciadamente esta funcionalidad no funciona out-of-the-box en Windows aún.