Kapsul 💊

The Operating System for Your Second Brain

Capture. Organize. Recall.
A premium, cinematic interface for managing your digital life.

Features • Tech Stack • Getting Started • Contributing

✨ Features

Kapsul provides a seamless experience for capturing and organizing your thoughts, links, and media.

• 🔐 Secure Authentication: Robust sign-up and sign-in flow powered by Firebase, including Google Auth support.
• 🎨 Cinematic UI/UX: A dark-themed, glassmorphic design with smooth animations and transitions using Framer Motion.
• 📱 Responsive Design: Fully optimized for desktop, tablet, and mobile devices.
• 🚀 Performance: Built on Vite for lightning-fast development and production builds.
• 🧩 Modular Components: Uses a modern component architecture with Shadcn/UI and Lucide icons.
• 🧠 Second Brain Functionality:
  • 📹 Save Videos
  • 🔗 Save Links
  • 📝 Write Notes
  • 🔍 Global Search
  • ⌨️ Keyboard First (Command Palette)

🛠 Tech Stack

• Frontend Framework: React
• Build Tool: Vite
• Styling: Tailwind CSS
• UI Components: Shadcn/UI
• Icons: Lucide React
• Animations: Framer Motion
• Backend / Auth: Firebase
• State Management: Zustand
• Routing: React Router
• Toast Notifications: Sonner

🚀 Getting Started

Follow these steps to set up the project locally.

Prerequisites

• Node.js (Version 16 or higher)
• npm or yarn

Installation

1. Clone the repository

   git clone https://github.com/yourusername/kapsul.git
   cd kapsul

2. Install dependencies

   npm install

3. Set up Environment Variables Create a .env file in the root directory (use .env.example as a reference if available) and add your Firebase configuration:

   VITE_FIREBASE_API_KEY=your_api_key
   VITE_FIREBASE_AUTH_DOMAIN=your_auth_domain
   VITE_FIREBASE_PROJECT_ID=your_project_id
   VITE_FIREBASE_STORAGE_BUCKET=your_storage_bucket
   VITE_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id
   VITE_FIREBASE_APP_ID=your_app_id

4. Run the development server

   npm run dev

5. Open in Browser Navigate to http://localhost:5173 to view the application.

📂 Project Structure

kapsul/
├── public/              # Static assets (icons, images)
├── src/
│   ├── components/      # Reusable UI components
│   │   ├── layout/      # Header, Sidebar, etc.
│   │   ├── ui/          # Shadcn UI components
│   │   └── ...
│   ├── lib/             # Utilities (utils, firebase config)
│   ├── pages/           # Page components (Auth, Dashboard, etc.)
│   ├── store/           # State management (Zustand)
│   ├── App.jsx          # Main application component
│   └── main.jsx         # Entry point
├── .env                 # Environment variables
├── package.json         # Project dependencies and scripts
└── ...

🤝 Contributing

Contributions are welcome! Please follow these steps:

1. Fork the project.
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

Distributed under the MIT License. See LICENSE for more information.

---

Built with ❤️ for the thinkers and creators.