NexNote is a sleek, modern platform designed for developers and creatives to store and share their favorite code snippets and notes. Built with speed and user experience in mind, NexNote allows you to manage SVG, HTML, CSS, and JS directly in your profile, while participating in a curated community showcase.
- 🔐 Google Authentication: Quick and secure sign-in with your Google account.
- 🎨 Powerful Editors:
- Rich Text Editor: Powered by TipTap for beautiful note-taking.
- Code Editor: syntax-highlighted editor for web technologies (HTML, CSS, JS, SVG).
- 🤝 Community Sharing: Share up to 2 projects per month to the global community feed.
- 🌙 Modern UI: A responsive, dark-mode-first aesthetic built with Framer Motion for smooth transitions.
- ☁️ Cloud Sync: All your notes and snippets are safely stored in Firebase and synced across devices.
- 📸 Code-to-Image: Export your snippets as beautiful images for social media sharing.
- Framework: React 19
- Build Tool: Vite 6
- Backend/DB: Firebase (Auth, Firestore, Storage)
- Styling: Tailwind CSS & Lucide Icons
- Editors: TipTap (Rich Text) & CodeMirror 6 (Code)
- Animations: Framer Motion
| 🎨 Landing Page | 🏠 Dashboard |
|---|---|
 |
 |
| ✍️ Note Editor | 💻 Code Editor |
|---|---|
 |
 |
| ⚙️ Settings | 🌍 Community Feed |
|---|---|
 |
 |
- Node.js (v18 or higher)
- A Firebase project
-
Clone the repository:
git clone https://github.com/nRn-World/NexNote.git cd NexNote -
Install dependencies:
npm install
-
Environment Setup: Create a
.env.localfile in the root directory and add your Firebase and Gemini configurations (see.env.example). -
Run the development server:
npm run dev
Open
http://localhost:3000to see the result.
We welcome contributions! Please feel free to open issues or submit pull requests to help improve NexNote.
This project is licensed under the nRn World Non-Commercial License. See the LICENSE file for more details.
Built with ❤️ by nRn-World