cb8bcd13ba
- Turbopack activé (dev: next dev --turbopack) - NOTE_LIST_SELECT: exclut embedding (~6KB/note) des requêtes de liste - getAllNotes/getNotes/getArchivedNotes/getNotesWithReminders optimisés - searchNotes: filtrage DB-side au lieu de full-scan JS en mémoire - getAllNotes: requêtes ownNotes + sharedNotes parallélisées avec Promise.all - syncLabels: upsert en transaction () vs N boucles séquentielles - app/(main)/page.tsx converti en Server Component (RSC) - HomeClient: composant client hydraté avec données pré-chargées - NoteEditor/BatchOrganizationDialog/AutoLabelSuggestionDialog: lazy-loaded avec dynamic() - MasonryGrid: remplace Muuri par CSS grid auto-fill + @dnd-kit/sortable - 13 packages supprimés: muuri, web-animations-js, react-masonry-css, react-grid-layout - next.config.ts nettoyé: suppression webpack override, activation image optimization
Memento - Google Keep Clone
A beautiful and feature-rich Google Keep clone built with modern web technologies.
✨ Features
- 📝 Create & Edit Notes: Quick note creation with expandable input
- ☑️ Checklist Support: Create todo lists with checkable items
- 🎨 Color Customization: 10 beautiful color themes for organizing notes
- 📌 Pin Notes: Keep important notes at the top
- 📦 Archive: Archive notes you want to keep but don't need to see
- 🏷️ Labels: Organize notes with custom labels
- 🔍 Real-time Search: Instantly search through all your notes
- 🌓 Dark Mode: Beautiful dark theme with system preference detection
- 📱 Fully Responsive: Works perfectly on desktop, tablet, and mobile
- ⚡ Server Actions: Lightning-fast CRUD operations with Next.js 16
- 🎯 Type-Safe: Full TypeScript support throughout
🚀 Tech Stack
Frontend
- Next.js 16 - React framework with App Router
- TypeScript - Type safety and better DX
- Tailwind CSS 4 - Utility-first CSS framework
- shadcn/ui - Beautiful, accessible UI components
- Lucide React - Modern icon library
Backend
- Next.js Server Actions - Server-side mutations
- Prisma ORM - Type-safe database client
- SQLite - Lightweight database (easily switchable to PostgreSQL)
📦 Installation
Prerequisites
- Node.js 18+
- npm or yarn
Steps
-
Clone the repository
git clone <repository-url> cd keep-notes -
Install dependencies
npm install -
Set up the database
npx prisma generate npx prisma migrate dev -
Start the development server
npm run dev -
Open your browser Navigate to http://localhost:3000
Getting Started
First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.
Learn More
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
Deploy on Vercel
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.