{"id":16380,"date":"2017-05-12T10:03:22","date_gmt":"2017-05-12T10:03:22","guid":{"rendered":"https:\/\/openexpoeurope.com\/?p=16380\/"},"modified":"2021-03-29T16:56:33","modified_gmt":"2021-03-29T14:56:33","slug":"front-end-frameworks-headless-cms","status":"publish","type":"post","link":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/","title":{"rendered":"Front End Frameworks en Headless CMS"},"content":{"rendered":"<p style=\"text-align: justify;\"><strong><span style=\"color: #ff0000;\">ACTUALIZACI\u00d3N:<\/span> <\/strong>\u00a1El pr\u00f3ximo <strong>jueves 15 de abril del 2021<\/strong> no te pierdas el <strong>CMS\/DXP Day<\/strong> de la serie de eventos virtuales<strong> OpenExpo Business Live<\/strong>! Si quieres saber qu\u00e9 herramienta de gesti\u00f3n de contenidos y experiencia de usuario es la m\u00e1s adecuada para la transici\u00f3n digital de tu empresa, qu\u00e9 preguntas tienes que hacerte para elegirla, y por qu\u00e9 hoy en d\u00eda son fundamentales tanto en entornos B2B como B2C, <strong>\u00a1reg\u00edstrate gratis!\u00a0<\/strong><\/p>\n<p style=\"text-align: justify;\"><strong>REGISTRO \u21aa\ufe0f <a href=\"https:\/\/cutt.ly\/5x2SgRs\">https:\/\/cutt.ly\/5x2SgRs<\/a><\/strong><\/p>\n<p>&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;&#8212;-<\/p>\n<p style=\"text-align: justify;\">En los CMS web tradicionales o tambi\u00e9n llamados CMS monol\u00edticos todas las capas necesarias para crear y \u201crenderizar\u201d contenidos en p\u00e1ginas, son gestionados por el CMS. Es decir, la capa de almacenamiento, la de seguridad de acceso a contenidos, la capa de renderizaci\u00f3n y la capa de edici\u00f3n de p\u00e1ginas est\u00e1n todas en el mismo producto de software y por lo tanto en el mismo servidor.<\/p>\n<p style=\"text-align: justify;\">Esto conlleva a que toda la l\u00f3gica de negocio, que puedan tener las p\u00e1ginas web, se encuentre del lado del servidor en el CMS. Esto tradicionalmente ha sido la sido la manera de trabajar por muchos a\u00f1os, simplemente renderizando el HTML est\u00e1tico.<\/p>\n<p style=\"text-align: justify;\"><strong>La Llegada de los Frameworks Javascript<\/strong><\/p>\n<p style=\"text-align: justify;\">Sin embargo, esto ha cambiado en los \u00faltimos a\u00f1os gracias a los frameworks Javascript, como Angular o React, los cuales proveen todos los mecanismos necesarios para renderizar HTMLs din\u00e1micos del lado del cliente.<\/p>\n<p style=\"text-align: justify;\">Con la adaptaci\u00f3n de frameworks Javascript se ha agilizado mucho la integraci\u00f3n de sistemas externos en los CMS web. Para cargar datos externos en una p\u00e1gina no es necesario hacerlo desde el servidor o CMS, si no que directamente se cargan desde el cliente (mediante servicios web), agilizando as\u00ed los tiempos de carga de la p\u00e1gina y la usabilidad de la misma.<\/p>\n<p style=\"text-align: justify;\"><strong>La Llegada de los Headless CMS<\/strong><\/p>\n<p style=\"text-align: justify;\">Una vez llegado a este punto es natural utilizar frameworks Javascript para intentar cargar los contenidos gestionados por el CMS.<\/p>\n<p style=\"text-align: justify;\">A esta estructura se le denomina Headless CMS, y el objetivo es eliminar las capas de renderizaci\u00f3n y edici\u00f3n de p\u00e1ginas del CMS. De esta manera, se tienen dos aplicaciones desacopladas con distintos roles. Por un lado el <strong>CMS<\/strong> <strong>almacena<\/strong> y <strong>administra<\/strong> los contenidos y por el otro, la aplicaci\u00f3n <strong>Javascript<\/strong> <strong>obtiene<\/strong> y <strong>renderiza<\/strong> los contenidos en p\u00e1ginas mediante RESTful API.<\/p>\n<p style=\"text-align: justify;\">Al igual que al cargar contenidos externos, esto tiene muchas ventajas para los tiempos de carga y usabilidad de las p\u00e1ginas.<\/p>\n<p style=\"text-align: justify;\">Sin embargo, esto tambi\u00e9n tiene algunas desventajas al eliminar caracter\u00edsticas intr\u00ednsecas de los CMS monol\u00edticos como pueden ser:<\/p>\n<ul style=\"text-align: justify;\">\n<li>Administraci\u00f3n de la estructura de navegaci\u00f3n.<\/li>\n<li>Layout de contenidos dentro de las p\u00e1ginas.<\/li>\n<li>Previsualizaci\u00f3n de p\u00e1ginas.<\/li>\n<li>Versionado de p\u00e1ginas.<\/li>\n<li>Publicaci\u00f3n de p\u00e1ginas entre entornos de edici\u00f3n y publicaci\u00f3n.<\/li>\n<li>Workflows de colaboraci\u00f3n entre editores y revisores.<\/li>\n<li>Personalizaci\u00f3n de p\u00e1ginas y contenidos mediante motor de reglas.<\/li>\n<\/ul>\n<p style=\"text-align: justify;\"><strong>Los Headless CMS H\u00edbridos: La Posible Soluci\u00f3n<\/strong><\/p>\n<p style=\"text-align: justify;\">El objetivo de un enfoque h\u00edbrido entre CMS monol\u00edticos y Headless es tomar un poco lo mejor de los dos mundos. La gesti\u00f3n de los contenidos y p\u00e1ginas sigue estando del lado del CMS, pero se pueden utilizar trozos (componentes, widgets, etc) que utilicen frameworks Javascript para cargar los contenidos necesarios del lado del cliente.<\/p>\n<p style=\"text-align: justify;\">Con Magnolia CMS es muy sencillo crear componentes que tengan l\u00f3gica Javascript y consuman los contenidos de forma \u201cheadless\u201d. Sin embargo, estos componentes son gestionados mediante el editor de p\u00e1ginas de Magnolia, pudiendo hacer uso de la estructura de navegaci\u00f3n, las templates de p\u00e1ginas, la previsualizaci\u00f3n, el versionado, publicaci\u00f3n, workflows y personalizaci\u00f3n que viene incluidos dentro del producto.<\/p>\n<p style=\"text-align: justify;\"><strong>Light Development en Magnolia<\/strong><\/p>\n<p style=\"text-align: justify;\">En Magnolia es muy sencillo para un \u201cfront end dev\u201d crear una plantilla de componente que pueda consumir contenidos mediante llamadas RESTful y frameworks como Angular.<\/p>\n<p style=\"text-align: justify;\">Veamos un ejemplo de consumo de contactos (un contenido de ejemplo en Magnolia) mediante una app de Angular embebida en un componente de Magnolia:<\/p>\n<p style=\"text-align: justify;\">Primero se necesitar\u00eda el fichero de configuraci\u00f3n de la plantilla:<\/p>\n<p style=\"text-align: justify;\">title: Contact list<\/p>\n<p style=\"text-align: justify;\">renderType: freemarker<\/p>\n<p style=\"text-align: justify;\">templateScript: \/openexpo-demo\/templates\/components\/contactList.ftl<\/p>\n<p style=\"text-align: justify;\">\n<p style=\"text-align: justify;\">Aqu\u00ed simplemente se esta definiendo el script en el componente Contacts list. El fichero debe estar situado en la carpeta del light module, que este caso es \u201copenexpo-demo\u201d.<\/p>\n<p style=\"text-align: justify;\">El script contiene el c\u00f3digo HTML y Javascript necesario para hacer las llamadas REST que cargar\u00e1n los contenidos del workspace de contactos:<\/p>\n<p style=\"text-align: justify;\">&lt;script type=\u00bbtext\/javascript\u00bb&gt;<\/p>\n<p style=\"text-align: justify;\">var app = angular.module(\u00abgetJSON\u00bb,[]);<\/p>\n<p style=\"text-align: justify;\">app.controller(&#8216;MainController&#8217;,[&#8216;$scope&#8217;, &#8216;$http&#8217;,<\/p>\n<p style=\"text-align: justify;\">function($scope, $http) {<\/p>\n<p style=\"text-align: justify;\">$http.get(&#8216;${ctx.contextPath}\/.rest\/nodes\/v1\/contacts\/?depth=2&amp;includeMetada=false&#8217;)<\/p>\n<p style=\"text-align: justify;\">\n<p style=\"text-align: justify;\">Es importante destacar la disponibilidad de cualquier contenido en Magnolia mediante endpoints RESTful, los cuales devuelven los datos tanto en XML como en JSON.<\/p>\n<p style=\"text-align: justify;\">Puedes encontrar mas informaci\u00f3n sobre los endpoints REST aqu\u00ed:<\/p>\n<p style=\"text-align: justify;\"><a href=\"https:\/\/documentation.magnolia-cms.com\/display\/DOCS\/REST+API\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/documentation.magnolia-cms.com\/display\/DOCS\/REST+API<\/a><\/p>\n<p style=\"text-align: justify;\">Aqu\u00ed tenemos el script completo de la aplicaci\u00f3n Angular que carga los contenidos y los renderiza en elementos &lt;div&gt;. La app incluye un buscador que permite realizar filtros del lado del cliente sobre los nombres de los contactos:<\/p>\n<p style=\"text-align: justify;\">&lt;script src=\u00bbhttps:\/\/ajax.googleapis.com\/ajax\/libs\/angularjs\/1.4.7\/angular.min.js\u00bb&gt;&lt;\/script&gt;<\/p>\n<p style=\"text-align: justify;\">&lt;script type=\u00bbtext\/javascript\u00bb&gt;<\/p>\n<p style=\"text-align: justify;\">var app = angular.module(\u00abgetJSON\u00bb,[]);<\/p>\n<p style=\"text-align: justify;\">app.controller(&#8216;MainController&#8217;,[&#8216;$scope&#8217;, &#8216;$http&#8217;,<\/p>\n<p style=\"text-align: justify;\">function($scope, $http) {<\/p>\n<p style=\"text-align: justify;\">$http.get(&#8216;${ctx.contextPath}\/.rest\/nodes\/v1\/contacts\/?depth=2&amp;includeMetada=false&#8217;)<\/p>\n<p style=\"text-align: justify;\">.success(<\/p>\n<p style=\"text-align: justify;\">function(response) {<\/p>\n<p style=\"text-align: justify;\">$.each(response.nodes,<\/p>\n<p style=\"text-align: justify;\">function() {<\/p>\n<p style=\"text-align: justify;\">var node = this;<\/p>\n<p style=\"text-align: justify;\">$.each(node.properties,<\/p>\n<p style=\"text-align: justify;\">function() {<\/p>\n<p style=\"text-align: justify;\">if(this.name == \u00abfirstName\u00bb){<\/p>\n<p style=\"text-align: justify;\">node[&#8216;firstName&#8217;] = this.values[0];<\/p>\n<p style=\"text-align: justify;\">}<\/p>\n<p style=\"text-align: justify;\">if(this.name == \u00ablastName\u00bb){<\/p>\n<p style=\"text-align: justify;\">node[&#8216;lastName&#8217;] = this.values[0];<\/p>\n<p style=\"text-align: justify;\">}<\/p>\n<p style=\"text-align: justify;\">}<\/p>\n<p style=\"text-align: justify;\">);<\/p>\n<p style=\"text-align: justify;\">}<\/p>\n<p style=\"text-align: justify;\">);<\/p>\n<p style=\"text-align: justify;\">$scope.contacts = response.nodes;<\/p>\n<p style=\"text-align: justify;\">}<\/p>\n<p style=\"text-align: justify;\">);<\/p>\n<p style=\"text-align: justify;\">}<\/p>\n<p style=\"text-align: justify;\">])<\/p>\n<p style=\"text-align: justify;\">&lt;\/script&gt;<\/p>\n<p style=\"text-align: justify;\">\n<p style=\"text-align: justify;\">&lt;div ng-app=\u00bbgetJSON\u00bb ng-controller=\u00bbMainController\u00bb&gt;<\/p>\n<p style=\"text-align: justify;\">&lt;input ng-model=\u00bbsearch\u00bb class=\u00bbform-control\u00bb type=\u00bbtext\u00bb placeholder=\u00bbSearch for &#8230;\u00bb \/&gt;&lt;br\/&gt;<\/p>\n<p style=\"text-align: justify;\">&lt;div ng-if=\u00bbcontact.type==&#8217;mgnl:contact'\u00bb ng-repeat=\u00bbcontact in contactsFiltered=(contacts|filter:search)\u00bb class=\u00bbcol-xs-12 col-sm-6 col-md-3&#8243;&gt;<\/p>\n<p style=\"text-align: justify;\">&lt;div class=\u00bbthumbnail text-center\u00bb &gt;<\/p>\n<p style=\"text-align: justify;\">{{contact.firstName}} {{contact.lastName}}<\/p>\n<p style=\"text-align: justify;\">&lt;\/div&gt;<\/p>\n<p style=\"text-align: justify;\">&lt;\/div&gt;<\/p>\n<p>&lt;\/div&gt;<\/p>\n<p>&nbsp;<\/p>\n<p>Una vez creado el componente, \u00e9ste simplemente se puede registrar en cualquier \u00e1rea de p\u00e1gina Magnolia y utilizar todas las ventajas que un CMS provee.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-16381 size-full\" src=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.03.29.png\" alt=\"Headless CMS\" width=\"2880\" height=\"908\" srcset=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.03.29.png 2880w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.03.29-300x95.png 300w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.03.29-768x242.png 768w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.03.29-1024x323.png 1024w\" sizes=\"auto, (max-width: 2880px) 100vw, 2880px\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-16382 size-full\" src=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png\" alt=\"Headless CMS\" width=\"2880\" height=\"1124\" srcset=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png 2880w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31-300x117.png 300w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31-768x300.png 768w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31-1024x400.png 1024w\" sizes=\"auto, (max-width: 2880px) 100vw, 2880px\" \/><\/p>\n<p>Finalmente aqu\u00ed podemos ver el filtro funcionando en la p\u00e1gina publica:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-16383 size-full\" src=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.13.48.png\" alt=\"Headless CMS\" width=\"2866\" height=\"1214\" srcset=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.13.48.png 2866w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.13.48-300x127.png 300w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.13.48-768x325.png 768w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.13.48-1024x434.png 1024w\" sizes=\"auto, (max-width: 2866px) 100vw, 2866px\" \/><\/p>\n<p>Esto ha sido todo por hoy. En el evento <a href=\"https:\/\/www.magnolia-cms.com\/about\/news-events\/events\/rd-desarrolladores-2017.html\" target=\"_blank\" rel=\"noopener noreferrer\">Retos Digitales Magnolia Community<\/a> se mostrar\u00e1n temas como este y mucho mas.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-16385 aligncenter\" src=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Edwin-Guilbert-photo.jpg\" alt=\"\" width=\"276\" height=\"184\" srcset=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Edwin-Guilbert-photo.jpg 6000w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Edwin-Guilbert-photo-300x200.jpg 300w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Edwin-Guilbert-photo-768x512.jpg 768w, https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Edwin-Guilbert-photo-1024x683.jpg 1024w\" sizes=\"auto, (max-width: 276px) 100vw, 276px\" \/><\/p>\n<p style=\"text-align: center;\"><em>Art\u00edculo por\u00a0Edwin Guilbert,\u00a0Senior Solution Architect y Trainer en <a href=\"https:\/\/www.magnolia-cms.es\/\" target=\"_blank\" rel=\"noopener noreferrer\">Magnolia<\/a><\/em><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>ACTUALIZACI\u00d3N: \u00a1El pr\u00f3ximo jueves 15 de abril del 2021 no te pierdas el CMS\/DXP Day de la serie de eventos virtuales OpenExpo Business Live! Si quieres saber qu\u00e9 herramienta de gesti\u00f3n de contenidos y experiencia de usuario es la m\u00e1s adecuada para la transici\u00f3n digital de tu empresa, qu\u00e9 preguntas tienes que hacerte para elegirla,&#8230; <\/p>\n<div class=\"clear\"><\/div>\n<p><a href=\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/\" class=\"gdlr-info-font excerpt-read-more\">Read More<\/a><\/p>\n","protected":false},"author":1,"featured_media":16382,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[80],"tags":[],"class_list":["post-16380","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-cms-blog"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.8.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Front End Frameworks en Headless CMS<\/title>\n<meta name=\"description\" content=\"Edwin Guilbert, Senior Solution Architect y Trainer en Magnolia nos habla de Front End Frameworks en Headless CMS con motivo de OpenExpo 2017.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Front End Frameworks en Headless CMS\" \/>\n<meta property=\"og:description\" content=\"Edwin Guilbert, Senior Solution Architect y Trainer en Magnolia nos habla de Front End Frameworks en Headless CMS con motivo de OpenExpo 2017.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/\" \/>\n<meta property=\"og:site_name\" content=\"OpenExpo Europe 2025\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/OpenExpoEurope\/\" \/>\n<meta property=\"article:published_time\" content=\"2017-05-12T10:03:22+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-03-29T14:56:33+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2880\" \/>\n\t<meta property=\"og:image:height\" content=\"1124\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"OpenExpo Europe\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@openexpoeurope\" \/>\n<meta name=\"twitter:site\" content=\"@openexpoeurope\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"OpenExpo Europe\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/\"},\"author\":{\"name\":\"OpenExpo Europe\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/#\/schema\/person\/6130a86fee51a33fc88c6e26a9397ce1\"},\"headline\":\"Front End Frameworks en Headless CMS\",\"datePublished\":\"2017-05-12T10:03:22+00:00\",\"dateModified\":\"2021-03-29T14:56:33+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/\"},\"wordCount\":1112,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/#organization\"},\"image\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png\",\"articleSection\":[\"CMS\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/\",\"url\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/\",\"name\":\"Front End Frameworks en Headless CMS\",\"isPartOf\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png\",\"datePublished\":\"2017-05-12T10:03:22+00:00\",\"dateModified\":\"2021-03-29T14:56:33+00:00\",\"description\":\"Edwin Guilbert, Senior Solution Architect y Trainer en Magnolia nos habla de Front End Frameworks en Headless CMS con motivo de OpenExpo 2017.\",\"breadcrumb\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#primaryimage\",\"url\":\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png\",\"contentUrl\":\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png\",\"width\":2880,\"height\":1124},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/openexpoeurope.com\/es\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Front End Frameworks en Headless CMS\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/#website\",\"url\":\"https:\/\/openexpoeurope.com\/es\/\",\"name\":\"OpenExpo Europe 2025\",\"description\":\"OpenExpo Europe 2025 - Innovaci\u00f3n, Transformaci\u00f3n Digital y Open Source\",\"publisher\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/openexpoeurope.com\/es\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/#organization\",\"name\":\"OpenExpo Europe\",\"url\":\"https:\/\/openexpoeurope.com\/es\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2018\/10\/csm_logo-open-expo-europe_01a0785240.png\",\"contentUrl\":\"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2018\/10\/csm_logo-open-expo-europe_01a0785240.png\",\"width\":1024,\"height\":1024,\"caption\":\"OpenExpo Europe\"},\"image\":{\"@id\":\"https:\/\/openexpoeurope.com\/es\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/OpenExpoEurope\/\",\"https:\/\/x.com\/openexpoeurope\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/#\/schema\/person\/6130a86fee51a33fc88c6e26a9397ce1\",\"name\":\"OpenExpo Europe\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/openexpoeurope.com\/es\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0cfc426ea06cf6794394f112f3f8772398050f9fdade2fc3634b5b5392768f79?s=96&d=wp_user_avatar&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0cfc426ea06cf6794394f112f3f8772398050f9fdade2fc3634b5b5392768f79?s=96&d=wp_user_avatar&r=g\",\"caption\":\"OpenExpo Europe\"},\"url\":\"https:\/\/openexpoeurope.com\/es\/author\/administrador\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Front End Frameworks en Headless CMS","description":"Edwin Guilbert, Senior Solution Architect y Trainer en Magnolia nos habla de Front End Frameworks en Headless CMS con motivo de OpenExpo 2017.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/","og_locale":"es_ES","og_type":"article","og_title":"Front End Frameworks en Headless CMS","og_description":"Edwin Guilbert, Senior Solution Architect y Trainer en Magnolia nos habla de Front End Frameworks en Headless CMS con motivo de OpenExpo 2017.","og_url":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/","og_site_name":"OpenExpo Europe 2025","article_publisher":"https:\/\/www.facebook.com\/OpenExpoEurope\/","article_published_time":"2017-05-12T10:03:22+00:00","article_modified_time":"2021-03-29T14:56:33+00:00","og_image":[{"width":2880,"height":1124,"url":"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png","type":"image\/png"}],"author":"OpenExpo Europe","twitter_card":"summary_large_image","twitter_creator":"@openexpoeurope","twitter_site":"@openexpoeurope","twitter_misc":{"Escrito por":"OpenExpo Europe","Tiempo de lectura":"5 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#article","isPartOf":{"@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/"},"author":{"name":"OpenExpo Europe","@id":"https:\/\/openexpoeurope.com\/es\/#\/schema\/person\/6130a86fee51a33fc88c6e26a9397ce1"},"headline":"Front End Frameworks en Headless CMS","datePublished":"2017-05-12T10:03:22+00:00","dateModified":"2021-03-29T14:56:33+00:00","mainEntityOfPage":{"@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/"},"wordCount":1112,"commentCount":0,"publisher":{"@id":"https:\/\/openexpoeurope.com\/es\/#organization"},"image":{"@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#primaryimage"},"thumbnailUrl":"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png","articleSection":["CMS"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/","url":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/","name":"Front End Frameworks en Headless CMS","isPartOf":{"@id":"https:\/\/openexpoeurope.com\/es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#primaryimage"},"image":{"@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#primaryimage"},"thumbnailUrl":"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png","datePublished":"2017-05-12T10:03:22+00:00","dateModified":"2021-03-29T14:56:33+00:00","description":"Edwin Guilbert, Senior Solution Architect y Trainer en Magnolia nos habla de Front End Frameworks en Headless CMS con motivo de OpenExpo 2017.","breadcrumb":{"@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#primaryimage","url":"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png","contentUrl":"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2017\/05\/Screen-Shot-2017-05-05-at-16.05.31.png","width":2880,"height":1124},{"@type":"BreadcrumbList","@id":"https:\/\/openexpoeurope.com\/es\/front-end-frameworks-headless-cms\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/openexpoeurope.com\/es\/"},{"@type":"ListItem","position":2,"name":"Front End Frameworks en Headless CMS"}]},{"@type":"WebSite","@id":"https:\/\/openexpoeurope.com\/es\/#website","url":"https:\/\/openexpoeurope.com\/es\/","name":"OpenExpo Europe 2025","description":"OpenExpo Europe 2025 - Innovaci\u00f3n, Transformaci\u00f3n Digital y Open Source","publisher":{"@id":"https:\/\/openexpoeurope.com\/es\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/openexpoeurope.com\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/openexpoeurope.com\/es\/#organization","name":"OpenExpo Europe","url":"https:\/\/openexpoeurope.com\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/openexpoeurope.com\/es\/#\/schema\/logo\/image\/","url":"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2018\/10\/csm_logo-open-expo-europe_01a0785240.png","contentUrl":"https:\/\/openexpoeurope.com\/wp-content\/uploads\/2018\/10\/csm_logo-open-expo-europe_01a0785240.png","width":1024,"height":1024,"caption":"OpenExpo Europe"},"image":{"@id":"https:\/\/openexpoeurope.com\/es\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/OpenExpoEurope\/","https:\/\/x.com\/openexpoeurope"]},{"@type":"Person","@id":"https:\/\/openexpoeurope.com\/es\/#\/schema\/person\/6130a86fee51a33fc88c6e26a9397ce1","name":"OpenExpo Europe","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/openexpoeurope.com\/es\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0cfc426ea06cf6794394f112f3f8772398050f9fdade2fc3634b5b5392768f79?s=96&d=wp_user_avatar&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0cfc426ea06cf6794394f112f3f8772398050f9fdade2fc3634b5b5392768f79?s=96&d=wp_user_avatar&r=g","caption":"OpenExpo Europe"},"url":"https:\/\/openexpoeurope.com\/es\/author\/administrador\/"}]}},"_links":{"self":[{"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/posts\/16380","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/comments?post=16380"}],"version-history":[{"count":0,"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/posts\/16380\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/media\/16382"}],"wp:attachment":[{"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/media?parent=16380"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/categories?post=16380"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/openexpoeurope.com\/es\/wp-json\/wp\/v2\/tags?post=16380"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}