SCULPINPHP static site generator
Jesús Urrutia http://jesusurrutia.com
¿COMO CONSTRUIRÍAS UN SITIO ESTÁTICO?
¿CON HTML ESTÁTICO? ... ¡MALA IDEA!Beneficios Contras
Mayor SeguridadMayor VelocidadDesarrollo inicial sencillo
Mantención lentaLas requerimientos siempre estancambiando.Por lo anterior, los sitios también lo hacen.HTML no tiene una forma de abstraerestructuras repetitivas.... O incluir trozos de HTML
¿CON ALGÚN LENGUAJE DINÁMICO?(PHP, RUBY, NODE, ETC.) ... ¡ALGO MEJOR!
Beneficios Contras
Permite abstraer las estructuras repetitivas.Realizar cambios es mucho mas fácil.
El servidor debe volver a procesar el sitiocada vez que es servido aún cuando este nocambia.Más expuesto a sufrir de algunavulnerabilidad de seguridad
¿Y SI PUDIÉRAMOS OBTENER LO MEJOR DEAMBOS MUNDOS?
PERO ... ¿QUE ES UN STATIC SITE GENERATOR?Permiten desarrollar como si fuera un sitio dinámico.Permiten hacer deploy de el sitio como si fuera unoestático.El contenido se puede generar en formatos alternativos alHTML (Markdown, Texttile)
EXISTEN EN VARIOS LENGUAJES
Ruby, JavaScript, Python, Go, PHP, Etc.
¡Pero por que no usar PHP! ...
¿No?
SCULPIN
CARACTERÍSTICASDesarrollado en PHP utilizando el Kernel de SymfonyTemplates hechos en TwigContenido en HTML o MarkDownLibrerías del frontend con ComposerExtensible
BENEFICIOSDeploy fácil (Generar, Subir y ¡Listo!)Templates orientados a objetos (Extensibles, Parciales)
¡ESTA BIEN! ... ME CONVENCISTE¿COMO EMPIEZO?
INSTALAR SCULPIN
curl -O https://download.sculpin.io/sculpin.phar chmod +x sculpin.phar sudo mv sculpin.phar /usr/local/bin/sculpin
DESCARGAR KIT DE INICIO
cd ~ git clone https://github.com/sculpin/sculpin-blog-skeleton.git static-site-folder cd static-site-folder
INSTALAR DEPENDENCIAS
cd ~/static-site-folder sculpin install
EJECUTAR SCULPIN
sculpin generate --watch --server
¡Listos para comenzar a crear!
CREAR SITIO DE PRODUCCIÓN
sculpin generate --env=prod
DISEÑADORES
Construir templates con Twig
TWIG FOR DESIGNERS
http://twig.sensiolabs.org/doc/templates.html
HERENCIA A TRES NIVELES
EJEMPLOS
<body> <header> <h1>Título de la sitio</h1> </header>
<div id="main">{% block main %}{% endblock %}</div>
<footer> <p>© Algunos derechos reservados.</p> </footer> </body>
Definiendo una zona extensible (base, layout, etc.)
EJEMPLOS
{% extends 'layout.html.twig' %}
{% block main %} <h1>Titulo contenido</h1> <p>¿Muy difícil? ... tranquilo ya lo comprenderás.</p> {% block main %}
Extendiendo el template del ejemplo anterior. (contenidos)
EJEMPLOS
{% include '_partial.html.twig' %}
Incluyendo un partial (Trozo de código reutilizable).
REDACTORES
Escribir contenido en Markdown
CARACTERÍSTICASEnfocado en el contenidoFácil de aprender
EJEMPLOS
Título del contenido ====================
Un párrafo común y corriente ...
- item1 - item2 - item3
MAS EJEMPLOS
*Texto en itálica* **Texto en Negrita** ***Texto en negritas e itálica***
> Citas
[Enlace](http://linets.cl)
PARA SABER MAS ...Documentación oficial( )Markdown Extra (
)
https://daringfireball.net/projects/markdown/https://michelf.ca/projects/php-
markdown/extra/
¡GRACIAS!