<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0" xmlns:cc="http://cyber.law.harvard.edu/rss/creativeCommonsRssModule.html">
    <channel>
        <title><![CDATA[Stories by Nataly García on Medium]]></title>
        <description><![CDATA[Stories by Nataly García on Medium]]></description>
        <link>https://medium.com/@natalygaol?source=rss-48a768bcd40b------2</link>
        <image>
            <url>https://cdn-images-1.medium.com/fit/c/150/150/0*SOT3MfizDFbR2gqj</url>
            <title>Stories by Nataly García on Medium</title>
            <link>https://medium.com/@natalygaol?source=rss-48a768bcd40b------2</link>
        </image>
        <generator>Medium</generator>
        <lastBuildDate>Sun, 15 Nov 2026 10:25:44 GMT</lastBuildDate>
        <atom:link href="https://medium.com/@natalygaol/feed" rel="self" type="application/rss+xml"/>
        <webMaster><![CDATA[yourfriends@medium.com]]></webMaster>
        <atom:link href="http://medium.superfeedr.com/" rel="hub"/>
        <item>
            <title><![CDATA[COMPUTER GIRLS]]></title>
            <link>https://medium.com/@natalygaol/computer-girls-9fa1e38fcaa9?source=rss-48a768bcd40b------2</link>
            <guid isPermaLink="false">https://medium.com/p/9fa1e38fcaa9</guid>
            <dc:creator><![CDATA[Nataly García]]></dc:creator>
            <pubDate>Tue, 15 Oct 2024 20:05:58 GMT</pubDate>
            <atom:updated>2024-10-15T20:05:58.526Z</atom:updated>
            <content:encoded><![CDATA[<p>Quite retro but fascinating — and absolutely motivating to understand this context: In the 1960s, while the world saw women in limited roles, pioneers like Ann Richardson were breaking barriers in technology and programming 💻. This article reminds us that women have always belonged in the tech world.</p><p><a href="https://www.siliconrepublic.com/people/women-in-technology-the-computer-girls-cosmopolitan">https://www.siliconrepublic.com/people/women-in-technology-the-computer-girls-cosmopolitan</a></p><p>Let’s summarize the article👇:</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*wX780ScErcLKkbLaiHb3hw.png" /></figure><p>Let’s go, Computer Girls! 🚀 Let’s go!</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=9fa1e38fcaa9" width="1" height="1" alt="">]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Elasticsearch Visualizado: Conceptos Clave con Dibujos y Gráficos]]></title>
            <link>https://medium.com/@natalygaol/elasticsearch-visualizado-conceptos-clave-con-dibujos-y-gr%C3%A1ficos-5affdb07ebdd?source=rss-48a768bcd40b------2</link>
            <guid isPermaLink="false">https://medium.com/p/5affdb07ebdd</guid>
            <dc:creator><![CDATA[Nataly García]]></dc:creator>
            <pubDate>Mon, 07 Oct 2024 04:21:29 GMT</pubDate>
            <atom:updated>2024-10-13T23:50:38.413Z</atom:updated>
            <content:encoded><![CDATA[<p>Elasticsearch es un almacén de datos distribuido, NoSQL y basado en JSON capaz de manejar grandes volúmenes de datos. Desde ahora para fines prácticos lo vamos a denominar ES.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*N-i0c1xJ7LWiMfotwguN0w.png" /><figcaption>Este es un resumen general de ES para tener un panorama completo del asunto</figcaption></figure><h3><strong><em>Características:</em></strong></h3><ul><li><em>ES</em> usa documentos JSON y es ideal para trabajar con datos basados en JSON. La interacción con ES se realiza a través de una API RESTful, que permite realizar consultas a través de URL REST.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/248/1*2h6Hv8ixOfeU3xgbKoLh3A.png" /><figcaption>Breve resumen de las características a.i</figcaption></figure><h3>Comparación con bases de datos relacionales:</h3><ul><li>A diferencia de las bases de datos relacionales, en las que los datos se organizan en bases de datos y tablas, <em>ES</em> utiliza índices para almacenar los datos.</li><li>En lugar de filas y columnas, los datos se representan como documentos y campos, respectivamente.</li><li>Comprender estos paralelismos ayuda en la transición de sistemas de bases de datos relacionales tradicionales como MySQL o PostgreSQL a ES.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/284/1*WuAHpmhkOrQrBcCz-JIvKw.png" /><figcaption>Comparativo RDMS vs ES</figcaption></figure><p>Dado este resumen comparativo, pasemos a un ejemplo más visual que nos ayude a cementar los conceptos.</p><p>La unidad de información más simple en ES es el documento, representado como un archivo JSON. Los documentos forman índices, que son colecciones de documentos relacionados, como un «índice de aves» que contiene diferentes razas de aves.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/431/1*btNKvRxXQ1M4rPSNI3zoCw.png" /></figure><h3><strong><em>¿Qué son los cluster y los nodos en ES?</em></strong></h3><p><em>ES</em> funciona con clústeres y nodos, donde los clústeres son grupos de nodos (máquinas) que facilitan la comunicación y el almacenamiento de datos entre varios nodos para gestionar mayores volúmenes de documentos mediante el escalado horizontal.</p><p>Un cluster consta de varios nodos, cada uno con fragmentos primarios (P) y réplicas (R).</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/809/1*mEb1k5UMR-63sTGHcQNWTw.png" /><figcaption>Este es un ejemplo muy simple de la representación, con escalado horizontal.</figcaption></figure><h3><strong><em>¿Qué son los shards en ES?</em></strong></h3><p>Un <strong>shard</strong> en Elasticsearch es una subdivisión de un índice. Cada índice se divide en múltiples shards para distribuir los datos y las solicitudes de búsqueda a través de varios nodos en un cluster.</p><p>Existen dos tipos de shards: <strong>primarios </strong>(En la imagen tenemos P0,P1 y P2), que almacenan los datos originales, y <strong>réplicas</strong>(En la imagen tenemos R2,R0 Y R1), que son copias de los shards primarios y proporcionan redundancia en caso de fallos de nodos.</p><h3><strong><em>¿A qu</em>é<em> fallos de nodos te refieres?</em></strong></h3><p>Si un nodo falla debido a diversas razones (por ejemplo, desastres naturales, brechas de seguridad),<strong> las réplicas</strong> (copias de fragmentos) en diferentes nodos proporcionan una copia de seguridad, lo que permite la recuperación de la información.</p><p>¡Nunca se sabe cuándo vendrá el apocalipsis zombie en TEC! 🧟‍♂️ Así que, como buenos nerd scouts, estamos siempre listos 🤓🕶️.</p><h3><strong><em>¿C</em></strong>ó<strong><em>mo el sharding mejora el performance de las b</em></strong>ú<strong><em>squedas en ES?</em></strong></h3><p>Al permitir que ocurra simultáneamente en varios nodos.</p><p><strong><em>ok </em></strong>😵‍💫<strong><em>, en cristiano, ¿A qu</em>é<em> me refiero?</em></strong></p><p>El sharding, como se muestra en la imagen, distribuye los datos de un índice entre varios nodos (Node-1, Node-2, Node-3).</p><ol><li><strong>Paralelización de Consultas</strong>: Al distribuir los datos, <em>las búsquedas se ejecutan en paralelo en cada shard</em>, reduciendo el tiempo total de respuesta.</li><li><strong>Balanceo de Carga</strong>: Cada nodo maneja solo una parte de la búsqueda, evitando que un solo nodo se sature con todas las consultas.</li></ol><p>En este ejemplo, recordemos que nuestros shards primarios serían P0, P1 y P2.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/543/1*05vcAiQ5pQmFEkc0vDGi6g.png" /></figure><p>Entonces, imaginemos que tenemos 1,000,000 de documentos (a.k.a Rows) y que al inicio sólo contábamos con 1 para procesar todo. 😱</p><p>Con sharding, en este ejemplo: dividimos un índice de un millón de documentos en tres nodos, cada uno almacenando un tercio. Antes, una búsqueda tomaba 10 segundos; con sharding, el tiempo se reduce a un tercio, ya que los tres nodos buscan en paralelo.</p><p><strong><em>Pero </em></strong>¡<strong><em>quejesto</em></strong>!<strong><em> ¿Es magia? </em></strong>🔮</p><p>No… ¡es sharding!</p><p>Mic drop 🎤💥</p><p>Nota: Como no vivimos en el mundo de la pantera rosa, la elección del número de shards por índice requiere un análisis cuidadoso, ya que afecta por ejemplo a los costos (memoria, CPU, almacenamiento), etc.</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=5affdb07ebdd" width="1" height="1" alt="">]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Flujo Integral de una Aplicación con RoR, React y GraphQL]]></title>
            <link>https://medium.com/@natalygaol/flujo-integral-de-una-aplicaci%C3%B3n-con-ror-react-y-graphql-c61b22cd8dd1?source=rss-48a768bcd40b------2</link>
            <guid isPermaLink="false">https://medium.com/p/c61b22cd8dd1</guid>
            <category><![CDATA[ruby-on-rails-development]]></category>
            <category><![CDATA[graphql]]></category>
            <category><![CDATA[react]]></category>
            <dc:creator><![CDATA[Nataly García]]></dc:creator>
            <pubDate>Sat, 10 Feb 2024 02:25:56 GMT</pubDate>
            <atom:updated>2024-02-10T02:34:49.363Z</atom:updated>
            <content:encoded><![CDATA[<h3><strong>Objetivo:</strong></h3><p>En este ejercicio, nos enfocaremos en activar un Widget de encuesta cuando un usuario haya leído al menos tres reportes que contienen palabras clave específicas. Aunque ya hemos trabajado previamente con este Widget, esta será la primera vez que modifiquemos su comportamiento. Este desafío nos invita a reflexionar y considerar cuidadosamente cómo abordar el desarrollo, manteniendo un enfoque innovador y adaptativo.</p><h3>Desarrollo:</h3><p>¿Qué debemos considerar ?</p><h4>Paso 1: Revisión y Persistencia de Datos</h4><p>Para registrar la cantidad de reportes leídos por un usuario, hemos decidido añadir un atributo metadata de tipo JSON al modelo User. El key userReportsViewed se incorporará dentro de este atributo, permitiendo una gestión de datos flexible y estructurada. Esta elección nos evita tener que modificar la estructura de la base de datos con nuevas migraciones para cada tipo de dato que deseamos incorporar, facilitando así la adaptación a nuevas características y la recolección de feedback de los usuarios mediante encuestas. De esta manera, cada par key/value nuevo podría ser útil para cada encuesta de las funcionalidades futuras.</p><h4>Paso 2: Actualización de Datos en GraphQL</h4><p>Para la actualización de los datos, empleamos GraphQL, específicamente un archivo de <strong><em>mutaciones para las operaciones de creación, actualización y eliminación</em></strong><em>.</em> Dentro del contexto de nuestro modelo User, utilizaremos user_mutation.rb.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/624/1*RcR35fhrsy8X2yh_TPsALw.png" /><figcaption>Paso Nº1 del flujo de GraphQL/Mutaciones</figcaption></figure><p>a) <strong>Declaración de Datos</strong>: Primero, definimos el tipo de datos con los que trabajaremos, <em>optando por no exponer los IDs por razones de seguridad y eligiendo, en su lugar, trabajar con las keys de los usuarios.</em></p><figure><img alt="" src="https://cdn-images-1.medium.com/max/628/1*vPXll4BJ9OSMyFtzhr-Ltg.png" /><figcaption>Declaramos los datos con los que vamos a trabajar</figcaption></figure><p>b) <strong>Implementación del <em>Método Resolve</em></strong>: A continuación, implementamos el método resolve, la estructura/estrategia facilita la adición de nuevos operadores o la modificación de la lógica existente sin cambios significativos en el diseño general del método.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/657/1*4Rsgenf4-9nzD5tJnQiqnA.png" /><figcaption>Primera iteración de la implementación (primero que funcione :P, luego haremos <strong>Refactorizació</strong>n, que por motivos de privacidad no podré postear, sin embargo la idea principal está en el primer draft)</figcaption></figure><p>c) <strong>Declaración de la Nueva Mutación</strong>: Introducimos una nueva mutación denominada UpdateUserMetadataMutation y la declaramos en MutationType.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/527/1*ini3VVPYitTu2Ra80ZeHWg.png" /><figcaption>Ubicación del archivo</figcaption></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/775/1*mW3xxtT8MuJUUkCcqzy9ZA.png" /><figcaption>Declaración de la mutación recién creada</figcaption></figure><p>d) <strong>Integración en Queries de JS</strong>: Agregamos el metadata dentro de nuestras queries de JavaScript, anidadas dentro de otro modelo (Por privacidad no daremos detalles específicos de esto)</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/526/1*kiaZz4pFECF3BF60W1z8eg.png" /><figcaption>Agregamos el nuevo atributo</figcaption></figure><p>e) <strong>Exportación de la Mutación</strong>: Finalmente, exportamos nuestra mutación especificando el tipo de dato deseado y el resultado esperado del response de la petición en el frontend, como el status y el value.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/630/1*ASu2jo8MDgK9XhSdDOF8Ag.png" /><figcaption>Detalle de la mutación que vamos a exportar</figcaption></figure><p>3) Ahora sí, antes de implementar la petición en la vista de react, debemos importar la mutación de nuestra ruta.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/518/1*frtvssI3zMa4RTnnYsMBJQ.png" /><figcaption>Sintaxis de importación de un GraphQL</figcaption></figure><h4>Paso 3: Implementación en la Vista de React</h4><p>Creamos un método llamado updateViewedReports, empleando todo lo desarrollado en los pasos anteriores. Este proceso se resume en una imagen adjunta para proporcionar una visión clara del flujo.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*EljpxoIhvQoKMCZpNN77fg.png" /><figcaption>Disclaimer: Hemos cambiado algunos datos por temas de privacidad</figcaption></figure><blockquote><em>Cabe recalcar, que hay otros “detalles” que intervienen en el proceso, sin embargo el objetivo principal de este artículo es detallar el paso a paso de como seguir un flujo de una aplicación que se comunica con Ruby on Rails, GraphQL y React.</em></blockquote><p><strong><em>Nota:</em></strong><em> Para los diagramas, utilicé una herramienta denominada Excalidraw. En mi caso, necesito dibujar para poder retener la información y comprender cómo se interconecta todo dentro del flujo.</em></p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=c61b22cd8dd1" width="1" height="1" alt="">]]></content:encoded>
        </item>
    </channel>
</rss>