Drupal 8 WorkShop

88
Drupal 8 WorkShop Ruben Egiguren (keopx) 2015-09-11

Transcript of Drupal 8 WorkShop

Page 1: Drupal 8 WorkShop

Drupal 8 WorkShopRuben Egiguren (keopx)

2015-09-11

Page 2: Drupal 8 WorkShop

Acerca de keopxDrupal Developer, Software Libre enthusiast, new technologies and geek

Ruben Egiguren a.k.a. keopxProfesional: www.isarea.comBlog: www.keopx.netDrupal: www.drupal.org/u/keopx

Miembro de:• Drupal Association• Asociación Española de Drupal• G.D.O Basque Country• …

FreelanceDrupal Developer

Page 3: Drupal 8 WorkShop

Fuente original

Page 4: Drupal 8 WorkShop

Thanks Ruben Teijeiro

@rteijeiro

Page 5: Drupal 8 WorkShop

Ruben Teijeiro - Drupal Hero at Tieto

1st Computer: MSX SVI-7281st Language: Logo (at age 8)

From Spain, where I worked on relevant Drupal projects like Unicef and Telefonica.

Moved to Stockholm two years ago to work on Ericsson Intranet project built with Drupal.

Joined Tieto in November 2014.

Ruben Teijeiro - @rteijeiro

CEM SolutionsSenior Software Architect

Page 6: Drupal 8 WorkShop

http://www.tieto.com/

Thanks Tieto!

Page 7: Drupal 8 WorkShop

¿Qué es Drupal?

Page 8: Drupal 8 WorkShop

¿Qué es Drupal?

80% CMS*

* Content Management System

Page 9: Drupal 8 WorkShop

¿Qué es Drupal?

20% CMF*

80% CMS

* Content Management Framework

Page 10: Drupal 8 WorkShop

¿Qué es Drupal?

100% Software Libre

Page 11: Drupal 8 WorkShop

Drupal en números

Page 12: Drupal 8 WorkShop

Uso semanal del proyecto

https://www.drupal.org/project/usage/drupal

Page 13: Drupal 8 WorkShop

Uso de proyectos

Drupal 8 Beta Releaseen la

DrupalCon Amsterdam

https://www.drupal.org/project/usage/drupal

Page 14: Drupal 8 WorkShop

http://w3techs.com/technologies/history_overview/content_management/all/y

Tendencias de uso CMS

Page 15: Drupal 8 WorkShop

http://w3techs.com/technologies/history_overview/content_management/ms/y

Cuota de mercado CMS

Page 16: Drupal 8 WorkShop

Posición de mercado

http://w3techs.com/technologies/market/content_management

Menos sitios, pero el tráfico más alto

Page 17: Drupal 8 WorkShop

Lenguaje de programación de servidor

http://w3techs.com/technologies/history_overview/programming_language/ms/y

Page 18: Drupal 8 WorkShop

Comunidad

https://www.drupal.org/home

Page 19: Drupal 8 WorkShop

¿Quién usa Drupal?

Page 20: Drupal 8 WorkShop

Administración

Page 21: Drupal 8 WorkShop

Administración

Page 22: Drupal 8 WorkShop

Administración

Page 23: Drupal 8 WorkShop

Medios

Page 24: Drupal 8 WorkShop

Medios

Page 25: Drupal 8 WorkShop

Empresas

Page 26: Drupal 8 WorkShop

Empresas

Page 27: Drupal 8 WorkShop

Finanzas

Page 28: Drupal 8 WorkShop

Finanzas

Page 29: Drupal 8 WorkShop

Industria

Page 30: Drupal 8 WorkShop

Industria

Page 31: Drupal 8 WorkShop

Educación

Page 32: Drupal 8 WorkShop

Educación

Page 33: Drupal 8 WorkShop

Entretenimiento

Page 34: Drupal 8 WorkShop

Entretenimiento

Page 35: Drupal 8 WorkShop

¿Por qué Drupal esbueno para ti?

Page 36: Drupal 8 WorkShop

Tecnologías de vanguardia

Page 37: Drupal 8 WorkShop

Symfony 2

● Conjunto de componentes PHP desacoplados y reutilizables.

● Drupal 8 ha incluido los siguientes componentes en el núcleo:○ HttpFoundation○ HttpKernel○ Routing○ EventDispatcher○ DependencyInjection○ ClassLoader○ Serializer○ Validator○ Yaml http://symfony.com

Page 38: Drupal 8 WorkShop

Composer

https://getcomposer.org

● Herramienta para la gestión de la dependencia en PHP.

● Inspirado node npm y bundler de ruby.

● Permite declarar las librerías de su proyecto de forma dependiente e instalarlas.

● Drupal 8 se puede instalar con todas sus dependencias utilizando Composer:

http://drupal-composer.org

Page 39: Drupal 8 WorkShop

Guzzle

http://guzzlephp.org

● Cliente PHP HTTP que abstrae la capa de transporte HTTP.

● Soporta diferentes métodos HTTP como cURL, sockets, PHP stream wrapper…

● Gestiona las conexiones persistentes y simplifica las peticiones POST con los campos y archivos.

● Puede enviar peticiones síncronas y asíncronas utilizando la misma interfaz.

● Útil para la integración con las API RESTful.

Page 40: Drupal 8 WorkShop

PHPUnit

https://phpunit.de

● Framework de pruebas unitarias para PHP.

● El core de Drupal 8 dispone de pruebas unitarias para garantizar la consistencia de su código.

● Integración sencilla para IDEs como NetBeans, Eclipse e IntelliJ IDEA.

● Soporte para servidores de integracion continua (CI) como Jenkins, Hudson y Sonar.

Page 41: Drupal 8 WorkShop

Twig

http://twig.sensiolabs.org

● Motor de plantillas moderno para PHP, escrito por el creador del framework Symfony.

● Compilador de plantillas en texto plano, código PHP optimizado, por lo que es rápido y seguro.

● Utiliza una sintaxis simple, orientada a plantilla, familiar para los front-end developers.

● Dispone de un lexer flexible y un parseador que permiten la definición de etiquetas personalizadas, filtros y un DSL personalizado.

Page 42: Drupal 8 WorkShop

jQuery

https://jquery.com

● Libreria JavaScript rápida, ligera y rica en funciones para recorrer y manipular documentos HTML.

● API de uso sencilla para animaciones

● Manejo de eventos y AJAX para multitud de navegadores.

● Drupal 8 core incluye jQuery 2, jQuery UI y otras librerías para construir sobre la tecnología jQuery.

Page 43: Drupal 8 WorkShop

Backbone.js

http://backbonejs.org

● Provee de estructura a las aplicaciones web a través de modelos con asociación de eventos personalizados mediante estructuras clave-valor, colecciones con una API rica en funciones, vistas con manejo de eventos y conecta todo con tu API existente mediante un interfaz RESTful JSON.

● Varios componentes de Drupal 8, como la barra de herramientas de administración, se han desarrollado utilizando Backbone.js.

Page 44: Drupal 8 WorkShop

Underscore.js

http://underscorejs.org

● Librería JavaScript que provee de un montón de funciones de utilidades (manejo de colecciones, arrays, objetos y otras funciones y utilidades)

● Incluye más de 100 funciones como los helpers: map, filter, invoke — as como funciones de binding, plantillas javascript, creación rápida de índices, etc.

Page 45: Drupal 8 WorkShop

Modernizr

http://modernizr.com

● Librería JavaScript que detecta características HTML5 y CSS3 en el navegador del usuario.

● Hace que sea fácil escribir JavaScript y CSS, adaptándolo dependiendo de si el navegador soporta o no la característica.

Page 46: Drupal 8 WorkShop

CKEditor

http://ckeditor.com

● CKEditor es un editor de texto HTML visual, diseñado para simplificar la creación de contenidos web. Es un editor WYSIWYG que trae las características más comunes de un procesador de texto (negrita, subrayado, listas, etc).

● Drupal 8 contiene CKEditor como el editor WYSIWYG por defecto.

Page 47: Drupal 8 WorkShop

Rendimiento

Page 48: Drupal 8 WorkShop

Rendimiento

● Drupal 8 cuenta con un sistema de almacenamiento interno de caché que permite generar y almacenar las páginas con diferentes elementos para que puedan ser servidas más rápido en futuras peticiones.

● SmartCache optimiza cómo se almacenan los elementos en caché y cómo se invalida esa caché cuando un elemento se ha cambiado, por lo que Drupal 8 es dos veces más rápido.

● La estrategia del renderizado de Drupal 8 sigue el modelo de Facebook BigPipe, que permite la entrega de páginas de forma asíncrona, paralelizando el renderizado del navegador y el procesamiento del servidor.

● El Javascript no se carga por defecto para usuarios anónimos y los assets de CSS/JS pueden ser agregados y minimizados.

Page 49: Drupal 8 WorkShop

Escalabilidad

Page 50: Drupal 8 WorkShop

Escalabilidad

● Drupal 8 es el primer CMS que una base de datos NoSQL como MongoDB. También permite una fácil integración con otros sistemas de almacenamiento.

● Drupal permite gestionar muchos sitios de su organización utilizando el mismo core con un proceso fácil de creación de sitios e implementación.

● Drupal 8 se integra con la mayoría de las tecnologías de alta disponibilidad y escalabilidad comunes como proxies inversos, balanceadores de carga, la replicación de bases de datos, sistemas de archivos distribuidos ...

● También permite la integración con los sistemas empresariales de búsqueda como Elastic Search y Apache Solr.

Page 51: Drupal 8 WorkShop

Seguridad

Page 52: Drupal 8 WorkShop

● Drupal tiene su propio equipo de seguridad, responsable de detectar y corregir vulnerabilidades.

● Drupal 8 incluye varios componentes de terceros que se mantienen por las comunidades externas con sus propios equipos de seguridad.

● El nuevo código de Drupal 8 sigue el enfoque estándar de la industria y está cubierto por las pruebas unitarias, lo que es más fiable y seguro.

● Twig, el sistema de plantillas en Drupal 8, sanitiza los datos utilizados en las plantillas y no permite el uso de código PHP ni consultas a bases de datos, reduciendo las vulnerabilidades debido a la inyección de SQL o mala programación.

Seguridad

Page 53: Drupal 8 WorkShop

Mobile Friendly

Page 54: Drupal 8 WorkShop

Mobile Friendly

● Los temas predeterminados de Drupal 8 son totalmente responsive las áreas de usuario y de la administración.

● La nueva barra de herramientas de administración ha sido rediseñado para adaptarse perfectamente a cualquier tamaño de pantalla.

● Las imágenes subidas, incluyendo las imágenes subidas usando el editor WYSIWYG, se adaptan automáticamente a cualquier dispositivo.

● Todos los elementos de front-end como formularios y tablas siguen las mejores prácticas para el diseño responsive para ofrecer la mejor experiencia de usuario móvil.

Page 55: Drupal 8 WorkShop

Temas por defecto responsive ● Desktop● Tablet● Smartphone

Page 56: Drupal 8 WorkShop

Tema admin por defecto responsive ● Desktop● Tablet● Smartphone

Page 57: Drupal 8 WorkShop

Barra de administración responsive ● Desktop● Tablet● Smartphone

Page 58: Drupal 8 WorkShop

Creación fácil de contenidos

Page 59: Drupal 8 WorkShop

Creación fácil de contenidos

● Drupal 8 incluye como editor WYSIWYG por defecto CKEditor que es totalmente personalizable para satisfacer todas las necesidades.

● Para mejorar la experiencia de creación de contenido, incluye funciones de edición de contenido en contexto.

● La nueva interfaz de edición utiliza un diseño de dos columnas para separar el contenido del artículo de los ajustes de configuración.

● Los editores pueden crear fácilmente revisiones de contenido para mantener diferentes versiones de un mismo artículo que se puede restaurar cuando sea necesario.

Page 60: Drupal 8 WorkShop

Editor WYSIWYG personalizable

Page 61: Drupal 8 WorkShop

Edición de contenido en contexto

Page 62: Drupal 8 WorkShop

Interface de edición en dos columnas

Page 63: Drupal 8 WorkShop

Arquitectura flexible de contenidos

Page 64: Drupal 8 WorkShop

Arquitectura flexible de contenidos

● Drupal 8 permite la creación de tipos de contenido personalizados utilizando diferentes tipos de campo para almacenar texto, fechas, números, archivos, etc. Un campo puede mostrarse de muchas formas diferentes utilizando formateadores de campos personalizados.

● El contenido puede ser categorizado utilizando taxonomías, que apoyan a los campos y permite la jerarquización.

● Un nuevo sistema de bloques, que también apoyan los campos, permite presentar el contenido en diferentes regiones de la disposición.

● El módulo Views Drupal permite listados de contenido personalizado. Es una GUI completa para consultas a la base de datos que permite el filtrado personalizada, ordenación y relaciones.

Page 65: Drupal 8 WorkShop

Tipos de contenidos y campospersonalizados

● Content Type Edit● Content Create● Content View

Page 66: Drupal 8 WorkShop

Categorización de contenidos con taxonomía

Page 67: Drupal 8 WorkShop

Disposición de bloques en regiones

Page 68: Drupal 8 WorkShop

Localización de bloques

Page 69: Drupal 8 WorkShop

Views como una SQL GUI simple

● SELECT title, image, body● WHERE status=1 AND type=’Article’● ORDER BY authored DESC

Page 70: Drupal 8 WorkShop

Views es más que una simple SQL GUI

● Define a custom Path, Menu Item and Access Permissions● Customize Pager style and items Pagination● Contextual Filters, Relationships and Exposed Filters in a Form

Content Listings in Blocks

Page 71: Drupal 8 WorkShop

Listado de contenidos y bloques

Page 72: Drupal 8 WorkShop

Multilenguaje

Page 73: Drupal 8 WorkShop

Multilenguaje

● Drupal tiene una comunidad de traductores que crean y mantienen traducciones de los módulo a diferentes idiomas.

● Drupal 8 ofrece out-of-the-box las herramientas necesarias para traducir el contenido y la interfaz y diferentes métodos para la detección automática y selección del idioma.

● Contenido, menús, bloques y otros elementos se pueden traducir a cualquier idioma instalado.

● Las diferentes traducciones se pueden instalar fácilmente, modificar y exportar cuando sea necesario.

Page 74: Drupal 8 WorkShop

Traducciones en números

https://localize.drupal.org

Page 75: Drupal 8 WorkShop

Interfaz de traducciones

● Enable Modules● Add New Languages● Select Default Language

Page 76: Drupal 8 WorkShop

Detección de idiomas

Page 77: Drupal 8 WorkShop

Traducción de contenidos

Page 78: Drupal 8 WorkShop

Selección de idiomas ● Spanish● Finnish● Hindi

Page 79: Drupal 8 WorkShop

Soluciones ilimitadas para empresas

Page 80: Drupal 8 WorkShop

Soluciones ilimitadas para empresas

● Drupal 8 incluye la tecnología necesaria para proporcionar una API RESTful que permite el acceso al contenido, los usuarios y otros elementos en un formato estándar HAML/JSON. También es compatible con diferentes métodos de autenticación.

● El proceso de despliegue/desarrollo en Drupal 8 es más fácil gracias a la nueva gestión de la configuración que permite exportar todos los cambios de configuración en archivos que se pueden implementar con un CVS.

● Drupal 8 incluye una herramienta de migración que permite no sólo para migrar sitios de Drupal 6 y 7 sino también cualquier otra plataforma.

● Drupal 8 también un framework de pruebas unitarias y provee una batería de pruebas del Core.

Page 81: Drupal 8 WorkShop

Módulos adicionales

Page 82: Drupal 8 WorkShop

Módulos adicionales incluidos en el Core

● Actions: Realizar tareas en determinados eventos desencadenados dentro del sistema.

● Activity Tracker: Permite el seguimiento de los contenidos recientes para los usuarios.

● Aggregator: Agregadores de contenido sindicado (RSS, RDF y Atom) de fuentes externas.

● Ban: Permite la prohibición de direcciones IP.● Book: Permite a los usuarios crear y organizar el

contenido relacionado en un esquema.● Forum: Proporciona un foro de discusión.● Statistics: Registros de las estadísticas de contenido.● Syslog: Registro de logs y eventos del sistema para syslog.● Tour: Tour guiado.

Page 83: Drupal 8 WorkShop

Comunidad Open Source

Isarea también contribuye a

Drupal Core!!!

Page 84: Drupal 8 WorkShop

● Drupal cuenta con miles de voluntarios de todo el mundo.

● Gracias a sus contribuciones Drupal es cada vez más fácil de usar y está adoptando rápidamente nuevas tecnologías que hacen crecer el proyecto.

● La Comunidad también ayuda a las personas para empezar y contribuir.

Vista de comunidad

Page 85: Drupal 8 WorkShop

¿Preguntas?

Page 86: Drupal 8 WorkShop

Eskerrik asko

Page 87: Drupal 8 WorkShop

Licencia

Fuente original:http://www.slideshare.net/rteijeiro/drupal-46481935

Ruben Teijeirohttps://www.drupal.org/u/rteijeiro

@rteijeiro

Page 88: Drupal 8 WorkShop

Experts in Drupal solutions | Web: www.isarea.com | Telefono: +34.630.100.444 | Email: [email protected]

FreelanceDrupal Developer

Ruben Egiguren (keopx)