Este documento presenta las herramientas Roots para el desarrollo de sitios web con WordPress de forma escalable y segura. Roots incluye Trellis para la infraestructura de servidores idénticos, Bedrock como marco de la aplicación para gestionar dependencias, y Sage como tema base. Juntos permiten crear, desplegar y mantener sitios WordPress de manera automatizada con buenas prácticas de seguridad y organización de código.

1. WC
BA
17
José María Debuchy
Introducción a herramientas
de Roots
@josedebuchy

2. 2
WordPress Introducción
๏ Abarca el ~59.2% de los CMS alrededor del mundo. ~28.3% de los
sitios web online.
๏ Tiene barreras de entrada muy bajas.
๏ Está basado en una amplia comunidad, en permanente evolución.

3. 3
¿Por qué elegir Roots? Introducción
๏ Proceso de trabajo predecible y escalable en equipo.
๏ Herramientas avanzadas de desarrollo.
๏ Mejora continua en comunidad.

4. 4
Productos de Roots Introducción
Trellis: Infraestructura
Bedrock: Aplicación
Sage: Starter Theme
Nota: Pueden utilizarse en forma separada, pero su ventaja radica en
su uso combinado.

5. 5
Requerimientos Introducción
๏ No utilizar servidores compartidos. Instalación Ubuntu 16.04
Xenial TLS.
๏ Ciertas adaptaciones para Windows.
๏ Algunos conocimientos de línea de comandos.

6. 6
Resumen
1. Servidores Idénticos
2. Creación de servidores complejos
3. FTP vs VCS
4. Plugins, Themes y core de WP como dependencias
5. Nueva organización de carpetas
6. Seguridad y mayor organización de constantes
7. Wrapper único. DRY.
8. Utilización de SCSS y compiladores para Assets
9. Sincronización de BBDD mediante plugin
10. Notificaciones, Emails a través de una aplicación de terceros.*
Propuestas de mejora

7. 7
1. Servidores idénticos Trellis
๏ Development, Staging y Producción
๏ Nos aseguramos de que lo que estamos viendo en nuestra
computadora mientras desarrollamos se verá en forma idéntica en
los otros entornos.

8. 8
2. Creación de servidores complejos Trellis
Servidor LEMP
Opciones: Digital Ocean, Amazon, Vultr
ansible-playbook server.yml -e env=<environment>

9. 9
3. FTP vs VCS + Deploy Automático Trellis
๏ Backup del código. Evolución del código. Posibilidad más sencilla
de compartir el trabajo en equipo.
๏ Con un solo comando en ansible se corren una serie de tareas y
testeos, si están ok se hace un clon del repositorio, se crea una
carpeta con ese codebase con una fecha y se genera una alias
como carpeta principal.
๏ Opciones de hosting de repositorios: Github, Bitbucket, Beanstalk.
./bin/deploy.sh <environment> <site name>

10. 10
4. Sistema de dependencias. Bedrock
๏ Todas las dependencias (Plugins, themes y WP) están listadas en
un único archivo, llamado composer.json.
๏ Se actualizan desde un único lugar.
๏ Solamente instalás los archivos propios de tu proyecto/theme en el
repositorio.
๏ WPackagist. Repositorio composer para WordPress.
composer update

11. 11
Bedrock5. Nueva estructura de carpetas.
composer create-project roots/bedrock your-project-folder-name

12. 12
6. Seguridad Bedrock
๏ La mayoría de las credenciales de acceso o datos importantes se
recopilan en archivos .env.
๏ Estos archivos se encuentran fuera la raíz.
๏ wp-password-bcrypt

13. 13
Sage7. Wrapper (DRY)
๏ DRY: Don’t Repeat Yourself.
๏ Se nombra en un archivo base
por única vez a las funciones
get_header(), get_footer() y
get_sidebar().

14. 14
8. SCSS y compiladores de assets Sage
๏ Workflow avanzado
๏ Sage 8: Gulp, Bower, NPM, BrowserSync, etc.
๏ Sage 9: Webpack, Blade, Yarn, BrowserSync, etc
๏ Opciones de Frameworks Bootstrap 4 / Foundation
gulp [watch | —production]
bower install
npm install
Sage 8
yarn run [start | build ]
yarn
composer install
Sage 9

15. 15
9. Sincronización de BBDD Extra
WP DB Migrate PRO
๏ Ventajas
๏ Ahorro grande de tiempo en migraciones.
๏ Automatización de trabajo. No más manejo de SQL.
๏ Desventajas
๏ Precio
*

16. 16
10. Notificaciones, Emails Extras
๏ Development
๏ MailHog
๏ Staging/Producción
๏ Instalación de servicios externos.
๏ Mailgun, Sendgrid o Amazon SES, entre otros.
*

17. 17
Resumen
1. Servidores Idénticos
2. Creación de servidores complejos
3. FTP vs VCS
4. Plugins, Themes y core de WP como dependencias
5. Nueva organización de carpetas
6. Seguridad y mayor organización de constantes
7. Wrapper único. DRY.
8. Utilización de SCSS y compiladores para Assets
9. Sincronización de BBDD mediante plugin
10. Notificaciones, Emails a través de una aplicación de terceros.*
Propuestas de mejora

18. 18
Combinaciones Sugeridas Resumen
๏ Trellis (Servidor)
๏ Bedrock (Aplicación)
๏ Sage (Theme)
๏ Digital Ocean (Infraestructura)
๏ Bitbucket (Repositorio)
๏ Soil (Limpieza) *
๏ ACF Pro (Campos personalizados) *
๏ WP Migrate DB Pro *
(Migración distintos entornos)
๏ Contact Form 7 o Gravity Forms
* (Formulario de contacto)
๏ WP Offload S3 Lite
(Multimedia)
๏ Font Awesome (Íconos)
๏ Mailgun (Envío de emails)

19. 19
Ejemplo / Soporte Resumen
Roots Example Project
๏ https://github.com/roots/roots-example-project.com
Foro Oficial
๏ https://discourse.roots.io

20. 20
Referencias Resumen
๏Roots (roots.io)
๏Git (git-scm.com)
๏The Twelve-Factor App (12factor.net/es/)
๏Virtualbox (www.virtualbox.org)
๏Ansible (www.ansible.com)
๏SequelPro (www.sequelpro.com)
๏Bitbucket (bitbucket.org)
๏Digital Ocean (www.digitalocean.com)
๏Sass (http://sass-lang.com/)

21. José Debuchy
jdebuchy@40q.com.ar
@josedebuchy
Preguntas