Fullstack · Plataforma editorial

Blog Personal

Plataforma editorial personal fullstack construida desde cero, donde el autor publica artículos, reseñas de libros y documentales con una experiencia de lectura premium.

Visitar ianconia.xyz
Vista previa de la plataforma editorial ianconia.xyz
Tecnologías

Stack técnico

Una arquitectura moderna que conecta interfaz, datos, autenticación, correo, analítica y despliegue continuo.

Frontend

01
  • React 19 + Vite
  • Tailwind CSS v4
  • React Router DOM
  • html2canvas

Backend & BD

02
  • Supabase (PostgreSQL + RLS)
  • Supabase Storage
  • Supabase Edge Functions
  • Supabase Auth (JWT)

Email

03
  • Resend API
  • DKIM, SPF y DMARC

Analytics

04
  • Google Analytics 4
  • Métricas de usuarios activos en tiempo real
  • Seguimiento de eventos y páginas vistas

Deploy

05
  • Vercel (CI/CD)
  • Dominio propio: ianconia.xyz
  • DNS en Porkbun
Alcance

Funcionalidades

01

Experiencia pública

  • ✓Landing editorial con hero, imagen personal y animaciones de entrada
  • ✓Carrusel responsive (1 / 2 / 4 cards según pantalla)
  • ✓Página de lectura estilo NYT con barra de progreso, drop cap y tipografía editorial
  • ✓Sistema de newsletter con email de bienvenida automático
  • ✓Generador de imagen para Instagram Stories (1080×1920 px) con glassmorphism
  • ✓Botón Web Share API para compartir en móvil
02

Panel administrativo

  • ✓Login con autenticación JWT
  • ✓Publicar, editar y eliminar artículos, libros y documentales
  • ✓Doble imagen por post (vertical para card, horizontal para lectura)
  • ✓Notificaciones por email a suscriptores con rate limiting
03

Analytics

  • ✓Google Analytics 4 integrado para seguimiento de tráfico
  • ✓Panel de usuarios activos en tiempo real
  • ✓Métricas de páginas vistas, sesiones y comportamiento de lectura
04

Infraestructura

  • ✓Row Level Security en todas las tablas
  • ✓Políticas de acceso diferenciadas (anon / authenticated)
  • ✓Routing con vercel.json para SPA
  • ✓Auto-deploy en cada git push
Resultado

Lo que demuestra

Arquitectura fullstack sin framework backend tradicional
Integración de múltiples servicios en la nube
Diseño UI/UX de nivel editorial sin librerías de componentes
Seguridad con RLS y autenticación JWT
Monitoreo de tráfico y comportamiento con Google Analytics 4
Flujo completo: idea → diseño → desarrollo → deploy → dominio propio