Build-Along, un SaaS MVP de la idea a los primeros usuarios

-- Supabase crea auth.users automáticamente
-- Nosotros lo ampliamos con nuestras tablas

-- Profile (extensión de auth.users)
CREATE TABLE profiles (
  id UUID REFERENCES auth.users(id) PRIMARY KEY,
  email TEXT NOT NULL,
  full_name TEXT,
  created_at TIMESTAMPTZ DEFAULT NOW(),
  stripe_customer_id TEXT UNIQUE
);

-- Subscriptions (sincronizadas con Stripe)
CREATE TABLE subscriptions (
  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
  user_id UUID REFERENCES profiles(id) NOT NULL,
  stripe_subscription_id TEXT UNIQUE NOT NULL,
  status TEXT NOT NULL, -- active, canceled, past_due
  tier TEXT NOT NULL,   -- free, pro, business
  current_period_end TIMESTAMPTZ,
  created_at TIMESTAMPTZ DEFAULT NOW()
);

-- Seguimiento de uso (para los límites)
CREATE TABLE usage_events (
  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
  user_id UUID REFERENCES profiles(id) NOT NULL,
  event_type TEXT NOT NULL, -- 'ai_generation', 'api_call'
  tokens_used INTEGER,
  cost_usd DECIMAL(10, 6),
  created_at TIMESTAMPTZ DEFAULT NOW()
);

-- Índice para contar el uso rápido
CREATE INDEX idx_usage_user_date ON usage_events(user_id, created_at DESC);

-- Row Level Security: cada usuario ve solo sus datos
ALTER TABLE profiles ENABLE ROW LEVEL SECURITY;
ALTER TABLE subscriptions ENABLE ROW LEVEL SECURITY;
ALTER TABLE usage_events ENABLE ROW LEVEL SECURITY;

CREATE POLICY "Users see own profile" ON profiles
  FOR SELECT USING (auth.uid() = id);

CREATE POLICY "Users see own subscriptions" ON subscriptions
  FOR SELECT USING (auth.uid() = user_id);

CREATE POLICY "Users see own usage" ON usage_events
  FOR SELECT USING (auth.uid() = user_id);

# En la terminal
npx create-next-app@14 my-saas --typescript --tailwind --app --no-src-dir  # versión 14: el código de la lección está escrito para ella
cd my-saas

# Agregamos las dependencias
npm install @supabase/supabase-js @supabase/ssr
npm install stripe @stripe/stripe-js
npm install @anthropic-ai/sdk
npm install zod react-hook-form @hookform/resolvers
npm install lucide-react

# Configuración de shadcn/ui
npx shadcn@latest init
# Style: Default, Base color: Slate, CSS variables: yes
npx shadcn@latest add button card input label form

my-saas/
├── app/
│   ├── (auth)/
│   │   ├── login/page.tsx
│   │   └── signup/page.tsx
│   ├── (dashboard)/
│   │   ├── dashboard/page.tsx
│   │   └── settings/page.tsx
│   ├── api/
│   │   ├── ai/generate/route.ts
│   │   ├── stripe/checkout/route.ts
│   │   └── stripe/webhook/route.ts
│   ├── page.tsx                    # página de aterrizaje
│   ├── pricing/page.tsx
│   └── layout.tsx
├── lib/
│   ├── supabase/
│   │   ├── client.ts
│   │   └── server.ts
│   ├── stripe.ts
│   └── anthropic.ts
├── components/
│   └── ui/                          # componentes de shadcn
└── .env.local

// lib/supabase/server.ts
import { createServerClient } from '@supabase/ssr'
import { cookies } from 'next/headers'

export function createClient() {
  const cookieStore = cookies()
  return createServerClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
    {
      cookies: {
        get(name: string) {
          return cookieStore.get(name)?.value
        },
      },
    }
  )
}

// app/(auth)/login/page.tsx
'use client'

import { createBrowserClient } from '@supabase/ssr'
import { Button } from '@/components/ui/button'
import { Input } from '@/components/ui/input'
import { useState } from 'react'

export default function LoginPage() {
  const [email, setEmail] = useState('')
  const [loading, setLoading] = useState(false)

  const supabase = createBrowserClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
  )

  async function handleMagicLink() {
    setLoading(true)
    const { error } = await supabase.auth.signInWithOtp({
      email,
      options: { emailRedirectTo: `${location.origin}/dashboard` }
    })
    if (error) alert(error.message)
    else alert('Revisa tu correo: te enviamos el enlace')
    setLoading(false)
  }

  return (
    <div className="max-w-md mx-auto mt-20 p-6 space-y-4">
      <h1 className="text-2xl font-bold">Iniciar sesión</h1>
      <Input
        type="email"
        placeholder="tu correo"
        value={email}
        onChange={e => setEmail(e.target.value)}
      />
      <Button onClick={handleMagicLink} disabled={loading} className="w-full">
        {loading ? 'Enviando...' : 'Enviar enlace mágico'}
      </Button>
    </div>
  )
}

# Push a GitHub
git init
git add .
git commit -m "feat: initial saas bootstrap"
gh repo create my-saas --private --source=. --push

# Conectar con Vercel
npx vercel --prod
# Lo conectas a GitHub y Vercel despliega solo con cada push

// lib/anthropic.ts
import Anthropic from '@anthropic-ai/sdk'

export const anthropic = new Anthropic({
  apiKey: process.env.ANTHROPIC_API_KEY!,
  // Proxy de Helicone para monitorear costos
  baseURL: 'https://anthropic.helicone.ai',
  defaultHeaders: {
    'Helicone-Auth': `Bearer ${process.env.HELICONE_API_KEY}`,
  },
})

const SYSTEM_PROMPT = `Eres un experto copywriter inmobiliario en Ecuador.
Tu tarea: convertir caracteristicas de propiedad en descripciones que venden.

Reglas:
- Espanol natural ecuatoriano, no neutro espanol
- Tono: profesional pero calido, NO agresivo
- Estructura: lead (1 linea hook) → 3 parrafos features → CTA
- Longitud: 150-200 palabras
- Incluye ubicacion y appeal a estilo de vida
- NUNCA inventes caracteristicas no mencionadas`

export async function generatePropertyDescription(features: {
  type: string         // 'departamento' | 'casa' | 'terreno'
  bedrooms: number
  bathrooms: number
  area_m2: number
  city: string
  neighborhood: string
  price_usd: number
  amenities: string[]  // ['parqueadero', 'piscina', 'gym']
  unique: string       // texto libre: "vista al rio"
}) {
  const response = await anthropic.messages.create({
    model: 'claude-sonnet-5-5', // modelos vigentes: «Lo vigente»
    max_tokens: 600,
    system: SYSTEM_PROMPT,
    messages: [{
      role: 'user',
      content: `Genera descripcion para:\n${JSON.stringify(features, null, 2)}`
    }]
  })

  const text = response.content
    .map((b) => (b.type === 'text' ? b.text : ''))
    .join('')

  return {
    text,
    input_tokens: response.usage.input_tokens,
    output_tokens: response.usage.output_tokens,
    cost_usd: calculateCost(response.usage),
  }
}

function calculateCost(usage: { input_tokens: number, output_tokens: number }) {
  // Sonnet 5.5: $2 / $10 por 1M de tokens (a octubre de 2026; precios vigentes: «Lo vigente»)
  return (usage.input_tokens * 2 + usage.output_tokens * 10) / 1_000_000
}

// app/api/ai/generate/route.ts
import { createClient } from '@/lib/supabase/server'
import { anthropic } from '@/lib/anthropic'
import { NextResponse } from 'next/server'
import { z } from 'zod'

const RequestSchema = z.object({
  type: z.enum(['departamento', 'casa', 'terreno']),
  bedrooms: z.number().int().min(0).max(20),
  bathrooms: z.number().int().min(0).max(20),
  area_m2: z.number().positive(),
  city: z.string().min(1),
  neighborhood: z.string().min(1),
  price_usd: z.number().positive(),
  amenities: z.array(z.string()).max(20),
  unique: z.string().max(500),
})

export async function POST(req: Request) {
  const supabase = createClient()

  // 1. Revisar la autenticación
  const { data: { user } } = await supabase.auth.getUser()
  if (!user) {
    return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
  }

  // 2. Revisar el límite (según el plan)
  const { data: sub } = await supabase
    .from('subscriptions')
    .select('tier, status')
    .eq('user_id', user.id)
    .eq('status', 'active')
    .single()

  const tier = sub?.tier ?? 'free'
  const limits = { free: 5, pro: 200, business: 2000 }

  const { count } = await supabase
    .from('usage_events')
    .select('*', { count: 'exact', head: true })
    .eq('user_id', user.id)
    .gte('created_at', firstOfMonth())

  if ((count ?? 0) >= limits[tier as keyof typeof limits]) {
    return NextResponse.json(
      { error: 'Monthly limit reached', upgrade_url: '/pricing' },
      { status: 429 }
    )
  }

  // 3. Validar la entrada
  const body = await req.json()
  const parsed = RequestSchema.safeParse(body)
  if (!parsed.success) {
    return NextResponse.json(
      { error: 'Invalid input', details: parsed.error.flatten() },
      { status: 400 }
    )
  }

  // 4. Respuesta en streaming
  const stream = await anthropic.messages.stream({
    model: 'claude-sonnet-5-5', // modelos vigentes: «Lo vigente»
    max_tokens: 600,
    system: SYSTEM_PROMPT,
    messages: [{
      role: 'user',
      content: `Genera descripcion:\n${JSON.stringify(parsed.data, null, 2)}`
    }],
  })

  // 5. Registrar el uso (asíncrono: no bloqueamos la respuesta)
  stream.on('finalMessage', async (msg) => {
    await supabase.from('usage_events').insert({
      user_id: user.id,
      event_type: 'ai_generation',
      tokens_used: msg.usage.input_tokens + msg.usage.output_tokens,
      cost_usd: (msg.usage.input_tokens * 2 + msg.usage.output_tokens * 10) / 1_000_000,
    })
  })

  return new Response(stream.toReadableStream())
}

function firstOfMonth() {
  const d = new Date()
  return new Date(d.getFullYear(), d.getMonth(), 1).toISOString()
}

// app/(dashboard)/dashboard/page.tsx
'use client'

import { useState } from 'react'
import { Button } from '@/components/ui/button'

export default function Dashboard() {
  const [output, setOutput] = useState('')
  const [loading, setLoading] = useState(false)

  async function generate() {
    setLoading(true)
    setOutput('')

    const res = await fetch('/api/ai/generate', {
      method: 'POST',
      body: JSON.stringify({
        type: 'departamento',
        bedrooms: 3,
        bathrooms: 2,
        area_m2: 95,
        city: 'Cuenca',
        neighborhood: 'El Vergel',
        price_usd: 95000,
        amenities: ['parqueadero', 'bodega'],
        unique: 'vista al rio Tomebamba',
      })
    })

    const reader = res.body!.getReader()
    const decoder = new TextDecoder()
    while (true) {
      const { value, done } = await reader.read()
      if (done) break
      setOutput(prev => prev + decoder.decode(value))
    }
    setLoading(false)
  }

  return (
    <div className="max-w-3xl mx-auto p-6 space-y-4">
      <h1 className="text-2xl font-bold">Generador de descripciones</h1>
      <Button onClick={generate} disabled={loading}>
        {loading ? 'Generando...' : 'Generar descripcion'}
      </Button>
      <pre className="bg-slate-50 p-4 rounded whitespace-pre-wrap">{output}</pre>
    </div>
  )
}

// middleware.ts (en la raíz del proyecto)
import { createServerClient } from '@supabase/ssr'
import { NextResponse, type NextRequest } from 'next/server'

export async function middleware(request: NextRequest) {
  let response = NextResponse.next({ request })

  const supabase = createServerClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
    {
      cookies: {
        get(name: string) {
          return request.cookies.get(name)?.value
        },
        set(name: string, value: string, options) {
          response.cookies.set({ name, value, ...options })
        },
        remove(name: string, options) {
          response.cookies.set({ name, value: '', ...options })
        },
      },
    }
  )

  const { data: { user } } = await supabase.auth.getUser()

  // Rutas protegidas
  const protectedPaths = ['/dashboard', '/settings']
  const isProtected = protectedPaths.some(p => request.nextUrl.pathname.startsWith(p))

  if (isProtected && !user) {
    return NextResponse.redirect(new URL('/login', request.url))
  }

  return response
}

export const config = {
  matcher: ['/((?!_next/static|_next/image|favicon.ico|.*\\.).*)'],
}

# Instalación
npm install stripe @stripe/stripe-js

# En el Stripe Dashboard:
# 1. Crea dos Product: "Pro" y "Business" (precios del ejemplo: $29 y $99 al mes; pon los tuyos)
# 2. Copia el price_id (price_1Abc...) de cada uno
# 3. .env.local:
# STRIPE_SECRET_KEY=sk_test_...
# STRIPE_WEBHOOK_SECRET=whsec_...
# STRIPE_PRICE_PRO=price_1Abc...
# STRIPE_PRICE_BUSINESS=price_1Def...

// lib/stripe.ts
import Stripe from 'stripe'

export const stripe = new Stripe(process.env.STRIPE_SECRET_KEY!, {
  apiVersion: '2024-12-18.acacia',
})

export const TIERS = {
  free: { name: 'Free', monthly_limit: 5, price_id: null },
  pro: { name: 'Pro', monthly_limit: 200, price_id: process.env.STRIPE_PRICE_PRO! },
  business: { name: 'Business', monthly_limit: 2000, price_id: process.env.STRIPE_PRICE_BUSINESS! },
} as const

// app/api/stripe/checkout/route.ts
import { createClient } from '@/lib/supabase/server'
import { stripe, TIERS } from '@/lib/stripe'
import { NextResponse } from 'next/server'

export async function POST(req: Request) {
  const { tier } = await req.json()
  if (!tier || !(tier in TIERS) || tier === 'free') {
    return NextResponse.json({ error: 'Invalid tier' }, { status: 400 })
  }

  const supabase = createClient()
  const { data: { user } } = await supabase.auth.getUser()
  if (!user) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })

  // Obtenemos o creamos el stripe_customer_id
  const { data: profile } = await supabase
    .from('profiles')
    .select('stripe_customer_id')
    .eq('id', user.id)
    .single()

  let customerId = profile?.stripe_customer_id
  if (!customerId) {
    const customer = await stripe.customers.create({
      email: user.email!,
      metadata: { user_id: user.id },
    })
    customerId = customer.id
    await supabase
      .from('profiles')
      .update({ stripe_customer_id: customerId })
      .eq('id', user.id)
  }

  // Sesión de pago
  const session = await stripe.checkout.sessions.create({
    customer: customerId,
    mode: 'subscription',
    line_items: [{
      price: TIERS[tier as keyof typeof TIERS].price_id!,
      quantity: 1,
    }],
    success_url: `${process.env.NEXT_PUBLIC_SITE_URL}/dashboard?checkout=success`,
    cancel_url: `${process.env.NEXT_PUBLIC_SITE_URL}/pricing?checkout=canceled`,
    metadata: { user_id: user.id, tier },
  })

  return NextResponse.json({ url: session.url })
}

// app/api/stripe/webhook/route.ts
import { stripe } from '@/lib/stripe'
import { createClient } from '@supabase/supabase-js'
import { NextResponse } from 'next/server'
import { headers } from 'next/headers'
import type Stripe from 'stripe'

// Service role para saltarse RLS (solo en el webhook)
const supabaseAdmin = createClient(
  process.env.NEXT_PUBLIC_SUPABASE_URL!,
  process.env.SUPABASE_SERVICE_ROLE_KEY!
)

export async function POST(req: Request) {
  const body = await req.text()
  const signature = headers().get('stripe-signature')!

  let event: Stripe.Event
  try {
    event = stripe.webhooks.constructEvent(
      body,
      signature,
      process.env.STRIPE_WEBHOOK_SECRET!
    )
  } catch (err: any) {
    return NextResponse.json({ error: err.message }, { status: 400 })
  }

  switch (event.type) {
    case 'checkout.session.completed': {
      const session = event.data.object as Stripe.Checkout.Session
      const userId = session.metadata?.user_id
      const tier = session.metadata?.tier
      if (!userId || !tier) break

      const sub = await stripe.subscriptions.retrieve(session.subscription as string)

      await supabaseAdmin.from('subscriptions').insert({
        user_id: userId,
        stripe_subscription_id: sub.id,
        status: sub.status,
        tier,
        current_period_end: new Date(sub.current_period_end * 1000).toISOString(),
      })
      break
    }

    case 'customer.subscription.updated':
    case 'customer.subscription.deleted': {
      const sub = event.data.object as Stripe.Subscription
      await supabaseAdmin
        .from('subscriptions')
        .update({
          status: sub.status,
          current_period_end: new Date(sub.current_period_end * 1000).toISOString(),
        })
        .eq('stripe_subscription_id', sub.id)
      break
    }
  }

  return NextResponse.json({ received: true })
}

# Instala la Stripe CLI
brew install stripe/stripe-cli/stripe

# Redirige el webhook a localhost
stripe listen --forward-to localhost:3000/api/stripe/webhook
# Copia el whsec_... en .env.local como STRIPE_WEBHOOK_SECRET

# En otra terminal, dispara un evento de prueba
stripe trigger checkout.session.completed

// components/usage-indicator.tsx
'use client'

import { useEffect, useState } from 'react'

export function UsageIndicator() {
  const [usage, setUsage] = useState({ used: 0, limit: 5, tier: 'free' })

  useEffect(() => {
    fetch('/api/usage').then(r => r.json()).then(setUsage)
  }, [])

  const pct = (usage.used / usage.limit) * 100

  return (
    <div className="p-3 border rounded">
      <div className="text-sm text-slate-600">
        {usage.used} / {usage.limit} usadas este mes ({usage.tier})
      </div>
      <div className="h-2 bg-slate-200 rounded mt-2">
        <div
          className={`h-full rounded ${pct > 80 ? 'bg-red-500' : 'bg-green-500'}`}
          style={{ width: `${Math.min(pct, 100)}%` }}
        />
      </div>
      {pct > 80 && (
        <a href="/pricing" className="text-xs text-blue-600 mt-1 block">
          Ya casi llegas al límite: mejora tu plan →
        </a>
      )}
    </div>
  )
}

// app/page.tsx: página de aterrizaje
export default function Landing() {
  return (
    <main>
      {/* HERO */}
      <section className="px-6 py-20 max-w-5xl mx-auto text-center">
        <h1 className="text-5xl font-bold tracking-tight">
          Descripciones inmobiliarias que venden,
          <br />
          en <span className="text-blue-600">10 segundos</span>
        </h1>
        <p className="mt-6 text-xl text-slate-600 max-w-2xl mx-auto">
          De ficha tecnica a anuncio profesional. Sin escribir nada.
          Disenado para corredores inmobiliarios en Ecuador.
        </p>
        <div className="mt-8 flex gap-4 justify-center">
          <a href="/signup" className="px-6 py-3 bg-blue-600 text-white rounded font-medium">
            Probar gratis (5 descripciones)
          </a>
          <a href="#demo" className="px-6 py-3 border rounded font-medium">
            Ver demo
          </a>
        </div>
      </section>

      {/* FEATURES */}
      <section className="px-6 py-16 bg-slate-50">
        <div className="max-w-5xl mx-auto grid md:grid-cols-3 gap-8">
          {[
            { t: 'Espanol ecuatoriano', d: 'No neutro espanol. Voz local, natural.' },
            { t: '10 segundos por anuncio', d: 'De 45 minutos a 10 segundos.' },
            { t: 'SEO incluido', d: 'Keywords para portales inmobiliarios.' },
          ].map((f, i) => (
            <div key={i} className="text-center">
              <h3 className="font-bold text-lg">{f.t}</h3>
              <p className="text-slate-600 mt-2">{f.d}</p>
            </div>
          ))}
        </div>
      </section>

      {/* PRICING preview */}
      <section className="px-6 py-16 text-center">
        <h2 className="text-3xl font-bold">Precios simples</h2>
        <p className="text-slate-600 mt-2">
          Empieza gratis. Paga cuando lo necesites.
        </p>
        <a href="/pricing" className="mt-6 inline-block text-blue-600 underline">
          Ver planes →
        </a>
      </section>
    </main>
  )
}

// app/pricing/page.tsx
const PLANS = [
  { tier: 'free', name: 'Free', price: 0, limit: 5,
    features: ['5 descripciones/mes', 'Modelos basicos', 'Soporte email'] },
  { tier: 'pro', name: 'Pro', price: 29, limit: 200, popular: true,
    features: ['200 descripciones/mes', 'Modelo Claude avanzado', 'Soporte prioritario', 'Exportar a Word'] },
  { tier: 'business', name: 'Business', price: 99, limit: 2000,
    features: ['2000 descripciones/mes', 'API access', 'White-label opcional', 'Account manager'] },
]

export default function Pricing() {
  return (
    <main className="px-6 py-16 max-w-5xl mx-auto">
      <h1 className="text-4xl font-bold text-center">Precios</h1>
      <div className="mt-12 grid md:grid-cols-3 gap-6">
        {PLANS.map(plan => (
          <div key={plan.tier}
            className={`p-6 rounded-lg border-2 ${plan.popular ? 'border-blue-600' : 'border-slate-200'}`}>
            {plan.popular && (
              <div className="text-xs font-bold text-blue-600 mb-2">MAS POPULAR</div>
            )}
            <h3 className="text-2xl font-bold">{plan.name}</h3>
            <div className="mt-4">
              <span className="text-4xl font-bold">${plan.price}</span>
              <span className="text-slate-600">/mes</span>
            </div>
            <ul className="mt-6 space-y-2">
              {plan.features.map(f => (
                <li key={f} className="flex items-start gap-2">
                  <span className="text-green-600">✓</span>
                  <span className="text-sm">{f}</span>
                </li>
              ))}
            </ul>
            <CheckoutButton tier={plan.tier} popular={plan.popular} />
          </div>
        ))}
      </div>
    </main>
  )
}

// components/states.tsx
export function LoadingState() {
  return (
    <div className="flex items-center gap-2 text-slate-600">
      <div className="h-4 w-4 animate-spin rounded-full border-2 border-blue-600 border-t-transparent" />
      Generando descripcion...
    </div>
  )
}

export function ErrorState({ message, retry }: { message: string, retry?: () => void }) {
  return (
    <div className="p-4 bg-red-50 border border-red-200 rounded">
      <div className="font-medium text-red-900">Algo salio mal</div>
      <div className="text-sm text-red-700 mt-1">{message}</div>
      {retry && (
        <button onClick={retry} className="mt-2 text-sm text-red-900 underline">
          Reintentar
        </button>
      )}
    </div>
  )
}

export function LimitReachedState() {
  return (
    <div className="p-6 bg-amber-50 border border-amber-200 rounded text-center">
      <h3 className="font-bold">Has alcanzado tu limite mensual</h3>
      <p className="text-sm text-amber-800 mt-1">
        Mejora a Pro para 200 descripciones al mes.
      </p>
      <a href="/pricing" className="mt-4 inline-block px-4 py-2 bg-amber-600 text-white rounded">
        Ver planes
      </a>
    </div>
  )
}

<footer class="px-6 py-8 border-t text-sm text-slate-600">
  <a href="/terms">Terminos</a> · 
  <a href="/privacy">Privacidad</a> · 
  <a href="/contact">Contacto</a>
</footer>

npm install posthog-js

// app/providers.tsx
'use client'
import posthog from 'posthog-js'
import { PostHogProvider } from 'posthog-js/react'
import { useEffect } from 'react'

if (typeof window !== 'undefined') {
  posthog.init(process.env.NEXT_PUBLIC_POSTHOG_KEY!, {
    api_host: process.env.NEXT_PUBLIC_POSTHOG_HOST, // la dirección de la configuración de tu proyecto en PostHog (US o EU)
    person_profiles: 'identified_only',
  })
}

export function Providers({ children }: { children: React.ReactNode }) {
  return <PostHogProvider client={posthog}>{children}</PostHogProvider>
}

Smoke test antes del lanzamiento:
□ Abrí la página de aterrizaje en incógnito: carga en <3 s
□ Registro → llega el enlace mágico por correo
□ Inicio de sesión → llego al panel
□ Generé una descripción: salió el texto en < 15 s
□ Di clic en "Upgrade" → llegué a precios
□ Compré Pro con la tarjeta de prueba → el webhook funcionó → el plan se actualizó
□ Generé 6 veces en Free: en la 6.ª vi el mensaje de límite
□ Los términos y el aviso de privacidad abren
□ Se adapta al celular: lo abrí en un teléfono y se ve bien
□ Refresco el panel: la sesión se mantiene
□ Cerrar sesión → volver a entrar funciona
□ PostHog ve los eventos
□ Helicone ve las llamadas a la API
□ El Stripe Dashboard ve la suscripción

Hola companeros 👋

He construido una herramienta que genera descripciones inmobiliarias
en espanol ecuatoriano en 10 segundos. Especificamente para Cuenca/Quito.

Ahora mismo esta abierto en beta — 5 descripciones gratis sin tarjeta.
Si tienen un anuncio nuevo esta semana, prueben:

your-saas.com

Feedback brutal apreciado. Soy [tu nombre], voy a estar online toda la tarde.

Despues de 7 dias construyendo, lanzo:

→ AI que genera descripciones inmobiliarias en 10 segundos
→ Espanol ecuatoriano (no neutro)
→ Free tier: 5 generaciones/mes

your-saas.com

Built solo con Claude Code. AMA sobre el stack.

# Day 7 Retro — 2026-XX-XX

## Metrics
- Visitors: ___
- Signups: ___
- Free generations: ___
- Pro upgrades: ___ ($___)
- API cost: $___

## What worked
- 

## What didn't
- 

## What I learned about ICP
- 

## Top 3 priorities Day 8-14
1.
2.
3.