My Notes App 📝
Welcome to My Notes App - a feature-rich note-taking application inspired by the flexibility of Notion and built with modern web technologies!
🚀 Overview
it's a project where I embarked on a journey to explore the world of modern web development. With a stack built on TypeScript, React, TanStack Router, and Appwrite, this app offers a customizable and intuitive interface for organizing your thoughts and ideas.
🌟 Features
- Flexible Layouts
- Category Management
- Favorites
- Dark/Light Mode
- Search
- Mobile Responsiveness
🧠 New Learnings
- TypeScript : Embracing type safety for robust code.
- TanStack Brilliance : Discovering the power of TanStack Router and Query for efficient routing and data management.
- Appwrite : Overcoming authentication, storage hurdles and integrating backend cloud services.
- Chunk Splitting : Delving into optimization techniques for faster loading times.
🔍 Challenges & Solutions
- Faced initial challenges with Appwrite auth, resolved by switching to the old version.
- Encountered issues with types for Context API, resolved with default values and careful typing.
- Created a custom checkbox block in Blocknote, adding a unique feature to the app.
🔴 Save Functionality Note:
Due to a technical challenge, automatic saving onChange in the editor was causing issues. To ensure your notes are saved, please use the save button after writing, especially on desktop versions.
🚀 Try It Out
You can check out the live here.
⭐ Upcoming Features & Improvements
- Dynamic Categories and Tags : Introduce dynamic categorization and tagging for better organization.
- Improved Design : Enhance the user interface with a fresh, modern design.
- PWA Offline Support : Implement Progressive Web App (PWA) features for seamless offline access.
- Optimized Performance : Further optimize app performance for smoother user experience.
📚 Tech Stack
Client: React, TypeScript, TailwindCSS, TanStack Router, TanStack Query, NextUI, Blocknote,Swiper.
Appwrite: Providing the backbone for backend services and cloud storage.
🙌 Acknowledgements
- BlockNote: The open source Block-Based rich text editor