Presentación del grupo local de Zaragoza sobre generación de sitios web estáticos con Sculpin.

1. Symfony Zgz
Generación de sitios estáticos con Sculpin
@symfony_zgz

2. Web dinámica
● Servidores
● Bases de datos
● Instalaciones
● Tiempo
● …
● $$$$$$$!!!!!!!!!!!!

3. Perfiles
Además…
¿Cuántos perfiles hacen falta?

4. Sysadmins

5. Backends

6. Frontends

7. Diseñadores

8. SEO/SEM/Marketing

9. Otros roles
Sinergia!!!
Valorañadido Forlayos derivables

10. Kill them all!!! (o casi)
● Sysadmin → Github pages
● Backend developers → Sculpin
● Frontend developers → Bootstrap
● Diseñadores → Themeforest
● SEO → Nibbler/Woorank
● Otros roles → Sentido común!!!

11. Github pages
● Por usuario/organización
○ Creando repositorio {{usuario}}.github.io
○ http://ericduran.github.io
● Por proyecto
○ Creando rama gh-pages
○ http://ericduran.github.io/drupalcores/

12. Github pages
● Permite dominio propio
○ Apuntando a 204.232.175.78
● Github lo verifica
○ Archivo “CNAME” en la raíz
del repositorio

13. Sculpin
● Generador de sitios estáticos
● https://sculpin.io/
● Utiliza:
○ YAML
○ Twig
○ Markdown
○ Archivos estáticos!!
○ Consola

14. YAML
Archivos de configuración
sculpin_content_types:
posts:
type: path
path: _posts
permalink: blog/:year/:month/:day/:filename/
taxonomies:
- tags
- categories

15. YAML
Metadatos en el propio archivo del post
---
title: Happy Birthday Sculpin!
tags:
- sculpin
- markdown
categories:
- personal
---

16. Twig
{% set year = '0' %}
<h2>Posts Archive</h2>
{% for post in page.pagination.items %}
{% set this_year %}{{ post.date | date("Y") }}{% endset %}
{% if year != this_year %}
{% set month = '0' %}
{% set year = this_year %}
{% endif %}
{% set this_month %}{{ post.date | date("F") }}{% endset %}
{% if month != this_month %}
{% set month = this_month %}
...

17. Markdown
Heading
=======
Sub-heading
-----------------
Paragraphs are separated
by a blank line.
Text attributes *italic*,
**bold**, `monospace`.
A [link](http://example.com).
<<< No space between ] and ( >>>
Shopping list:
* apples
* oranges
* pears
Numbered list:
1. apples
2. oranges
3. pears
The rain---not the reign---in Spain.
Reemplazo ASCII de código HTML

18. Archivos estáticos
● Todo archivo en la carpeta correspondiente es el
equivalente a una entrada en base de datos (entidad).
● Generators: Páginas “plantilla” para mostrar estas
entidades o listados de ellas.
○ { use: [posts_categories] }
■ { % for category,posts in data.posts_categories %}
○ { generator: pagination} ... { use: [posts] }
■ {% for post in page.pagination.items %}

19. Archivos estáticos
● Mejor rendimiento no se puede!!
● Sistema de layouts jerárquico gracias a Twig
---
layout: default
---
● Árbol de directorios sencillo
○ app/config → YAML’s de configuraciones
○ source → Código fuente
○ source/_posts → Entidades “dinámicas” (en el ejemplo: posts)
○ output_prod → Salida HTML para subir

20. Archivos estáticos
● Gran control del HTML generado
● SEO guy loves you!

21. Dear frontend...
...dedica tu tiempo a cosas más divertidas!!!

22. ¿Todo bien hasta aquí?

23. Consola!!!!

24. Consola

25. Composer
● Sculpin incluye embebido composer
○ Archivo sculpin.json para gestión de dependencias
● No son necesarios muchos comandos

26. Comandos
● Instalar/actualizar dependencias
○ sculpin install
● Montar servidor de desarrollo
○ sculpin generate --watch --server
● Deploy
○ sculpin generate --env=prod

27. Facilísimo!!!

28. Pero...

29. Externaliza!
● Comentarios
○ https://developers.facebook.
com/docs/plugins/comments
● Formularios
○ http://webform.com
○ https://www.surveymonkey.com/
● Estadísticas
○ http://analytics.google.com

30. Backend guy is unhappy

31. También backend!!
● Sculpin utiliza el HTTP Kernel de Symfony.
● Sistema de eventos.
● Se pueden utilizar bundles de Symfony para
extender Sculpin con funcionalidades más
avanzadas!!!

32. Eventos
● SculpinCoreSculpin::EVENT_BEFORE_RUN
● SculpinCoreSculpin::EVENT_BEFORE_CONVERT
● SculpinCoreSculpin::EVENT_AFTER_CONVERT
● SculpinCoreSculpin::EVENT_BEFORE_FORMAT
● SculpinCoreSculpin::EVENT_AFTER_FORMAT
● SculpinCoreSculpin::EVENT_AFTER_RUN

33. Bundles de terceros
● Composer + Kernel… como en Symfony!!!
<?php
class SculpinKernel extends SculpinBundleSculpinBundleHttpKernelAbstractKernel
{
protected function getAdditionalSculpinBundles()
{
return array(
'MavimoSculpinBundleRedirectBundleSculpinRedirectBundle'
);
}
}

34. Que empiece la fiesta!!!