Google Keep Clone

A modern, responsive clone of Google Keep built with React, TypeScript, and Vite. This application allows users to create, edit, and organize notes with a clean, intuitive interface.

✨ Features

• 📝 Create, edit, and delete notes
• 🏷️ Organize notes with labels
• 🎨 Color-code your notes
• 🔍 Search functionality
• 📱 Fully responsive design
• ⚡ Fast and performant
• 🌙 Dark/Light mode (coming soon)

🛠️ Technologies Used

• ⚛️ React 19
• 💡 TypeScript
• 🚀 Vite
• 🎨 Sass for styling
• 🔍 ESLint + Prettier
• 🧪 React Testing Library (coming soon)

🚀 Getting Started

Prerequisites

• Node.js (v16 or later)
• npm, yarn, or pnpm (recommended)

Installation

1. Clone the repository:

   git clone https://github.com/yourusername/clone-google-keep.git
   cd clone-google-keep

2. Install dependencies:

   pnpm install
   # or
   npm install
   # or
   yarn

3. Start the development server:

   pnpm dev
   # or
   npm run dev
   # or
   yarn dev

4. Open http://localhost:5173 in your browser.

📂 Project Structure

src/
├── assets/          # Static assets
├── components/      # Reusable components
│   ├── noteCard/    # Note card component
│   └── ...
├── layouts/         # Layout components
│   ├── notes/       # Notes layout
│   └── nav/         # Navigation
├── styles/          # Global styles
├── types/           # TypeScript type definitions
├── App.tsx          # Main App component
└── main.tsx         # Application entry point

🧪 Available Scripts

• dev - Start development server
• build - Build for production
• lint - Run ESLint
• preview - Preview production build

🤝 Contributing

Contributions are welcome! Please follow these steps:

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Inspired by Google Keep
• Built with Create React App + TypeScript template { files: ['**/*.{ts,tsx}'], extends: [ // Other configs... // Enable lint rules for React reactX.configs['recommended-typescript'], // Enable lint rules for React DOM reactDom.configs.recommended, ], languageOptions: { parserOptions: { project: ['./tsconfig.node.json', './tsconfig.app.json'], tsconfigRootDir: import.meta.dirname, }, // other options... }, }, ])