Daniel Arroyo
d5c418c84f
- Desktop: single row with logo, nav links, QuickAdd, New note button - Mobile: logo + QuickAdd + hamburger icon → dropdown menu - Improved QuickAdd sizing for small screens Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
166 lines
5.2 KiB
Markdown
166 lines
5.2 KiB
Markdown
# 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`
|