806f4c4eeb
- Fix createNotebookOptimistic to call loadNotebooks() + triggerRefresh() after POST, so new notebooks appear immediately without page reload - Remove window.location.reload() from delete-notebook-dialog (context already handles state refresh) - Rewrite edit-notebook-dialog to use updateNotebook() from context instead of raw fetch + full page reload - Fix NoteRefreshContext: remove refreshKey from useCallback deps to prevent unstable triggerRefresh callback cascade - Fix notebook actions menu visibility: consolidate NotebookActions and expand button into single positioned container with proper z-index - Add actions menu to active/selected notebook (was previously missing) - Use proper Notebook type instead of any in sidebar components - Increase button pr-20 to pr-24 to reserve space for actions - Remove redundant router.refresh() from create-notebook-dialog Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
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.