Saltar al contenido
Jhamil Taborga
Volver a proyectos
Proyecto de curso

Suplatzigram

Red social inspirada en Instagram con Next.js y Supabase como backend completo: autenticación, base de datos, almacenamiento y tiempo real.

Tecnologías
  • Next.js
  • React
  • TypeScript
  • Tailwind
  • Supabase
  • Resend
  • Vercel
Enlaces
Ver sitio(se abre en una pestaña nueva)

Contexto

Proyecto del curso de Supabase: una red social inspirada en Instagram construida con Next.js (App Router) y TypeScript. Supabase resuelve todo el backend: Auth, PostgreSQL, Storage, Realtime y Edge Functions.

Qué hice

  • Implementé registro e inicio de sesión con Supabase Auth. El registro valida el username (formato, longitud y disponibilidad) y crea el perfil del usuario automáticamente.
  • Implementé la subida de imágenes de publicaciones y de avatares con Supabase Storage, con vista previa antes de publicar y edición de perfil.
  • Implementé notificaciones en tiempo real de likes y comentarios con Supabase Realtime y Edge Functions, y un dashboard que muestra métricas y actividad en vivo.
  • Creé una API route en Next.js que avisa por correo con Resend cuando alguien comenta. Usa un cliente admin de Supabase que solo corre en el servidor, para no exponer la service key.
  • Desarrollé un ranking de publicaciones según los likes que recibe cada una. Junta posts, perfiles y likes con consultas por lotes y agrupa los resultados en el cliente.