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 |
|---|---|
 |
 |
🎬 View Full Walkthrough Video
- 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 love contributors! Whether you are fixing a bug, adding a new feature, or improving documentation, your help is welcome.
- Check open issues: Browse the Issues to find something to work on.
- Look for "good first issue": These are perfect for new contributors.
- Read the guide: Check out our Contributing Guidelines for setup instructions.
- Join the discussion: Use GitHub Discussions to talk about new ideas.
This project is licensed under the nRn World Non-Commercial License. See the LICENSE file for more details.
Built with ❤️ by nRn-World
☕ Support development: Buy me a coffee 💜
Created by ❤️ © nRn World