Skip to content

noobie-sys/floatingnote

Repository files navigation

Floating Notes

A modern, feature-rich note-taking application built with Electron and React. Floating Notes provides a seamless experience for users who need to quickly capture and organize their thoughts with a beautiful, distraction-free interface.

Features

  • Modern UI/UX

    • Clean and intuitive interface built with React and Tailwind CSS
    • Dark mode support with One Dark theme
    • Smooth animations and transitions
    • Resizable sidebar for better organization
  • Rich Text Editing

    • Full Markdown support
    • Code syntax highlighting
    • Real-time preview
    • Support for images and links
    • Character and word count statistics
  • File Management

    • Hierarchical folder structure
    • Create, rename, and delete notes and folders
    • Automatic file organization
    • Local storage with data persistence
  • Cross-Platform

    • Available for Windows, macOS, and Linux
    • Native system integration
    • Global shortcut support (Ctrl/Cmd + Shift + X to toggle window)
    • Always-on-top window option

Technical Stack

  • Frontend Framework: React 18
  • Desktop Framework: Electron
  • Language: TypeScript
  • Styling: Tailwind CSS
  • State Management: Jotai
  • UI Components: Radix UI
  • Icons: Lucide
  • Build Tool: Vite
  • Package Manager: npm/bun

Getting Started

Prerequisites

  • Node.js (Latest LTS version)
  • npm or bun package manager

Installation

  1. Clone the repository:
git clone https://github.com/yourusername/floating-notes.git
cd floating-notes
  1. Install dependencies:
npm install

Development

To start the development server:

npm run dev

Building

Build for your platform:

# For Windows
npm run build:win

# For macOS
npm run build:mac

# For Linux
npm run build:linux

Usage

  • Use Ctrl/Cmd + N to create a new note
  • Use Ctrl/Cmd + Shift + X to toggle the window visibility
  • Organize notes in folders using the sidebar
  • Write notes using Markdown syntax
  • Drag and drop to reorganize notes and folders

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.


Built with ❤️ using Electron and React

About

A modern, feature-rich note-taking application built with Electron and React. Floating Notes provides a seamless experience for users who need to quickly capture and organize their thoughts with a beautiful, distraction-free interface.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors