Uso de tecnologías modernas en Joomla!

http://www.slideshare.net/phproberto/uso-de-tecnologas-modernas-en-joomla

Sobre mi● Programador PHP / Javascript.

● Programando desde 2011.

● Adicto al Opensource.

● #26 contribuidor a Joomla!

@phproberto | https://www.phproberto.com

¿Por qué usar tecnologías modernas?● Evolución personal. Evolución de tus trabajadores. Evolución de tu negocio.

● Independencia de la plataforma.

● Vida media de una empresa es de 10 años. La mitad no llega a los 5 años.

● Reducir tiempo de desarrollo.

● Fiabilidad.

● Seguridad.

● Marketing.

Ten en cuenta● No todas las nuevas tecnologías son buenas.

● Conoce tu mercado. Pregunta a tus usuarios.

● Reserva tiempo para I+D.

● Analiza la evolución antes de usar una tecnología.

● Introduce cambios paulatinamente.

● Asigna prioridades para su implementación. Fases.

Prepara tu Joomla!

● Siempre versión 3.x.

● Buenas tecnologías requieren un buen hosting.

● Comprueba las dependencias de tus extensiones.

● Usa siempre un buen entorno de desarrollo local.

https://www.joomla.org

PHP

http://php.net/supported-versions.php

¿Qué versión de PHP elegir?

● Joomla requiere PHP 5.3.10. No traits no party :(

● Versión más común PHP 5.5 / 5.6

● Joomla! bajo PHP 7 es un 62% más rápido.

● Extensiones comerciales: PHP 5.5 / 5.6

● Desarrollos a medida: PHP 7.

http://php.net

Composer

● Gestor de dependencias para librerías PHP.

● Es un estándar de facto.

● Perfectamente integrable con Git.

● Librerías explorables a traves de Packagist ( https://packagist.org )

● Distribuye tus librerías para cualquier sistema.

https://getcomposer.org

Composer

¿Difícil de integrar?

https://getcomposer.org

PHP Namespaces● Requiere PHP 5.3

● Evitar conflictos con nombres de clases.

● Agrupar grupos de clases por nombre.

● Integrado en composer.

● Perfecta integración con Github.

● Modularización.

http://php.net/manual/es/language.namespaces.php

PHP Namespaces: Ejemplo

http://php.net/manual/es/language.namespaces.php

PHP Traits● Requiere PHP 5.4.

● Rompe la herencia vertical de clases.

● Modularización.

● Perfecto para combinar con Joomla.

● No sustituye la herencia tradicional de clases.

http://php.net/manual/es/language.oop5.traits.php

PHP Traits: Ejemplo de herencia vertical

http://php.net/manual/es/language.oop5.traits.php

PHP Traits: Ejemplo de trait

http://php.net/manual/es/language.oop5.traits.php

MySQL

https://www.mysql.com

¿Qué versión de MySQL elegir?

● Joomla requiere MySQL +5.1.

● Versión más común MySQL 5.5 /5.6

● MySQL 5.7 es 200% más rápido.

● Extensión comercial: MySQL 5.5

● Desarrollos a medida: MySQL 5.7

https://www.mysql.com

Git● Control de versiones.

● CASI imposible perder algo.

● Changelog casi automático.

● Búsqueda en el historial.

● No es una opción, es un requisito.

● Puedes empezar con una interfaz: GitKraken, Tower, Github...

https://git-scm.com

Tests / CI● Tus usuarios no son ratas de laboratorio.

● Pruebas unitarias:

○ PHPUnit.

● Pruebas de aceptación.

○ Selenium, Codeception, Behat, etc.

● Travis CI, Jenkins, Gitlab CI, etc.

Tests / CI

Sass● Preprocesador CSS.

● Variables personalizables.

● Funciones (mixins).

● Modulariza tus estilos.

● Reusabilidad.

● Define media queries dentro de cada elemento.

http://sass-lang.com

Sass: Ejemplo

https://github.com/nternetinspired/embrace

Bower● Gestor de dependencias de assets (css, javascript).

● No depende de otras tecnologías.

● No soporta dependencias anidadas.

● Está siendo reemplazado por npm.

● Fácilmente reemplazable en cuestión de minutos.

http://bower.io

Node.js

● Pequeñas librerías javascript que pueden conectarse entre sí.

● Multiplataforma.

● Gestor de assets ( npm ).

● Perfecta integración con Git.

● En Joomla principalmente para sistemas de build y assets.

https://nodejs.org

Grunt / Gulp● Sistemas de build basados en Node.js

● Usos más comunes:

○ Compilar javascript y minimizar archivo resultante.

○ Compilar Sass / LESS y minimizar CSS resultante..

○ Actualizar sitio de prueba con cambios en idiomas, php, etc.

○ BrowserSync ver cambios en tiempo real.

○ Crear zip para empaquetar tus extensiojnes (releases).

http://gulpjs.com | http://gruntjs.com

SVG● Archivos pequeños con buena compresión.

● Manipulables a través de CSS y Javascript.

● Se adaptan bien a cualquier resolución.

● Iconos perfectos.

● Funcionan en cualquier navegador salvo IE8 / Android 2.3.

● Se pueden incrustar sin requests adicionales.

http://www.w3schools.com/svg

Tú eres la tecnología más importante.

NUNCA dejes de actualizarte.