Proyecto Zniply




Descripción:
Zniply es mi proyecto personal: un gestor de snippets pensado para desarrolladores que olvidamos estructuras poco frecuentes. Lo hice completamente solo, cuidando hasta el más mínimo detalle. Es un proyecto mediano-grande con stack MERN y TypeScript en todo el flujo.
Funcionalidades clave: autenticación tradicional y OAuth (GitHub / Google via Passport), creación y edición de snippets con TipTap (soporte de bloques de código y resaltado), favoritos, landing, tutoriales, página de contacto y todo el proyecto contiene SEO.
Soporta hasta 3 snippets como invitado. Al iniciar sesión se te pregunta si querés conservarlos, eliminarlos o asignarlos a otra cuenta — esa decisión no se vuelve a pedir hasta que te vuelvas a loguear. La búsqueda está indexada y los resultados se priorizan por cantidad de likes (los más populares aparecen primero).
Implementé sanitización, validaciones robustas para contenido de usuario y manejo de sesiones seguro. Lo desplegué el frontend en Vercel y el backend en Render.
Aprendizajes y características técnicas:
- Integración de OAuth con Passport (Google y GitHub) y su flujo UX.
- Uso avanzado de TipTap para edición de snippets y manejo de bloques de código con highlighting (Prism/Lowlight).
- Diseñar y ejecutar una estrategia de migración de datos para snippets de invitado al crear cuentas (opciones: conservar, eliminar o transferir).
- Construcción de una búsqueda indexada que ordena resultados por likes — diseño de índices y pipeline de consulta para ranking.
- Fortalecimiento de la seguridad en contenido generado por usuarios usando sanitize-html y validaciones server-side.
- Prácticas de optimización y escalabilidad en un proyecto full-stack desarrollado íntegramente por mí: rendimiento, detalles UX y entrega producible.
Datos de Prueba:
Cuenta de prueba: nico@correo.com
Contraseña: 55115511
Tecnologías:
- TypeScript
- Zod
- Tailwind CSS
- React
- React Query
- React Router Dom
- Node.js
- Express
- MongoDB
- Mongoose
- Passport
- express-validator
- express-session
- sanitize-html