recall/resumen/2026-03-22-resumen.md

Resumen del Proyecto - 2026-03-22

Nombre

Recall - Sistema de gestión de notas personales

Descripción

Aplicación web para crear, editar, buscar y organizar notas personales con soporte para tags, tipos de notas, favoritos, y pins. Permite exportar/importar notas en JSON y MD.

---

Tech Stack

Categoría	Tecnología
Framework	Next.js 16.2.1 (React 19.2.4)
Base UI	@base-ui/react 1.3.0
Database	SQLite con Prisma ORM
Validation	Zod 4.3.6
Styling	Tailwind CSS 4 + CSS Variables
Icons	Lucide React
Markdown	react-markdown + remark-gfm
Toast	sonner 2.0.7

---

Estructura del Proyecto

src/
├── app/
│   ├── api/
│   │   ├── export-import/route.ts    # GET (exportar) / POST (importar)
│   │   ├── notes/
│   │   │   ├── route.ts              # GET (listar) / POST (crear)
│   │   │   └── [id]/route.ts         # GET / PUT / DELETE
│   │   └── search/route.ts           # Búsqueda full-text
│   ├── edit/[id]/page.tsx            # Editar nota
│   ├── new/page.tsx                  # Crear nota
│   ├── notes/
│   │   ├── page.tsx                  # Lista de notas con filtros
│   │   └── [id]/page.tsx             # Detalle de nota
│   ├── settings/page.tsx             # Configuración (export/import)
│   ├── layout.tsx
│   ├── page.tsx                      # Dashboard
│   └── globals.css
├── components/
│   ├── ui/                           # Componentes base (Button, Card, Dialog, etc.)
│   ├── dashboard.tsx
│   ├── delete-note-button.tsx       # Botón eliminar con modal confirmación
│   ├── header.tsx
│   ├── markdown-content.tsx
│   ├── note-card.tsx
│   ├── note-form.tsx
│   ├── note-list.tsx
│   ├── related-notes.tsx
│   ├── search-bar.tsx
│   └── tag-filter.tsx
├── lib/
│   ├── prisma.ts                     # Cliente Prisma singleton
│   ├── related.ts                    # Algoritmo para notas relacionadas
│   ├── tags.ts                       # Utilidades de tags
│   ├── templates.ts                  # Plantillas para nuevos tipos de nota
│   ├── utils.ts                      # cn() helper
│   └── validators.ts                 # Esquemas Zod
└── types/
    └── note.ts                       # Tipos TypeScript para NoteType

---

Modelo de Datos (Prisma)

Note

Campo	Tipo	Descripción
id	String	CUID único
title	String	Título de la nota
content	String	Contenido en Markdown
type	String	Tipo: command, snippet, decision, recipe, procedure, inventory, note
isFavorite	Boolean	Marcada como favorita
isPinned	Boolean	Fijada arriba
createdAt	DateTime	Fecha creación
updatedAt	DateTime	Última modificación
tags	NoteTag[]	Relación many-to-many

Tag

Campo	Tipo	Descripción
id	String	CUID único
name	String	Nombre único
notes	NoteTag[]	Relación many-to-many

NoteTag (tabla de unión)

Campo	Tipo	Descripción
noteId	String	FK a Note
tagId	String	FK a Tag

---

Rutas de la Aplicación

Ruta	Descripción
/	Dashboard con notas recientes
/notes	Lista de todas las notas con filtros (búsqueda, tipo, tag)
/notes/[id]	Detalle de una nota
/new	Crear nueva nota
/edit/[id]	Editar nota existente
/settings	Configuración: exportar/importar notas

---

APIs

GET/POST /api/export-import

• GET: Exporta todas las notas como JSON
• POST: Importa notas desde JSON o MD
  • Soporta .json (formato exportado)
  • Soporta .md (usa primer # Heading como título)

GET/POST /api/notes

• GET: Lista notas (soporta query params: q, type, tag)
• POST: Crea nueva nota

GET/PUT/DELETE /api/notes/[id]

• GET: Obtiene nota por ID
• PUT: Actualiza nota
• DELETE: Elimina nota

GET /api/search

• Búsqueda full-text por título y contenido

---

Funcionalidades Implementadas

1. CRUD de Notas - Crear, leer, actualizar, eliminar
2. Tipos de Notas - command, snippet, decision, recipe, procedure, inventory, note
3. Tags - Sistema de tags con many-to-many
4. Favoritos y Pins - Marcar notas como favorites/fijadas
5. Búsqueda y Filtros - Por texto, tipo y tag
6. Exportar/Importar - Formato JSON y MD
7. Modal de Confirmación - Al eliminar nota
8. Notas Relacionadas - Algoritmo de相关性
9. Plantillas - Para diferentes tipos de notas
10. Dashboard - Vista general con notas recientes

---

Componentes UI Principales

• Button, Card, Badge, Dialog, Input, Select, Tabs, Textarea
• Avatar, DropdownMenu, Sonner (toasts)

---

Notas Técnicas

• Uses app/ router (Next.js 13+ App Router)
• Server Components para fetching de datos
• Client Components para interactividad (forms, dialogs)
• Prisma con SQLite (archivo dev.db)
• Zod para validación de schemas
• CSS Variables para theming con next-themes