{"id":2258,"date":"2019-10-05T07:31:40","date_gmt":"2019-10-05T05:31:40","guid":{"rendered":"https:\/\/davidperezgar.com\/?p=2258"},"modified":"2019-10-05T07:33:58","modified_gmt":"2019-10-05T05:33:58","slug":"2019-sevilla-desarrolladores-dia-1","status":"publish","type":"post","link":"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/","title":{"rendered":"WordCamp Sevilla para desarrolladores &#8211; D\u00eda 1 Talleres"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">El pasado viernes 4 de Octubre fue el primer d\u00eda de la <a href=\"https:\/\/davidperezgar.com\/tag\/wordcamp-sevilla\/\">WordCamp de Sevilla<\/a> dedicada a los desarrolladores. Una cita imprescindible para todo desarrollador. Y esta <strong>entrada me sirve de recordatorio \/ resumen<\/strong> de todo lo que pude ver.<\/p>\n\n\n\n<figure class=\"wp-block-gallery alignwide columns-2 is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex frontblocks-gallery-grid\" data-layout=\"grid\" data-columns=\"3\" data-gutter=\"20\" data-lightbox=\"false\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"3088\" height=\"2316\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/david-y-jesus-en-wc-sevilla.jpg\" alt=\"david y jesus en wc sevilla\" data-id=\"2260\" data-full-url=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/david-y-jesus-en-wc-sevilla.jpg\" data-link=\"https:\/\/davidperezgar.com\/blog\/comunidad-wordpress\/2019-sevilla-desarrolladores-dia-1\/attachment\/david-y-jesus-en-wc-sevilla\/\" class=\"wp-image-2260\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/david-y-jesus-en-wc-sevilla.jpg 3088w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/david-y-jesus-en-wc-sevilla-596x447.jpg 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/david-y-jesus-en-wc-sevilla-768x576.jpg 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/david-y-jesus-en-wc-sevilla-1082x812.jpg 1082w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/david-y-jesus-en-wc-sevilla-1536x1152.jpg 1536w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/david-y-jesus-en-wc-sevilla-2048x1536.jpg 2048w\" sizes=\"auto, (max-width: 3088px) 100vw, 3088px\" \/><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"3088\" height=\"2316\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/tapillas-por-sevilla-e1570202251657.jpg\" alt=\"tapillas por sevilla\" data-id=\"2261\" data-full-url=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/tapillas-por-sevilla-e1570202251657.jpg\" data-link=\"https:\/\/davidperezgar.com\/blog\/comunidad-wordpress\/2019-sevilla-desarrolladores-dia-1\/attachment\/tapillas-por-sevilla\/\" class=\"wp-image-2261\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/tapillas-por-sevilla-e1570202251657.jpg 3088w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/tapillas-por-sevilla-e1570202251657-596x447.jpg 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/tapillas-por-sevilla-e1570202251657-768x576.jpg 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/tapillas-por-sevilla-e1570202251657-1082x812.jpg 1082w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/tapillas-por-sevilla-e1570202251657-1536x1152.jpg 1536w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/tapillas-por-sevilla-e1570202251657-2048x1536.jpg 2048w\" sizes=\"auto, (max-width: 3088px) 100vw, 3088px\" \/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Hubo tres salas y tres talleres de cada sala. A continuaci\u00f3n son las anotaciones de las charlas que estuve<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-white ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Tabla de contenidos<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-69fa5525256ce\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-69fa5525256ce\"  aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Entiende_y_crea_bloques_de_Gutenberg\" >Entiende y crea bloques de Gutenberg<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Del_caos_a_la_excelencia_Refactorizando_un_plugin\" >Del caos a la excelencia: Refactorizando un plugin<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Paso_a_paso\" >Paso a paso<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Building_an_AMP_compatible_WordPress_site_English\" >Building an AMP compatible WordPress site (English)<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Introduccion_a_AMP_Framework\" >Introducci\u00f3n a AMP Framework<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Democratizacion_del_rendimiento\" >Democratizaci\u00f3n del rendimiento<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Componentes_Web\" >Componentes Web<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Utilizando_AMP_en_WordPress\" >Utilizando AMP en WordPress<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Taller\" >Taller<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/#Encontrar_complementos_compatibles_con_AMP\" >Encontrar complementos compatibles con AMP<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Entiende_y_crea_bloques_de_Gutenberg\"><\/span>Entiende y crea bloques de Gutenberg<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<p class=\"wp-block-paragraph\"><strong>Nadia Prida<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Nos explic\u00f3 c\u00f3mo est\u00e1 estructurado los bloques de Gutenberg, el nuevo editor de WordPress. Me llam\u00f3 la atenci\u00f3n que sin tener experiencia en WordPress se haya iniciado directamente a realizar bloques.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"4032\" height=\"3024\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/nadia-prida-bloques-gutenberg.jpg\" alt=\"nadia prida bloques gutenberg\" class=\"wp-image-2259\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/nadia-prida-bloques-gutenberg.jpg 4032w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/nadia-prida-bloques-gutenberg-596x447.jpg 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/nadia-prida-bloques-gutenberg-768x576.jpg 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/nadia-prida-bloques-gutenberg-1082x812.jpg 1082w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/nadia-prida-bloques-gutenberg-1536x1152.jpg 1536w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/nadia-prida-bloques-gutenberg-2048x1536.jpg 2048w\" sizes=\"auto, (max-width: 4032px) 100vw, 4032px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Del_caos_a_la_excelencia_Refactorizando_un_plugin\"><\/span>Del caos a la excelencia:<br>Refactorizando un plugin<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<p class=\"wp-block-paragraph\"><strong><a href=\"https:\/\/2019-developers.sevilla.wordcamp.org\/informacion\/programa-schedule\/ponentes\/#wcorg-speaker-gorka-urrutia\" target=\"_blank\" rel=\"noopener\">Gorka Urrutia<\/a><\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Experimentado desarrollador, realiza su trabajo en Solvent.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"4032\" height=\"3024\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/gorka-urrutia-refactorizacion-plugin.jpg\" alt=\"gorka urrutia refactorizacion plugin\" class=\"wp-image-2266\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-refactorizacion-plugin.jpg 4032w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-refactorizacion-plugin-596x447.jpg 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-refactorizacion-plugin-768x576.jpg 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-refactorizacion-plugin-1082x812.jpg 1082w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-refactorizacion-plugin-1536x1152.jpg 1536w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-refactorizacion-plugin-2048x1536.jpg 2048w\" sizes=\"auto, (max-width: 4032px) 100vw, 4032px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><strong>Utilizar buenas pr\u00e1cticas:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Conocer tu framework y sus buenas pr\u00e1cticas.<\/li><li>PHP Composer.<\/li><li>Pruebas automatizadas: Cypress, PHPUnit, etc.<\/li><li>Herramientas: Git, Docker, Jira \/ Trello \/ Asana.<\/li><\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><strong>Buenas pr\u00e1cticas, \u00bfpara qu\u00e9?<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Cuesta lo mismo hacerlo bien que mal<\/li><li>Un c\u00f3digo limpio y claro se entiende mejor<\/li><li>Tu yo del futuro te lo agradecer\u00e1.<\/li><li>Hacer modificaciones es m\u00e1s f\u00e1cil.<\/li><\/ul>\n<\/div>\n<\/div>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"4032\" height=\"3024\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/gorka-urrutia-y-cypress.jpg\" alt=\"gorka urrutia y cypress\" class=\"wp-image-2267\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-y-cypress.jpg 4032w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-y-cypress-596x447.jpg 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-y-cypress-768x576.jpg 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-y-cypress-1082x812.jpg 1082w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-y-cypress-1536x1152.jpg 1536w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/gorka-urrutia-y-cypress-2048x1536.jpg 2048w\" sizes=\"auto, (max-width: 4032px) 100vw, 4032px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Paso_a_paso\"><\/span>Paso a paso<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<ol class=\"wp-block-list\"><li>Entender el problema<\/li><li>Analizar c\u00f3digo<\/li><li>No rompas m\u00e1s <\/li><li>A\u00f1adir test<\/li><li>Comenzar a refactorizar<\/li><\/ol>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><strong><em>Conocemos <a href=\"https:\/\/www.cypress.io\/\" target=\"_blank\" rel=\"noopener\">Cypress<\/a> como herramienta de Test, que simula la acci\u00f3n de usuario para realizar tests atomatizados.<\/em><\/strong><\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><strong>Revisamos errores m\u00e1s comunes:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Nombres de variables y funciones confusos.<\/li><li>Notaciones diferentes.<\/li><li>Comentarios que no corresponden al c\u00f3digo.<\/li><li>Usar constantes en vez de n\u00fameros.<\/li><li>Tener un \u00fanico return en los m\u00e9todos.<\/li><\/ul>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><strong>Principios SOLID<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Responsabilidad \u00fanica. Que debe una funci\u00f3n o clase tiene un s\u00f3lo cometido.<\/li><li>Open \/ Closed<\/li><li>Sustituci\u00f3n de Liskov<\/li><li>Interface Segregation<\/li><li>Dependency Inversion<\/li><\/ul>\n<\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Recomendaciones:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Instalar <a href=\"https:\/\/www.cypress.io\/\" target=\"_blank\" rel=\"noopener\">Cypress<\/a> para los tests de usuario. <\/li><li><a href=\"https:\/\/wp-cli.org\/#install\" target=\"_blank\" rel=\"noopener\">Instalar WP-Cli<\/a>. <\/li><li><a href=\"https:\/\/github.com\/sebastianbergmann\/phpunit#installation\" target=\"_blank\" rel=\"noopener\">Instalar PHPUnit<\/a>.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Building_an_AMP_compatible_WordPress_site_English\"><\/span>Building an AMP compatible WordPress site (English)<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/2019-developers.sevilla.wordcamp.org\/informacion\/programa-schedule\/ponentes\/#wcorg-speaker-felix-arntz\" target=\"_blank\" rel=\"noopener\">Felix Arntz<\/a><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"4032\" height=\"3024\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/building-amp-felix-arntz.jpg\" alt=\"building amp felix arntz\" class=\"wp-image-2273\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/building-amp-felix-arntz.jpg 4032w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/building-amp-felix-arntz-596x447.jpg 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/building-amp-felix-arntz-768x576.jpg 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/building-amp-felix-arntz-1082x812.jpg 1082w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/building-amp-felix-arntz-1536x1152.jpg 1536w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/building-amp-felix-arntz-2048x1536.jpg 2048w\" sizes=\"auto, (max-width: 4032px) 100vw, 4032px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Introduccion_a_AMP_Framework\"><\/span>Introducci\u00f3n a AMP Framework<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Se piensa que es para una versi\u00f3n muy sencillas p\u00e1ginas, pero no es as\u00ed. Es la web creada directamente AMP. No tiene sentido ahora tener dos versiones de una web.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">AMP es un framework de componentes web f\u00e1cil de crear<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Originalmente el nombre de AMP era webs aceleradas, y ahora no tiene sentido dicho nombre, pero se sigue nombrando AMP.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Democratizacion_del_rendimiento\"><\/span>Democratizaci\u00f3n del rendimiento<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<ul class=\"wp-block-list\"><li>AMP es un proyecto abierto.<\/li><li>AMP tiene un modelo propio de gobernancia<\/li><li>AMP est\u00e1 hecho para web abiertas.<\/li><\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Componentes_Web\"><\/span>Componentes Web<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Permite definir tus propias APIs para el navegador y utilizar tus propias etiquetas HTML, reutilizar y guardarlas.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Hay muchos tipos.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Porqu\u00e9 AMP es potente?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Porque Javascript es tiene un <a href=\"https:\/\/v8.dev\/blog\/cost-of-javascript-2019\" target=\"_blank\" rel=\"noopener\">gran coste en m\u00f3viles<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1602\" height=\"914\" src=\"https:\/\/davidperezgar.com\/wp-content\/uploads\/coste-javascript-2019.png\" alt=\"coste javascript 2019\" class=\"wp-image-2274\" title=\"\" srcset=\"https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/coste-javascript-2019.png 1602w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/coste-javascript-2019-596x340.png 596w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/coste-javascript-2019-768x438.png 768w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/coste-javascript-2019-1082x617.png 1082w, https:\/\/davidperezgar.com\/en\/wp-content\/uploads\/sites\/4\/coste-javascript-2019-1536x876.png 1536w\" sizes=\"auto, (max-width: 1602px) 100vw, 1602px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">AMP no est\u00e1 basado en Javascript, est\u00e1 basado en HTML.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ejemplos:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><strong>amp-analytics<\/strong>: permite a\u00f1adir la etiqueta de Google Analytics.<\/li><li><strong>amp-carousel<\/strong>: Un carousel directamente sin necesidad de javascript.<\/li><li><strong>amp-image-lightbox<\/strong>: al hacer clic en una imagen, se vuelve m\u00e1s grande.<\/li><\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>AMP Validator<\/strong> &#8211; <a href=\"https:\/\/validator.ampproject.org\/\" target=\"_blank\" rel=\"noopener\">https:\/\/validator.ampproject.org\/<\/a><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Permite validar tu c\u00f3digo AMP y comprobar si es correcto.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">AMP se compone de:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Componentes Web<\/li><li>Validator<\/li><li>CDN &amp; Cach\u00e9<\/li><\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Principios b\u00e1sicos de la Compatiblidad AMP:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Utiliza componentes AMP y declara atributos en vez de Javascript.<\/li><li>No puedes utilizar m\u00e1s de 50Kb de CSS por p\u00e1gina.<\/li><li>Utiliza siempre componentes AMP para archivos media (Ej. amp-img en vez de img).<\/li><li>Tener formularios que env\u00eden los datos con AJAX.<\/li><li>Siempre desarrolla teniendo en cuenta el m\u00f3vil primero.<\/li><\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Utilizando_AMP_en_WordPress\"><\/span>Utilizando AMP en WordPress<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">AMP plugin se preocupa de todas las piezas de tu web que necesitan interacci\u00f3n con AMP. <strong>Todav\u00eda el ecosistema de plugins<\/strong>, no est\u00e1 adaptado a AMP.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Principales funcionalidaes<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><strong>Automatizar las partes m\u00e1s grandes del proceso<\/strong><\/li><li><strong>Proveer al desarrollador herramientas y gu\u00edas<\/strong><\/li><li><strong>Monitorizar el desempe\u00f1o de AMP.<\/strong> Si aceptas los errores AMP, ser\u00e1 v\u00e1lido, pero perder\u00e1s la funcionalidad del plugin.<\/li><\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Modos de plantilla:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Standard &#8211; La mejor plantilla, pero necesitar\u00e1s conocimientos de desarrollo.<\/li><li>Transicional.<\/li><li>Lector. <\/li><\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Taller\"><\/span>Taller<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Cogemos una versi\u00f3n de WordPress para ver las posibilidades de AMP.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Encontrar_complementos_compatibles_con_AMP\"><\/span>Encontrar complementos compatibles con AMP<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Es importante conocer componentes web compatibles con AMP para construir la funcionalidad que necesitas para tu web.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Consejos<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Usa un tema que sea compatible con AMP<\/li><li>En <a href=\"https:\/\/amp-wp.org\/ecosystem\/\" target=\"_blank\" rel=\"noopener\">AMP Ecosystem<\/a> puedes conocer qu\u00e9 plugins y temas est\u00e1n adaptados a AMP.<\/li><\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">M\u00e1s informaci\u00f3n en amp.dev amp-wp.org<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Pr\u00f3ximas versiones y qu\u00e9 ser\u00e1 del futuro de AMP, lo encuentras en su <a href=\"https:\/\/amp.dev\/community\/roadmap\/\" target=\"_blank\" rel=\"noopener\">roadmap<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>El pasado viernes 4 de Octubre fue el primer d\u00eda de la WordCamp de Sevilla dedicada a los desarrolladores. Una cita imprescindible para todo desarrollador. Y esta entrada me sirve de recordatorio \/ resumen de todo lo que pude ver. &#8230; <a title=\"WordCamp Sevilla para desarrolladores &#8211; D\u00eda 1 Talleres\" class=\"read-more\" href=\"https:\/\/davidperezgar.com\/en\/blog\/wordpress-community\/2019-sevilla-desarrolladores-dia-1\/\" aria-label=\"Read more about WordCamp Sevilla para desarrolladores &#8211; D\u00eda 1 Talleres\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":2260,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","inline_featured_image":false,"_ayudawp_aiss_exclude":false,"webmentions_disabled_pings":false,"webmentions_disabled":false,"editor_notices":[],"footnotes":""},"categories":[39],"tags":[266],"class_list":["post-2258","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-community","tag-wordcamp-sevilla","generate-columns","tablet-grid-50","mobile-grid-100","grid-parent","grid-50"],"_links":{"self":[{"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/posts\/2258","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/comments?post=2258"}],"version-history":[{"count":0,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/posts\/2258\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/media\/2260"}],"wp:attachment":[{"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/media?parent=2258"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/categories?post=2258"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/davidperezgar.com\/en\/wp-json\/wp\/v2\/tags?post=2258"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}