A Modern Note-Taking & Knowledge Management App
Me-Mora
- Role
- Full-Stack Developer
- Type
- Personal Project
- Scope
- Full-Stack
- Date
- 2026
OVERVIEW
Me-Mora is a full-stack note-taking and knowledge management app built for developers and learners who want a focused place to capture, organize, search, and revisit their knowledge. It combines structured note editing, tagging, search, archiving, and persistent personalization in a responsive interface.
PRODUCT EXPERIENCE
PRODUCT EXPERIENCE
Me-Mora brings note creation, organization, search, and archiving into one focused workspace, with personalization options that let users shape the experience around their preferences.
A focused workspace for managing notes, with navigation, tags, and the selected note available in one view.
Use tags to group related notes and quickly narrow down the information you need.
Archive notes when they are no longer active while keeping them available for restoration.
Create a note, add tags, and start writing in a dedicated editing experience.
THE CHALLENGE
Building a focused note-taking experience without sacrificing the depth of a real application.
Me-Mora was designed around a simple idea: capturing and organizing knowledge should feel fast, focused, and effortless. The challenge was to turn that idea into a complete full-stack application while keeping the experience simple and intuitive.
The product needed to bring together authentication, rich note editing, tagging, search, archiving, and persistent user preferences without making the interface feel unnecessarily complex.
TECHNICAL ARCHITECTURE
Built as a full-stack application with a React client, Express API, and PostgreSQL database.
FRONTEND
React · TypeScript · Vite · React Router
TanStack Query · Zustand · React Hook Form · Zod
BACKEND
Node.js · Express
JWT · Google OAuth
DATABASE
PostgreSQL · Drizzle ORM
ENGINEERING DECISIONS
Technical choices shaped around real product requirements.
Silent token refresh with Axios interceptors
Access tokens are refreshed automatically when they expire, allowing authenticated requests to continue without abruptly logging users out. The interceptor retries the original request after a successful refresh and clears the authentication state when the refresh fails.
TanStack Query + Zustand
Server state and client state are handled separately. TanStack Query manages asynchronous application data, caching, mutations, and query invalidation, while Zustand is reserved for global client-side state such as authentication and theme preferences.
Block-based JSON serialization
Note content is stored as structured BlockNote data rather than HTML. The editor serializes its block structure when saving and reconstructs it when loading, keeping persisted content independent from HTML markup and aligned with the editor's document model.
Zod validation middleware
Request validation is handled centrally through reusable Zod middleware for bodies, parameters, and query strings. This keeps validation logic out of individual controllers and provides consistent, structured error responses across the API.
WHAT I LEARNED
Building the product taught me to think beyond the interface.
Me-Mora pushed me to think about a product as a complete system rather than a collection of frontend features. I strengthened my understanding of authentication, API design, state management, data modeling, and the decisions required to connect these layers into a reliable application.
More importantly, building and deploying the project helped me become more deliberate about engineering decisions — choosing solutions based on the product requirements, maintainability, and user experience rather than simply reaching a working result.