Artículos sobre herramientas, patrones, diseños y estrategias que uso todos los días como desarrollador de software.

Tipos condicionales con Typescript y Zod

Aprende a usar tipos condicionales con Typescript y Zod para validar datos en tu aplicación. Hay veces que dos tipos de datos tienen propiedades en común. En estos casos, es conveniente saber cómo validarlos de forma dinámica y sin repetir código. En este artículo aprenderás a hacerlo con Typescript y Zod.

Frontend
Backend

¿Cómo funcionan los Closures en Javascript Internamente?

Explora los closures en JavaScript y descubre su funcionamiento interno. Aprende cómo estas poderosas estructuras permiten el almacenamiento persistente de variables aún cuando pareciera que ya no existen. Después de leer este artículo entenderás cómo funcionan los closures en Javascript y cómo puedes utilizarlos en tus proyectos.

Frontend
Backend

'Optimistic Updates' con Tanstack Query: Mejora la Experiencia del Usuario

Descubre el poder de las actualizaciones optimistas de la interfaz de usuario con Tanstack Query. Aprende cómo esta poderosa biblioteca mejora la experiencia del usuario al proporcionar interacciones de IU dinámicas, manejando sin problemas las actualizaciones asincrónicas de datos.

Frontend

Ejecutando código después una mutación exitosa en React y Vue (Tanstack Query)

En este artículo, exploraremos cómo ejecutar código automáticamente en Tansktack Query cuando se resuelve una mutación (promesa). Veremos cómo se puede utilizar la función 'onSuccess' y 'onError' para ejecutar código específico cuando se resuelve una mutación, lo que puede resultar muy útil en diversas situaciones, como por ejemplo, actualizar el estado de una aplicación o realizar alguna acción específica en función del resultado de la mutación.

Frontend
React
Vue

¿Cómo usar v-model en componentes personalizados en Vue 3?

En este artículo aprenderás cómo se puede utilizar v-model para vincular datos a elementos de entrada y salida en tus componentes personalizados. Tendrás una forma más de estructurar tus componentes adicional a escribir valores y eventos para vincular datos en tu aplicación.

Frontend
Vue

Convertidor HEX a RGBA en Typescript.

Descubre cómo convertir colores en formato hexadecimal (#RRGGBB) a rgba para agregar transparencia a tus diseños.

Frontend

Optimiza la gestión de datos en tu aplicación Vue con 'Queries y Mutations' (Vue Query)

Uno de los principales retos a los que se enfrentan los desarrolladores es la gestión de datos, especialmente en el frontend. Lograr sincronizar los datos entre el cliente y el servidor puede ser un dolor de cabeza. En este artículo, exploraremos cómo Vue Query integra el patrón de 'queries' y 'mutations' para facilitar y acelerar esta tarea.

Frontend
Vue

Maneja la autorización de usuarios con JWT

Aprende a implementar un sistema fullstack de autorización seguro con JWT en tu servidor y cómo enviar y utilizar el token en el frontend para proteger tus datos y recursos. Aprende acerca del sistema JWT y cómo funciona.

Frontend
Backend
Ciberseguridad

Gráficas de línea para tu aplicación Vue

Aprende a crear gráficos atractivos en tu aplicación de Vue.js utilizando Chart.js. Este artículo te guía paso a paso en la integración de la librería y la creación de gráficos dinámicos con tus datos. Mejora la visualización de tus datos con este tutorial fácil de seguir.

Frontend
Vue

Introducción a Vue Query

Vue query es una herramienta útil para simplificar la creación de peticiones HTTP en aplicaciones Vue.js. Ofrece una gran cantidad de opciones de configuración para adaptarse a diferentes escenarios de uso. ¡Muy recomendable para aquellos que quieran agilizar el proceso de desarrollo en Vue.js!

Frontend
Vue

¿Cómo prevenir un ataque de inyección de SQL en mi aplicación web?

Descubre cómo la inyección SQL puede comprometer la seguridad de tu base de datos y aprende a utilizar técnicas como procedimientos almacenados en el back-end y validación y sanitización de entradas en el front-end para proteger su aplicación web.

Ciberseguridad
Backend
Frontend

Rutas Privadas con React Router v6 (createBrowserRouter)

React Router v6 tuvo algunos cambios con respecto a versiones anteriores. En este artículo aprenderás a implementar rutas con autenticación (o rutas privadas) en tu aplicación de React.

Frontend
React

¿Cómo usar getServerSideProps() en Next.js?

Aprende a usar getServerSideProps() en Next.js para obtener datos en el servidor y renderizarlos en el cliente para mejorar el rendimiento de tu aplicación de React. También aprenderás a usar Next Link para navegar entre páginas de forma rápida y sin recargar la página.

Frontend
React
Backend

Búsqueda binaria con Javascript y Python (Iterativa y recursiva)

Aprende cómo esta técnica de búsqueda eficiente puede ayudarte a encontrar elementos en una lista ordenada y cómo implementarla en python y javascript de manera iterativa y recursiva. Descubre los beneficios y los casos de uso de la búsqueda binaria en comparación con otras técnicas de búsqueda.

Algoritmos

Autenticación de usuarios con Google en React (firebase)

Aprende a utilizar la plataforma de Firebase para autenticar a los usuarios de tu aplicación web de forma rápida y segura. Descubre cómo integrar Firebase en tu proyecto de React y cómo utilizar los servicios de autenticación de Google para verificar la identidad de los usuarios.

Frontend
React
Backend

¿Cómo utilizar el patrón MVC (Model View Controller) en 2023?

El patrón MVC puede parecer muy abstracto si no lo has usado en el pasado. En este artículo vamos a explorar lo que es, un caso de uso real y cómo implementarlo utilizando Express js y Postgres.

Backend
Frontend

Animaciones customizadas en Tailwind vs CSS con React

Tailwind es un framework muy poderoso que cambió el paradigma tradicional de CSS. Aunque es una herramienta muy versátil, contiene pocas animaciones por defecto y para hacer efectos personalizados es necesario crearlas manualmente. En este artículo aprenderás a crear animaciones personalizadas con Tailwind y podrás compararlas con CSS tradicional.

Frontend
React

Desestructuración de objetos en Typescript y Javascript

ECMAScript 6 introdujo una nueva manera de extraer propiedaded de objetos a variables al mismo tiempo. Aprender a utilizarlo con Javascript y Typescript y mejora tu manera de escribir código para que sea más legible y limpio.

Frontend
Backend

Introducción a SQL JOIN (INNER, LEFT y RIGHT)

SQL JOIN no tiene por qué ser complicado. En este artículo aprenderás acerca de tres variantes de esta cláusula (INNER, LEFT y RIGHT) y al terminar serás capaz de implementarlos en tu app. Definitivamente te hará la vida mucho más fácil.

Backend

3 Maneras de Iterar en Javascript sin usar un 'for loop' Tradicional

Existen muchas maneras de iterar objetos en javascript. Una de ellas y probablemente la más popular es el clásico 'for loop' (for(let i = 0; i <......)). Aunque esta es una forma efectiva de hacerlo, también existen otras maneras más intuitivas y fáciles de implementar. En este artículo vamos a cubrir 3 de ellas.

Frontend
Backend

Introducción a listas enlazadas con Python y Javascript

Las listas enlazadas son un tipo de estructura de datos que se utilizan mucho, sobre todo en desarrollo backend. En este artículo introductorio aprenderás acerca de las ventajas, desventajas y casos de uso de este tipo de estructura.

Estructuras de datos

Peticiones en paralelo a una API en React y Vue

Hacer peticiones secuenciales (una tras otra) a una API puede llegar a ser muy lento. Existe una manera en la que puedes hacer muchas peticiones al mismo tiempo y de esta manera reducir el tiempo de espera para la información que necesitas.

Frontend
React
Vue

¿Cómo paginar una tabla en React y Vue?

Aprende a dividir grandes cantidades de datos en páginas más manejables para mejorar la experiencia del usuario y la eficiencia de tu aplicación web con frameworks de frontend como React y Vue.

Frontend
React
Vue