Repository files navigation

"Your personal cloud-based notes app to create, edit, and preview content from anywhere in the world."

Note It! is a powerful and minimalistreal-time notes application designed to simplify note-taking and editing. With an intuitive user interface and markdown support, this project enables you tocreate, edit, delete, and preview notes, all securely stored in the cloud viaFirebase.

Whether you're organizing thoughts, collaborating with friends, or jotting down ideas on the go,Note It! ensures your notes are accessible from anywhere in the world.

Get a glimpse of theNote It! interface and its core features:

• Left Panel: Displays a list of all notes with a snippet of their content. Recently edited notes are automatically prioritized at the top.
• Right Panel: IncludesWrite Mode powered byReactMDE for editing notes and aPreview Mode for real-time markdown rendering.

Visit theLive Site for a full experience! 🌐

• All notes are stored inFirebase, ensuring global access and real-time updates.

1. Left Pane:

   • Displays a list of all your notes with the first few words of each note visible.
   • Automatically moves recently edited notes to the top for easy access.

2. Right Pane:

   • Split into aWrite Mode and aPreview Mode:
     • Write Mode: Write or edit notes with arich text editor panel similar to MS Word.
     • Preview Mode: Instantly visualize formatted notes with markdown support (e.g.,# for headings,** for bold text).

• A feature-packed editing toolbar lets you:
  • Format text (bold, italic, highlight, etc.).
  • Add code blocks, images, and hyperlinks.
  • Leverage markdown for effortless content structuring.

• Create new notes effortlessly.
• Edit existing notes with live sync updates.
• Delete notes you no longer need.

• Currently designed for single-user use, making it perfect for personal note-taking and sharing among friends.
• Future Enhancements:
  • Multi-user support with login functionality.
  • User-specific notes for enhanced privacy and personalization.

Experience the live version here:
🔗Note It! – Live Demo

Follow these instructions to set up and runNote It! locally on your machine:

Ensure you have the following installed:

• Node.js (v16 or later)
• npm (v8 or later)

1. Clone the repository:

   git clone https://github.com/Hailex798/NOTE-IT.gitcd NOTE-IT

2. Install the dependencies:

   npm install

3. Start the development server:

   npm run dev

4. Open your browser and navigate to:
   http://localhost:5173

TheNote It! application is designed for simplicity and functionality:

• Compose or edit your notes usingReactMDE (Markdown Editor), a rich text editor with built-in support for markdown syntax.
• The editor includes a feature-packed toolbar, enabling you to:
  • Format text (bold, italic, highlights).
  • Insert code blocks, images, and hyperlinks.
  • Utilize markdown shortcuts for structured content creation.

• See a live preview of your markdown-formatted content in real time.
• Perfect for creating professional, clean, and structured notes.

• All your notes appear in a list view in the left pane.
• Click on any note to edit it, and watch it move to the top of the list.

The project is designed with scalability and future improvements in mind:

1. Multi-User Support:
   • User-specific login for personalized note management.
2. Privacy and Security:
   • Restrict access to notes based on user authentication.
3. Collaborative Features:
   • Enable real-time collaboration on notes.
4. Improved Storage Options:
   • Add support for external databases or backup systems.

We welcome contributions to enhanceNote It!:

1. Fork the Repository
2. Create a Feature Branch:

   git checkout -b feature-name

3. Commit Your Changes:

   git commit -m"Add feature X"

4. Push the Branch:

   git push origin feature-name

5. Open a Pull Request

This project is licensed under theMIT License. See theLICENSE file for more details.

Special thanks to:

• React andFirebase communities for tools and libraries.
• Open-source contributors for their guidance.

Created with ❤️ byHailex798.