{"id":7231,"date":"2021-09-12T18:45:23","date_gmt":"2021-09-12T16:45:23","guid":{"rendered":"http:\/\/www.unimedia.tech.mialias.net\/a-quick-introduction-to-react-hooks\/"},"modified":"2024-01-09T14:07:39","modified_gmt":"2024-01-09T13:07:39","slug":"a-quick-introduction-to-react-hooks","status":"publish","type":"post","link":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/","title":{"rendered":"Introducci\u00f3n r\u00e1pida a los ganchos de React"},"content":{"rendered":"\n<p>En este art\u00edculo, aprenderemos brevemente qu\u00e9 son los React Hooks, los tipos de hooks, y tambi\u00e9n ejemplos b\u00e1sicos de uso de algunos de estos hooks en tu <a href=\"https:\/\/www.unimedia.tech\/category\/technical-guides\/react-technical-guides\/\">aplicaci\u00f3n React<\/a>.<\/p>\n\n<p>Tambi\u00e9n te puede interesar: <a href=\"https:\/\/www.unimedia.tech\/2021\/08\/17\/stripe-checkout-integration-with-react\/\">&#8220;Integraci\u00f3n de Stripe Checkout con React&#8221;<\/a><\/p>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\">\u00bfQu\u00e9 son los ganchos de React?<\/h2>\n\n<p>React Hooks son funciones integradas que permiten utilizar el estado dentro de los componentes de la funci\u00f3n. Introducidos como APIs especiales en la versi\u00f3n React 16.8 lanzada en 2019, los Hooks te permitir\u00e1n &#8216;engancharte&#8217; a caracter\u00edsticas de React como los m\u00e9todos del ciclo de vida. Una proeza que antes s\u00f3lo era posible utilizando componentes de clase. <\/p>\n\n<p>Los React Hooks son incre\u00edblemente poderosos porque permiten a <a href=\"https:\/\/www.unimedia.tech\/software-development\/\">los desarrolladores de <\/a>React transformar componentes funcionales sin estado de s\u00f3lo renderizar UIs reutilizables a ser capaces de guardar y mantener el estado y la l\u00f3gica. Antes de eso, a <a href=\"https:\/\/www.unimedia.tech\/dedicated-development-teams\/\">los desarrolladores <\/a>les resultaba dif\u00edcil reutilizar la l\u00f3gica y compartir el estado entre componentes de clase sin utilizar abstracciones de reacci\u00f3n a\u00fan m\u00e1s complejas. React Hooks hizo posible extraer tanto la l\u00f3gica de estado entre los componentes. <\/p>\n\n<p>En resumen, estas son las ventajas que han obtenido los desarrolladores con la introducci\u00f3n de React Hooks. <\/p>\n\n<ul class=\"wp-block-list\"><li>Estructura de c\u00f3digo m\u00e1s sencilla que elimina las palabras clave &#8220;<strong>this&#8221; y &#8220;binds&#8221; <\/strong>.<\/li><\/ul>\n\n<ul class=\"wp-block-list\"><li>Es m\u00e1s f\u00e1cil reutilizar la l\u00f3gica y compartir el estado sin tener que lidiar con complejas abstracciones de React que son dif\u00edciles de probar y gestionar.<\/li><li>Es posible un flujo de datos unidireccional descendente m\u00e1s preciso sin alterar el orden de los componentes existentes. <\/li><li>Cuando se utilizan de forma \u00f3ptima, React Hooks puede ayudarte a prescindir de la necesidad de integrar una biblioteca de gesti\u00f3n de estados.<\/li><\/ul>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\">Ganchos React comunes<\/h2>\n\n<p>Hay varios tipos de ganchos de react incorporados. Incluso puede crear sus propios ganchos personalizados que contengan la l\u00f3gica funcional que desee y que podr\u00e1 reutilizar en distintos componentes. <\/p>\n\n<p><a href=\"https:\/\/reactjs.org\/blog\/2019\/02\/06\/react-v16.8.0.html\">La versi\u00f3n 16.8 de React<\/a> viene con diez ganchos integrados clasificados en dos categor\u00edas: ganchos b\u00e1sicos y ganchos adicionales. De estos hooks, examinaremos dos que son los m\u00e1s utilizados: useState y useEffect. <\/p>\n\n<h3 class=\"wp-block-heading\">Gancho React UseState<\/h3>\n\n<p>El gancho useState es el gancho m\u00e1s popular de React. Permite &#8220;utilizar el estado&#8221; en un componente de funci\u00f3n. Esto significa que puedes leer, manipular y actualizar el estado utilizando el gancho useState. <\/p>\n\n<p>A continuaci\u00f3n se muestra una representaci\u00f3n b\u00e1sica del gancho useState:<\/p>\n\n<pre class=\"wp-block-code\"><code>const &#91;state, setState] = useState(initialState);<\/code><\/pre>\n\n<p>Por ejemplo, el ejemplo anterior tiene un <em>estado<\/em> que es inicialmente el mismo valor que initialState <em>. <\/em>El<em> initialState <\/em>puede tomar un n\u00famero, cadena, o incluso una matriz en funci\u00f3n del tipo de datos a mano.<em> setState <\/em>es una funci\u00f3n que se utiliza para actualizar el valor del estado. Por ejemplo, setState(updatedState). <\/p>\n\n<p>Utilicemos el gancho useState en un componente sencillo y funcional. <\/p>\n\n<pre class=\"wp-block-code\"><code>function Age() {\n const &#91;age, setAge] = useState(10);\n \n return (\n     &lt;div&gt;\n         &lt;p&gt;I am {age} Years Old&lt;\/p&gt;\n       &lt;div&gt;\n          &lt;button onClick={() =&gt; setAge(age + 1)}&gt;Increase my age!      &lt;\/button&gt;\n          &lt;button onClick={() =&gt; setAge(age - 1)}&gt;Decrease my age! &lt;\/button&gt;\n       &lt;\/div&gt;\n     &lt;\/div&gt;\n )\n}<\/code><\/pre>\n\n<p>Expliquemos r\u00e1pidamente c\u00f3mo funciona el c\u00f3digo anterior:<\/p>\n\n<ul class=\"wp-block-list\"><li>Tenemos la versi\u00f3n b\u00e1sica del gancho:<\/li><\/ul>\n\n<pre class=\"wp-block-code\"><code>    const &#91;age, setAge] = useState(10);<\/code><\/pre>\n\n<p><em>age<\/em> tiene un estado inicial de 10 que luego llamamos entre la etiqueta &lt;p&gt;.<\/p>\n\n<ul class=\"wp-block-list\"><li>Los botones tienen un manejador onClick que llama a la funci\u00f3n <em>setAge<\/em>, que aumentar\u00e1 o disminuir\u00e1 nuestro estado de <em>edad <\/em>inicial dependiendo del bot\u00f3n pulsado. <\/li><\/ul>\n\n<p><img decoding=\"async\" src=\"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/k-mbbwn48r5oW3kMBQ7ZDaiXg1JQJv1fZSUxVW6I3fUtvDNWkxAO6s3wSWl_ssJLcDe8kgH-ew-bR7nASc0a4yl6OV_XBXbA1r4DpaAQFttKgidwr7iy_LNn0-h-XQWdSUT83w0ls0.gif\" style=\"width: 1024px\"\/><\/p>\n\n<h3 class=\"wp-block-heading\">Gancho React UseEffect<\/h3>\n\n<p>El gancho useEffect acepta una funci\u00f3n que se ejecuta despu\u00e9s de cada render. Se utiliza com\u00fanmente para realizar efectos secundarios. Esto puede abarcar desde la manipulaci\u00f3n del DOM o las API del navegador hasta la obtenci\u00f3n de datos de API externas. El hook useEffect tambi\u00e9n nos ayuda a conseguir capacidades en un componente de funci\u00f3n que antes realizaban los m\u00e9todos del ciclo de vida de React. Piense en el gancho useEffect como la combinaci\u00f3n de los <a href=\"https:\/\/reactjs.org\/docs\/state-and-lifecycle.html#adding-lifecycle-methods-to-a-class\">m\u00e9todos del ciclo de vida<\/a> <em>componentDidMount<\/em>, <em>componentDidUpdate<\/em> y <em>componentWillUnmount<\/em>. Adem\u00e1s, tambi\u00e9n podemos establecer el gancho useEffect para renderizar basado en cambios de valores espec\u00edficos.<\/p>\n\n<p>Esta es una versi\u00f3n b\u00e1sica del gancho useEffect.<\/p>\n\n<pre class=\"wp-block-code\"><code>useEffect(functionToRun);<\/code><\/pre>\n\n<p>Por ejemplo, utilicemos el gancho useEffect de forma m\u00e1s elaborada utilizando el ejemplo de componente funcional anterior.<\/p>\n\n<pre class=\"wp-block-code\"><code>function Age() {\n const &#91;age, setAge] = useState(10);\n \n useEffect(() =&gt; {\n   setAge(20)\n },&#91;]);\n \n return (\n   &lt;div&gt;\n     &lt;p&gt;I am {age} Years Old&lt;\/p&gt;\n     &lt;div&gt;\n       &lt;button onClick={() =&gt; setAge(age + 1)}&gt;\n         Increase my age!\n       &lt;\/button&gt;\n       &lt;button onClick={() =&gt; setAge(age - 1)}&gt;\n         Decrease my age!\n       &lt;\/button&gt;\n     &lt;\/div&gt;\n   &lt;\/div&gt;\n );\n}<\/code><\/pre>\n\n<p>El useEffect en render establece el nuevo valor de <em>edad<\/em> a 20. Tambi\u00e9n pasamos un array vac\u00edo que permitir\u00e1 que el hook useEffect se ejecute una sola vez.<\/p>\n\n<p><img decoding=\"async\" src=\"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/NIyYbkV8J0wmyo4kzsQ_6j7rxSUwyI46i1l3xDgF8kIeafeVLxd2XN_7PMh41vpWa-u5Y1DbCuJTVUhHBWlfnrcBNn5SiQcNLO53JGfd-1soB_ZPGzQxqx1RK__uwa2WGXDvdil6s0.gif\" style=\"width: 1024px\"\/><\/p>\n\n<p>He colocado un <em>console.<\/em> log en la pantalla de arriba. Podemos ver como el valor del estado <em>age <\/em>cambi\u00f3 del inicial 10 a 20, causado por el hook useEffect. A continuaci\u00f3n, veremos c\u00f3mo cambia el estado a medida que pulsamos el bot\u00f3n. <\/p>\n\n<p><\/p>\n\n<h3 class=\"wp-block-heading\">Otros ganchos de React<\/h3>\n\n<p>Tambi\u00e9n existen otros Hooks como useContext(), useMemo(), entre otros. Puedes echar un vistazo al resto en la <a href=\"https:\/\/reactjs.org\/docs\/hooks-reference.html\">documentaci\u00f3n oficial<\/a>.<\/p>\n\n<p>Hay, sin embargo, dos reglas que debes seguir cuando uses React Hooks. <\/p>\n\n<ul class=\"wp-block-list\"><li>Llame siempre a los ganchos en el nivel superior, como se muestra en los ejemplos que hemos utilizado. Esto significa que no podemos llamar a ganchos dentro de bucles, condiciones o funciones anidadas.<\/li><li>S\u00f3lo utilice Hooks desde dentro de los componentes de la funci\u00f3n React.<\/li><\/ul>\n\n<p>Muchos IDE de c\u00f3digo, como VSCode, tienen un linter incorporado que aplica estas reglas y otras m\u00e1s.<\/p>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\">Aplicaci\u00f3n para usuarios<\/h2>\n\n<p>Por \u00faltimo, vamos a crear una app m\u00e1s compleja usando todo lo que hemos aprendido sobre React, useState y useEffect Hooks. <\/p>\n\n<p>Obtendremos datos de una <a href=\"https:\/\/jsonplaceholder.typicode.com\/\">API externa con datos de usuarios falsos<\/a>. Como hemos aprendido, este es un caso de uso perfecto para el gancho useEffect.<\/p>\n\n<pre class=\"wp-block-code\"><code>function Users(){\n const &#91;users, setUsers] = useState(&#91;]);\n useEffect(() =&gt; {\n       fetch(\"https:\/\/jsonplaceholder.typicode.com\/users\/\")\n           .then(res =&gt; res.json())\n           .then(data =&gt; setUsers(data))\n     }, &#91;])\n \n return (\n     &lt;ul&gt;\n         {users.map(user =&gt; (\n         &lt;li key={user.id}&gt;\n             {user.name}lives in {user.address.city}\n         &lt;\/li&gt;\n         ))}\n     &lt;\/ul&gt;\n );\n}<\/code><\/pre>\n\n<p>En el ejemplo anterior, puedes ver c\u00f3mo hemos utilizado:<\/p>\n\n<ul class=\"wp-block-list\"><li>El gancho useState para establecer y actualizar el estado incluido dentro del gancho useEffect.<\/li><li>El hook useEffect interact\u00faa con la <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Fetch_API\">API del navegador llamada Fetch<\/a>, que nos permite extraer datos de APIs externas. Tambi\u00e9n pasamos un array vac\u00edo para asegurarnos de que se ejecuta una vez.<\/li><\/ul>\n\n<figure class=\"wp-block-video\"><video controls=\"\" src=\"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2021\/09\/Users_Reactapp_with_Hooks.mp4\"><\/video><\/figure>\n\n<p>De nuevo en el v\u00eddeo de arriba, he colocado un <em>console.<\/em> log para que puedas ver c\u00f3mo sacamos datos espec\u00edficos para mostrar. <\/p>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\">Resumen<\/h2>\n\n<p>Nos divertimos. Los React Hooks son realmente poderosos cuando se usan correctamente. En conclusi\u00f3n, hemos aprendido qu\u00e9 son los React Hooks y los inmensos beneficios que aportan a los desarrolladores. Adem\u00e1s, tambi\u00e9n hemos examinado brevemente los distintos tipos de ganchos y las normas que rigen su uso. Por \u00faltimo, hemos creado una sencilla aplicaci\u00f3n React que demuestra c\u00f3mo utilizar los hooks useState y useEffect.<\/p>\n\n<p>Si te sientes aventurero y quieres construir m\u00e1s aplicaciones con ganchos React, echa un vistazo a nuestro art\u00edculo <a href=\"https:\/\/www.unimedia.tech\/2021\/08\/17\/stripe-checkout-integration-with-react\/\">Integraci\u00f3n de Stripe Checkout con React<\/a>.<\/p>\n\n<p><\/p>\n\n<h2 class=\"wp-block-heading\">Unimedia Technology<\/h2>\n\n<p>En <a href=\"https:\/\/www.unimedia.tech\/\">Unimedia Technology<\/a> contamos con un equipo de<strong> desarrolladores Re<\/strong> act que pueden ayudarle a desarrollar sus aplicaciones React m\u00e1s complejas.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Los React Hooks son funciones React incorporadas que permiten a los desarrolladores gestionar el estado y realizar acciones l\u00f3gicas en un componente de funci\u00f3n React.<\/p>\n","protected":false},"author":6,"featured_media":6662,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[215,220],"tags":[],"class_list":["post-7231","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-react-technical-guides-es","category-technical-guides-es"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v21.6 (Yoast SEO v27.1.1) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Introducci\u00f3n r\u00e1pida a los ganchos de React - Unimedia Technology<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Introducci\u00f3n r\u00e1pida a los ganchos de React\" \/>\n<meta property=\"og:description\" content=\"Los React Hooks son funciones React incorporadas que permiten a los desarrolladores gestionar el estado y realizar acciones l\u00f3gicas en un componente de funci\u00f3n React.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/\" \/>\n<meta property=\"og:site_name\" content=\"Unimedia Technology\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.linkedin.com\/company\/unimedia-technology\/\" \/>\n<meta property=\"article:published_time\" content=\"2021-09-12T16:45:23+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-01-09T13:07:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/4-1-4.png\" \/>\n\t<meta property=\"og:image:width\" content=\"700\" \/>\n\t<meta property=\"og:image:height\" content=\"400\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Unimedia\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@UnimediaCTO\" \/>\n<meta name=\"twitter:site\" content=\"@UnimediaCTO\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Unimedia\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutos\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Introducci\u00f3n r\u00e1pida a los ganchos de React - Unimedia Technology","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:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/","og_locale":"es_ES","og_type":"article","og_title":"Introducci\u00f3n r\u00e1pida a los ganchos de React","og_description":"Los React Hooks son funciones React incorporadas que permiten a los desarrolladores gestionar el estado y realizar acciones l\u00f3gicas en un componente de funci\u00f3n React.","og_url":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/","og_site_name":"Unimedia Technology","article_publisher":"https:\/\/www.linkedin.com\/company\/unimedia-technology\/","article_published_time":"2021-09-12T16:45:23+00:00","article_modified_time":"2024-01-09T13:07:39+00:00","og_image":[{"width":700,"height":400,"url":"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/4-1-4.png","type":"image\/png"}],"author":"Unimedia","twitter_card":"summary_large_image","twitter_creator":"@UnimediaCTO","twitter_site":"@UnimediaCTO","twitter_misc":{"Escrito por":"Unimedia","Tiempo de lectura":"7 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/#article","isPartOf":{"@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/"},"author":{"name":"Unimedia","@id":"https:\/\/www.unimedia.tech\/es\/#\/schema\/person\/3a250aa22526d5c9ff6bc95bb380a5dd"},"headline":"Introducci\u00f3n r\u00e1pida a los ganchos de React","datePublished":"2021-09-12T16:45:23+00:00","dateModified":"2024-01-09T13:07:39+00:00","mainEntityOfPage":{"@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/"},"wordCount":1130,"commentCount":0,"publisher":{"@id":"https:\/\/www.unimedia.tech\/es\/#organization"},"image":{"@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/#primaryimage"},"thumbnailUrl":"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/4-1-4.png","articleSection":["React","Technical Guides"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/","url":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/","name":"Introducci\u00f3n r\u00e1pida a los ganchos de React - Unimedia Technology","isPartOf":{"@id":"https:\/\/www.unimedia.tech\/es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/#primaryimage"},"image":{"@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/#primaryimage"},"thumbnailUrl":"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/4-1-4.png","datePublished":"2021-09-12T16:45:23+00:00","dateModified":"2024-01-09T13:07:39+00:00","breadcrumb":{"@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/#primaryimage","url":"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/4-1-4.png","contentUrl":"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/4-1-4.png","width":700,"height":400,"caption":"react unimedia"},{"@type":"BreadcrumbList","@id":"https:\/\/www.unimedia.tech\/es\/a-quick-introduction-to-react-hooks\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.unimedia.tech\/es\/"},{"@type":"ListItem","position":2,"name":"Introducci\u00f3n r\u00e1pida a los ganchos de React"}]},{"@type":"WebSite","@id":"https:\/\/www.unimedia.tech\/es\/#website","url":"https:\/\/www.unimedia.tech\/es\/","name":"Unimedia Technology","description":"Your software development partner","publisher":{"@id":"https:\/\/www.unimedia.tech\/es\/#organization"},"alternateName":"Unimedia Tech","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.unimedia.tech\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/www.unimedia.tech\/es\/#organization","name":"Unimedia Technology","alternateName":"Unimedia Tech","url":"https:\/\/www.unimedia.tech\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.unimedia.tech\/es\/#\/schema\/logo\/image\/","url":"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/cloud_border-3.png","contentUrl":"https:\/\/www.unimedia.tech\/wp-content\/uploads\/2023\/12\/cloud_border-3.png","width":403,"height":309,"caption":"Unimedia Technology"},"image":{"@id":"https:\/\/www.unimedia.tech\/es\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.linkedin.com\/company\/unimedia-technology\/","https:\/\/x.com\/UnimediaCTO","https:\/\/www.instagram.com\/unimedia.technology\/"]},{"@type":"Person","@id":"https:\/\/www.unimedia.tech\/es\/#\/schema\/person\/3a250aa22526d5c9ff6bc95bb380a5dd","name":"Unimedia","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.unimedia.tech\/es\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/5901fd1c4628e2b48ffd4e47324e8fe0751b39e556a167f078471d4c4bec0f6f?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/5901fd1c4628e2b48ffd4e47324e8fe0751b39e556a167f078471d4c4bec0f6f?s=96&d=mm&r=g","caption":"Unimedia"}}]}},"_links":{"self":[{"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/posts\/7231","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/comments?post=7231"}],"version-history":[{"count":0,"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/posts\/7231\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/media\/6662"}],"wp:attachment":[{"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/media?parent=7231"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/categories?post=7231"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.unimedia.tech\/es\/wp-json\/wp\/v2\/tags?post=7231"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}