DEV Community

Cover image for Notpad: Reinventing the Ordinary Notepad Experience with Svelte, Shadcn, and Tauri ✨📝🚀
Muhammed Rahif
Muhammed Rahif

Posted on • Edited on

Notpad: Reinventing the Ordinary Notepad Experience with Svelte, Shadcn, and Tauri ✨📝🚀

Hi, Dev Community! 👋

I’m excited to introduce Notpad, my modern take on the classic notepad app we all know and love. This isn’t just another text editor—it’s built using Svelte, Shadcn, and Tauri to combine simplicity with a fresh, modern touch.

Screenshot

Why Notpad?

Notpad is a result of my love for open-source development. Working on this project has been an enjoyable journey, and I’d love for the community to shape its future with me. Whether you’re a curious user or someone passionate about contributing, your input is incredibly valuable!

Let’s face it: notepad apps come pre-installed on almost every OS these days, making it tough to stand out. That’s why I’ve focused on introducing exciting features that make Notpad fun, useful, and truly unique! 🎉

Notpad’s Standout Features

  • Animated Cursor: A magical little detail that feels great to use.
  • 📑 Line Numbers: A must-have for both coders and writers.
  • 📂 Multiple Editors: Work with several files side by side without hassle.
  • 🔍 Search Selected Text on Google: Highlight a word or phrase and search it instantly.
  • 🖋️ Rich Text Support: Built using Quill.js, the textarea supports rich text formatting. (Note: Full editing features are on the way.)

Missing a feature you’ve been looking for? Create an issue here!

Try Notpad

How You Can Help/Contribute

Making a standout notepad app isn’t easy, but with your help, we can make Notpad even better! 💡 Whether it’s feedback, bug reports, creative ideas, or even coding contributions, here’s how you can get involved:

  • Feature Suggestions: What do you love? What’s missing?
  • Bug Reports: Help track down and fix issues.
  • User Testing: Your experience helps refine Notpad.
  • Creative Ideas: Have a cool idea? Let’s bring it to life.
  • Coding Contributions: Help shape the app with your code!

Got ideas or feedback? Open an issue here.

Join me to take Notpad to the next level and make it truly stand out. Your ideas, feedback, and support mean the world to me! 🚀

Thank you for reading, and happy typing! 😊

Top comments (15)

Collapse
 
itsmeseb profile image
sebkolind

That is actually a pretty fun project! Are you thinking of making some sort of logged-in experience for the web version, so that you can sync your desktop notes with the ones on the web version?

Also, a split view would be super nice.

Collapse
 
muhammed_rahif profile image
Muhammed Rahif

Thank you! A backend is not yet planned, so syncing between web and desktop versions isn't available at the moment. A split view does sound like a great idea—I'll definitely consider it!

Collapse
 
skhmt profile image
Mike 🐈‍⬛

Doing File > Open then hitting "Cancel" re-opens the dialog - you have to hit "Cancel" a second time.

Hitting "Cancel" on both the "Save" and "Save as..." dialogs just saves anyway.

Collapse
 
muhammed_rahif profile image
Muhammed Rahif

Thanks for reporting this. I’ve reproduced and confirmed the bug. I’ll look into it ASAP. Appreciate your effort; not everyone takes the time to report! 😊

Collapse
 
muhammed_rahif profile image
Muhammed Rahif

This been fixed!

Collapse
 
bensatlantikk profile image
bensatlantik

This is very elegant - I like that I can easily access tools quickly from the main menu - modify the font, add line numbers, switch to dark mode, etc. But since it can't currently handle any extension other than .txt, I can't use it for coding - ie - I can neither open nor save code files with anything other than the .txt extension. So, no Rust (.rs), C (.c), Python (.py), etc.. Still, it's beautiful, minimal and has a nice feel.

Collapse
 
muhammed_rahif profile image
Muhammed Rahif

I’m glad you like the simplicity and accessibility. Supporting additional file extensions is a great suggestion, and I’ll definitely consider adding it to future updates. Your feedback is much appreciated!

Collapse
 
webjose profile image
José Pablo Ramírez Vargas • Edited

Hello. I like it. Zooming, though, needs to zoom in everything, not just the document. If we need zoom for the document, you bet we need it for the menu too.

Collapse
 
muhammed_rahif profile image
Muhammed Rahif

Hello, and thank you for your feedback! 😊

I implemented the zoom functionality exactly as it works in the original Windows Notepad, where only the document content is zoomed while the menu and UI remain unaffected. This approach ensures a consistent interface and prevents usability issues, like being unable to zoom out if the menu becomes too large.

That said, I’m curious—what do you find helpful about zooming the menu and other UI elements? I’d love to understand your perspective better!

Collapse
 
webjose profile image
José Pablo Ramírez Vargas

I'll explain very simply: The zoom in Visual Studio Code is perfect. I need to zoom to be able to read comfortably. That includes the menus, sidebars, etc. I need the font size to increase everywhere.

Thread Thread
 
muhammed_rahif profile image
Muhammed Rahif

On the web version of Notpad, you can use your browser’s zoom to scale the entire UI, including menus. For the Tauri version, full UI zoom isn’t planned, at least for now, as the project mimics the original Notepad behavior.

Collapse
 
stormdotcom profile image
Ajmal Nasumudeen

Cool project, i would like to contribute in web version

Collapse
 
muhammed_rahif profile image
Muhammed Rahif

Thank you! Contributions are always welcome. Feel free to check out the project on Github.

Collapse
 
webjose profile image
José Pablo Ramírez Vargas

Also, I could not find how to put two new documents side by side.

Collapse
 
muhammed_rahif profile image
Muhammed Rahif

Currently, the app doesn't support opening two documents side by side. However, it's a great suggestion, and I'll consider adding it in the future!