Volver a proyectos

Case study

Full Stack2023

BOOKHOUSE cafe

Sitio para un book café en Pune para explorar estanterías y reservar por WhatsApp.

Un sitio Next.js con admin en Supabase para un book café de barrio: los visitantes exploran estanterías en inglés e hindi, reservan libros por WhatsApp y consultan menú, comunidades y visita, mientras el equipo gestiona el contenido en vivo desde un solo panel.

BOOKHOUSE cafe home page hero with brand typography and visit calls to action.
Next.jsTypeScriptTailwind CSSSupabaseFramer MotionZodPlaywright

Contribución

  • Construí el sitio público completo y el admin respaldado por Supabase para una marca real de café en Pune.
  • Implementé vistas de estanterías en inglés e hindi con búsqueda, chips de categoría y navegación por teclado.
  • Diseñé un carrito de reserva que agrupa títulos seleccionados en una sola salida hacia WhatsApp.
  • Entregué herramientas de admin para libros, menú, comunidades, ajustes y un personalizador visual del sitio.
  • Añadí páginas de menú, comunidades y visita con structured data para descubrimiento local.

Resultado

Entregué una presencia de café pulida que conecta exploración, comunidad y reserva en una experiencia de lectura tranquila.

Decisiones técnicas

  • Sitio público estático con CMS opcional en Supabase

    El sitio de marketing se prerenderiza desde módulos de contenido y cae a archivos estáticos si Supabase está offline, mientras el panel de admin edita el inventario en vivo cuando hay conexión.

    Next.js · Supabase · TypeScript

  • Flujo de reserva centrado en WhatsApp

    Mantuve el checkout ligero con un carrito local y un mensaje precargado de WhatsApp en lugar de infraestructura de pagos.

    Next.js · Zod

  • Admin de un solo miembro con acceso protegido

    Una cuenta de Supabase Auth gestiona libros, menú, comunidades y ajustes del sitio: el registro público está desactivado y el middleware aplica una lista de correos permitidos.

    Supabase · Next.js

Desafíos

  • Hacer que las estanterías bilingües se sintieran equivalentes

    Las colecciones en inglés e hindi necesitaban tono y tipografía propios sin duplicar toda la UI.

    Resolución: Usé componentes compartidos con módulos de contenido por idioma y rutas dedicadas en hindi cuando el layout debía adaptarse.

  • Dejar que el equipo edite contenido sin redesplegar

    Los precios del menú, el stock de libros y los detalles de las comunidades cambian a menudo; el café necesitaba actualizaciones el mismo día sin tocar código.

    Resolución: Pasé el catálogo a Supabase con revalidación bajo demanda, subida de portadas a Storage y un personalizador del sitio para marca y textos.