Planning Póker

Short polling para ver en tiempo real las interacciones de los usuarios con las tareas que se están votando, de esta manera estimar las tareas

Messenger Clone

Este es un proyecto de estudio también, para seguir aprendiendo más sobre NextJS y sockets, en este caso es un clon de messenger, el cual está utilizando tecnologías modernas para su ejecución. Se puede hacer registro con redes sociales, conversaciones y conversaciones grupales.

AirBnb Clone

Este es un clon de airbnb nuevamente para practicar más NextJs, conociendo su versión 13 y aplicando el Stack de NextJS + TS, tailwindcss, mongodb y prisma, además de otras tecnologías. En esta aplicación se pueden crear nuevos lugares para que estén disponibles para visitar, se pueden agendar rango de días para establecer fecha de visita, calcular el precio estimado de visita, agregarlas a favoritos. Además de esto se puede iniciar sesión con redes sociales.

Netflix Clone

Este proyecto es un tutorial seguido para aprender más sobre OAuth y videos dentro de aplicaciones web. Es un clon de Netflix en donde se puede iniciar sesión con Email, Google o GitHub. Una vez dentro se pueden ver las películas que se encuentran disponibles y también agregar películas a favoritos.

Twitter Clone

Este clon de twitter está hecho en base a un tutorial, el cual enseña sobre NextJs. Dentro del proyecto se pueden realizar funciones básicas de twitter como crear una cuenta, seguir otras cuentas, editar perfil, subir imágenes, crear post, dar like a los post y comentarlos. El proyecto se realizó con la finalidad de estudiar y comprender más sobre el framework de NextJs

Planner App Mobile

Esta aplicación es la versión mobile de la aplicación app planner, la cual tiene el mismo propósito, logrando ser un centro de almacenamiento de la información para planificar las clases diarias de la educación pre escolar. Está desarrollado en React Native y el backend utilizado es en NodeJs.

Comparación de envío de Emails (Go vs JavaScript)

El envío de mails se hace sencillo gracias a diversas librerías que se puedan utilizar, en este caso utilicé Nodemailer para JavaScript y Gomail para Go. De ambas maneras es relativamente sencillo. Por una parte en Go no necesita tanta configuración como JavaScript, sin embargo, en JavaScript se puede usar template string para escribir el cuerpo del correo de una manera más sencilla para mostrarlo y escribir estilos, mientras que en Go se debe usar concatenación.

20 de abril, 2023

Guardando en base de datos de manera dinámica

En un proyecto, hubo diversos tipos de modelos en bases de datos, pero todos estos modelos recibían el mismo parámetro, ya que, eran categorías, pero cada categoría con diferentes objetivos. Dado esto, y para simplificar las líneas de código, realicé estas funciones de manera general, en donde recibía el modelo de la base de datos y la información en formato multipart/form-data, ya que, recibe un archivo en pdf, el cual será almacenado en AWS S3. Con esto se pudo disminuir las líneas de código del proyecto y realizar inserciones dinámicas en bases de datos para cada modelo que comparta los parámetros requeridos. Esto fue desarrollado en TypeScript en la migración de un proyecto desde Go hacia NodeJs

20 de abril, 2023

Creando filtros en react

Para una aplicación que contenía un directorio, tuve que realizar tareas de diversos filtros, ya que, eran bastantes categorías y subcategorias, las cuales eran muy complejas de mantener, debido a que, si agregaban nuevas categorías, debía hacerlo todo a mano. Resulta que en cada una de las imágenes de esta entrada de blog tenía más de 150 líneas de código, ya que lo estaba generando de manera estática. Las categorías fueron agregadas a una base de datos y con esto se pudo resumir cientos de lineas de código, en las líneas que se muestran en las imágenes.

20 de abril, 2023

Secuencia de Fibonacci

Este código lo realicé cuando me encontraba aprendiendo go. Consta del típico ejercicio de la secuencia de fibonacci, el cual es una función que recibe un parámetro num, el cual indica el número en el que se debe detener generando números correspondientes a la secuencia de Fibonacci.

20 de abril, 2023

Importaciones dinámicas

Resulta que en React para renderizar una imagen se debe importar desde su ruta y luego renderizarla, ya que, si uno escribe la ruta de la imagen en JSX no se renderiza. El tema es que tenía 11 imágenes que quería poner en un array y la verdad no quería importar una a una las imágenes y luego crear el array a mano. Gracias a la importación dinámica pude importar todas las imágenes y ponerlas en un array para luego recorrerlo y renderizar las imágenes. Con esto hice un custom hook para utilizar estas imágenes donde sea necesario.

20 de abril, 2023

Comparación de rendimiento de bucles

Es importante conocer el rendimiento que tiene cada uno de los bucles para poder optimizar los sitios web, ya que, algunos son más rápidos que otros. Sin embargo algunos son más sencillos de utilizar que otros. En primera instancia creé un arreglo de 1.000.000 de posiciones el cual fue rellenado con números al azar. Luego de eso recorrí ese arreglo con los bucles for disponibles obteniendo el tiempo de ejecución de cada uno de estos bucles y se pueden obtener las siguientes conclusiones: 1.- El bucle for nativo de js es el más rápido recorriendo arreglos, pero también el que nos da más trabajo a la hora de programar. 2.- El bucle forEach de lodash es más rápido que el bucle forEach nativo de js. 3.- El bucle for...of es más rápido que el bucle for...in, ya que, este último se dedica a recorrer y mostrar los índices del arreglo, mientras que el for...of muestra los elementos del arreglo. 4.- Por último el bucle map es más lento que el ciclo for o forEach, lo cual pierde en rendimiento, sin embargo, el resultado es provechoso, ya que al trabajar con algoritmia lo que buscamos es la inmutabilidad de los array, lo que claramente lo hace perder en rendimiento, pero nos hace ganar en un mejor código.

20 de abril, 2023