Foto de Franco Montechiani

Franco Montechiani

Desarrollador Web FullStack

Rosario, Argentina

Proyecto Zniply

Zniply 0Zniply 1Zniply 2Zniply 3

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