db.json

{
  "technologies": [
    {
      "id": "00001",
      "name": "JavaScript",
      "foundedIn": 1995,
      "inventedBy": "Brendan Eich",
      "category": "programming language",
      "description": "JavaScript (JS) es un lenguaje de programación ligero, interpretado, o compilado justo-a-tiempo (just-in-time) con funciones de primera clase. Si bien es más conocido como un lenguaje de scripting (secuencias de comandos) para páginas web, y es usado en muchos entornos fuera del navegador, tal como Node.js, Apache CouchDB y Adobe Acrobat JavaScript es un lenguaje de programación basada en prototipos, multiparadigma, de un solo hilo, dinámico, con soporte para programación orientada a objetos, imperativa y declarativa (por ejemplo programación funcional)."
    },
    {
      "id": "00002",
      "name": "HTML",
      "foundedIn": 1991,
      "inventedBy": "Tim Berners-Lee",
      "category": "markup language",
      "description": "HTML (Lenguaje de Marcas de Hipertexto, del inglés HyperText Markup Language) es el componente más básico de la Web. Define el significado y la estructura del contenido web. Además de HTML, generalmente se utilizan otras tecnologías para describir la apariencia/presentación de una página web (CSS) o la funcionalidad/comportamiento (JavaScript). Hipertexto hace referencia a los enlaces que conectan páginas web entre sí, ya sea dentro de un único sitio web o entre sitios web. Los enlaces son un aspecto fundamental de la Web. Al subir contenido a Internet y vincularlo a las páginas creadas por otras personas, te conviertes en un participante activo en la «World Wide Web» (Red Informática Mundial). HTML utiliza marcas para etiquetar texto, imágenes y otro contenido para mostrarlo en un navegador Web."
    },
    {
      "id": "00003",
      "name": "CSS",
      "foundedIn": 1996,
      "inventedBy": "Håkon Wium Lie",
      "category": "stylesheet language",
      "description": "Hojas de Estilo en Cascada (del inglés Cascading Style Sheets) o CSS es el lenguaje de estilos utilizado para describir la presentación de documentos HTML o XML (incluyendo varios lenguajes basados en XML como SVG, MathML o XHTML). CSS describe cómo debe ser renderizado el elemento estructurado en la pantalla, en papel, en el habla o en otros medios. CSS es uno de los lenguajes base de la Open Web y posee una especificación estandarizada por parte del W3C. Anteriormente , el desarrollo de varias partes de las especificaciones de CSS era realizado de manera sincrónica, lo que permitía el versionado de las recomendaciones. Probablemente habrás escuchado acerca de CSS1, CSS2.1, CSS3. Sin embargo, CSS4 nunca se ha lanzado como una versión oficial. Desde CSS3, el alcance de las especificaciones se incrementó de forma significativa y el progreso de los diferentes módulos de CSS comenzó a mostrar varias diferencias, lo que hizo más efectivo desarrollar y publicar recomendaciones separadas por módulos. En vez de versionar las especificaciones de CSS, la W3C actualmente realiza una captura de las últimas especificaciones estables de CSS."
    },
    {
      "id": "00004",
      "name": "React",
      "foundedIn": 2013,
      "inventedBy": "Jordan Walke",
      "category": "JavaScript Library",
      "description": "Como su eslogan oficial señala, React es una biblioteca para construir interfaces de usuario. React no es un framework — ni siquiera se limita a la web. React es utilizado con otras bibliotecas para renderizar en ciertos entornos. Por ejemplo, React Native puede usarse para desarrollar aplicaciones móviles; React 360 permite crear aplicaciones de realidad virtual; además de otras posibilidades. Al desarrollar para la web, los desarrolladores usan React en conjunto con ReactDOM. React y ReactDOM son, a menudo, considerados al igual que —y utilizados para resolver los mismo problemas que— otros verdaderos frameworks de desarrollo web. Cuando nos referimos a React como un framework, estamos trabajando con este significado coloquial. El objetivo principal de React es minimizar los errores que ocurren cuando los desarrolladores construyen interfaces de usuario. Esto lo hace mediante el uso de componentes — piezas de código lógicas y auto-contenidas que describen una parte de la interfaz del usuario. Estos componentes se pueden juntar para crear una interfaz de usuario completa, y React abstrae la mayor parte del trabajo de renderizado, permitiéndote enfocarte en el diseño de la interfaz."
    }
  ],
  "flipCards": [
    {
      "id": "f01",
      "title": "console.log()",
      "resume": "método de JavaScript que se utiliza para imprimir mensajes o valores en la consola del navegador, lo que ayuda en la depuración del código.",
      "description": "Muestra un mensaje en la consola web (o del intérprete JavaScript). console.log() es uno de los métodos más comunes de la API console en JavaScript. Sirve principalmente para imprimir mensajes o valores en la consola del navegador o del entorno de desarrollo. Es una herramienta crucial para la depuración del código, ya que permite a los desarrolladores ver el valor de las variables, el estado de la aplicación o los resultados de las operaciones sin necesidad de interrumpir el flujo del programa.",
      "officialDoc": "https://developer.mozilla.org/es/docs/Web/API/console/log_static",
      "technologyId": "00001",
      "imgUrl": "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
      "flipCount": 25
    },
    {
      "id": "f02",
      "title": ".split()",
      "resume": "método de JavaScript que divide una cadena en un arreglo de subcadenas usando un separador especificado.",
      "description": "El método .split() en JavaScript pertenece al prototipo de cadenas (String.prototype) y se utiliza para dividir una cadena en un arreglo de subcadenas, separándola según un patrón especificado (separador). Es útil para manipular texto, como separar palabras, extraer valores de una lista o procesar datos.",
      "officialDoc": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split",
      "technologyId": "00001",
      "imgUrl": "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
      "flipCount": 8
    },
    {
      "id": "f03",
      "title": "<div>",
      "resume": "elemento HTML usado como contenedor genérico para agrupar contenido y estructurar páginas web.",
      "description": "El elemento <div> (abreviatura de division) es un contenedor genérico en HTML que no tiene un significado semántico propio. Se utiliza principalmente para agrupar otros elementos y aplicar estilos o scripts específicos.",
      "officialDoc": "https://developer.mozilla.org/es/docs/Web/HTML/Element/div",
      "technologyId": "00002",
      "flipCount": 8
    },
    {
      "title": "<form>",
      "resume": "Elemento HTML que permite crear formularios para recopilar y enviar datos al servidor. texto añadido para prueba",
      "description": "El elemento <form> en HTML se utiliza para crear formularios interactivos que los usuarios pueden rellenar y enviar. Es esencial para la comunicación entre el cliente y el servidor en aplicaciones web. texto añadido para prubea",
      "officialDoc": "https://developer.mozilla.org/es/docs/Web/HTML/Element/form",
      "technologyId": "00002",
      "imgUrl": "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
      "flipCount": 11,
      "id": "f04"
    },
    {
      "id": "f05",
      "title": "filter",
      "resume": "La propiedad filter en CSS aplica efectos visuales como desenfoque, brillo o saturación a elementos HTML.",
      "description": "La propiedad filter en CSS permite modificar la apariencia de un elemento aplicando efectos gráficos, como sombras, desenfoque, escalas de grises y mucho más. Es una herramienta poderosa para mejorar la estética de una página sin necesidad de editar imágenes externas.",
      "officialDoc": "https://developer.mozilla.org/es/docs/Web/CSS/filter",
      "technologyId": "00003",
      "imgUrl": "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
      "flipCount": 2
    },
    {
      "id": "f06",
      "title": "useState",
      "resume": "Hook para manejar estados en componentes funcionales.",
      "description": "El hook `useState` permite agregar y gestionar estados locales en componentes funcionales de React. Retorna un array con dos valores: el estado actual y una función para actualizarlo. Se usa comúnmente para manejar datos dinámicos como inputs, contadores o datos de una API.",
      "officialDoc": "https://react.dev/reference/react/useState",
      "technologyId": "00004",
      "imgUrl": "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
      "flipCount": 3
    },
    {
      "id": "f07",
      "title": "useEffect",
      "resume": "Hook para manejar efectos secundarios en componentes.",
      "description": "El hook `useEffect` permite ejecutar código como respuesta a cambios en el ciclo de vida del componente. Puede usarse para realizar operaciones como llamadas a APIs, suscripciones a eventos o modificar el DOM. Admite dependencias para controlar cuándo se ejecuta.",
      "officialDoc": "https://react.dev/reference/react/useEffect",
      "technologyId": "00004",
      "imgUrl": "https://developers.elementor.com/docs/assets/img/elementor-placeholder-image.png",
      "flipCount": 3
    },
    {
      "title": ".push( )",
      "resume": "agrega un nuevo elemento (o varios elementos) al final de la matriz especificada",
      "description": "El método push es muy práctico para añadir valores a un array.  push es genérico intencionadamente. Este método puede ser call() o apply() a objetos que representen arrays. El método push depende de la propiedad length para decidir donde empezar a insertar los valores dados. Si el valor de la propiedad length no puede ser convertido en numérico, el índice 0 es usado. Esto permite la posibilidad de que la propiedad length sea inexistente, y en este caso length será creado.  Los únicos objetos nativos que se asemejen al array son strings objetos, aunque estos no se puedan usar en la aplicación de este método ya que son inmutables.",
      "officialDoc": "https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/push",
      "technologyId": "00001",
      "imgUrl": "",
      "flipCount": 3,
      "id": "NouQfr5"
    },
    {
      "title": ".unshift( )",
      "resume": "agrega un nuevo elemento (o varios elementos) al comienzo de la matriz especificada.",
      "description": "El método unshift inserta los valores proporcionados al inicio de un objeto del tipo array.  unshift es intencionalmente genérico; este método puede ser called o applied a objetos similares a arrays. Objetos que no contengan una propiedad length reflejando una serie de propiedades numéricas consecutivas, comenzada a partir del cero, pueden no comportarse de una manera comprensible.",
      "officialDoc": "https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift",
      "technologyId": "00001",
      "imgUrl": "",
      "flipCount": 3,
      "id": "PDWBvZN"
    },
    {
      "title": "<span>",
      "resume": "contenedor genérico en línea para texto",
      "description": "No tiene ningún significado semántico más allá de \"Oye, este texto es especial y voy a cambiarlo de alguna manera\".",
      "officialDoc": "https://developer.mozilla.org/es/docs/Web/HTML/Element/span",
      "technologyId": "00002",
      "imgUrl": "",
      "flipCount": 2,
      "id": "7D7jZev"
    },
    {
      "title": "DOM",
      "resume": "forma en que el navegador lee el documento HTML",
      "description": "El DOM (Document Object Model, en español Modelo de Objetos del Documento) es una API definida para representar e interactuar con cualquier documento HTML o XML. El DOM es un modelo de documento que se carga en el navegador web y que representa el documento como un árbol de nodos, en donde cada nodo representa una parte del documento (puede tratarse de un elemento, una cadena de texto o un comentario).  El DOM es una de las APIs más usadas en la Web, pues permite ejecutar código en el navegador para acceder e interactuar con cualquier nodo del documento. Estos nodos pueden crearse, moverse o modificarse. Pueden añadirse a estos nodos manejadores de eventos (event listeners en inglés) que se ejecutarán/activarán cuando ocurra el evento indicado en este manejador.  El DOM surgió a partir de la implementación de JavaScript en los navegadores. A esta primera versión también se la conoce como DOM 0 o \"Legacy DOM\". Hoy en día el grupo WHATWG es el encargado de actualizar el estándar de DOM.",
      "officialDoc": "https://developer.mozilla.org/es/docs/Glossary/DOM",
      "technologyId": "00002",
      "imgUrl": "",
      "flipCount": 2,
      "id": "gn73XTW"
    },
    {
      "title": "Flexbox",
      "resume": "organiza, alinea y reorganiza automáticamente el contenido de acuerdo con los cambios de ancho y alto del dispositivo mientras aún conserva las proporciones que ha escrito en su código",
      "description": "Flexbox es un método de diseño de página unidimensional para compaginar elementos en filas o columnas. Los elementos de contenido se ensanchan para rellenar el espacio adicional y se encogen para caber en espacios más pequeños. En este artículo expondremos todas sus características básicas. Durante mucho tiempo, las únicas herramientas fiables con compatibilidad cruzada entre navegadores disponibles para crear diseños CSS fueron cosas como la flotación y el posicionamiento. Están bien y funcionan, pero de alguna manera también limitan bastante y frustran.  Con tales herramientas resulta difícil, si no imposible, lograr obtener en cualquier forma conveniente y flexible un diseño de página sencillo con unos requisitos como los siguientes:  Centrar verticalmente un bloque de contenido dentro de su elemento padre. Hacer que todos los elementos secundarios de un contenedor ocupen una cantidad igual del ancho/alto disponible, independientemente del ancho/alto que haya disponible. Hacer que todas las columnas en una compaginación en columnas múltiples adopten la misma altura incluso si contienen cantidades diferentes de contenido. Como verás en las secciones siguientes, los elementos flexbox facilitan mucho algunas tareas de compaginación.",
      "officialDoc": "https://developer.mozilla.org/es/docs/Learn/CSS/CSS_layout/Flexbox",
      "technologyId": "00003",
      "imgUrl": "",
      "flipCount": 2,
      "id": "mnr4Yqn"
    },
    {
      "title": "<aside>",
      "resume": "parte de una página web, donde su contenido no está directamente relacionado con el contenido principal que se muestra en la página",
      "description": "El elemento HTML <aside> representa una sección de una página que consiste en contenido que está indirectamente relacionado con el contenido principal del documento. Estas secciones son a menudo representadas como barras laterales o como inserciones y contienen una explicación al margen como una definición de glosario, elementos relacionados indirectamente, como publicidad, la biografía del autor, o en aplicaciones web, la información de perfil o enlaces a blogs relacionados.",
      "officialDoc": "https://developer.mozilla.org/es/docs/Web/HTML/Element/aside",
      "technologyId": "00002",
      "imgUrl": "",
      "flipCount": 2,
      "id": "l-9yc1U"
    }
  ]
}