This refactor introduces a maintainable, unified component architecture for
memo metadata (Location, Attachments, Relations) that ensures visual and
functional consistency between editor and view modes.
## Key Changes
### New Shared Component Library (web/src/components/memo-metadata/)
- **MetadataBadge**: Reusable badge component for compact metadata display
- **MetadataCard**: Reusable card component for structured metadata
- **LocationDisplay**: Unified location component with mode support
- **AttachmentList**: Unified attachment list with thumbnail support
- **RelationList**: Unified relation list with bidirectional tabs
- **AttachmentCard**: Shared attachment rendering logic
- **RelationCard**: Shared relation item rendering logic
### Benefits
1. **Single Source of Truth**: One component handles both edit/view modes
2. **Visual Consistency**: Same badge/card styles across all contexts
3. **Better Maintainability**: Shared logic reduces duplication (9 files vs 6)
4. **Enhanced Features**:
- Thumbnails for images in editor mode
- Consistent badge sizing (h-7) across all metadata types
- Unified spacing and interaction patterns
### Component Updates
- **MemoEditor**: Now uses LocationDisplay, AttachmentList, RelationList
- **MemoView**: Now uses the same unified components with mode="view"
- Removed old separate implementations:
- MemoEditor/{LocationView, AttachmentListView, RelationListView}
- {MemoLocationView, MemoAttachmentListView, MemoRelationListView}
### Technical Details
- All components use `DisplayMode` type ("edit" | "view") for behavior
- Editor mode: Shows badges with remove buttons, drag-sort for attachments
- View mode: Shows rich previews, popovers, galleries, navigation links
- TypeScript strict mode compatible, passes all lint checks
- Production build tested and verified
This architecture follows modern React patterns and makes it easy to add
new metadata types or modify existing ones without duplicating code.
|
||
|---|---|---|
| .github | ||
| cmd/memos | ||
| internal | ||
| plugin | ||
| proto | ||
| scripts | ||
| server | ||
| store | ||
| web | ||
| .dockerignore | ||
| .gitignore | ||
| .golangci.yaml | ||
| .goreleaser.yaml | ||
| CLAUDE.md | ||
| CODEOWNERS | ||
| LICENSE | ||
| README.md | ||
| SECURITY.md | ||
| go.mod | ||
| go.sum | ||
README.md
Memos
An open-source, self-hosted note-taking service. Your thoughts, your data, your control — no tracking, no ads, no subscription fees.
💎 Featured Sponsors
Warp — The AI-powered terminal built for speed and collaboration
LambdaTest - Cross-browser testing cloud
Overview
Memos is a privacy-first, self-hosted knowledge base that works seamlessly for personal notes, team wikis, and knowledge management. Built with Go and React, it offers lightning-fast performance without compromising on features or usability.
Why choose Memos over cloud services?
| Feature | Memos | Cloud Services |
|---|---|---|
| Privacy | ✅ Self-hosted, zero telemetry | ❌ Your data on their servers |
| Cost | ✅ Free forever, MIT license | ❌ Subscription fees |
| Performance | ✅ Instant load, no latency | ⚠️ Depends on internet |
| Ownership | ✅ Full control & export | ❌ Vendor lock-in |
| API Access | ✅ Full REST + gRPC APIs | ⚠️ Limited or paid |
| Customization | ✅ Open source, forkable | ❌ Closed ecosystem |
Features
-
🔒 Privacy-First Architecture
- Self-hosted on your infrastructure with zero telemetry
- Complete data ownership and export capabilities
- No tracking, no ads, no vendor lock-in
-
📝 Markdown Native
- Full markdown support
- Plain text storage — take your data anywhere
-
⚡ Blazing Fast
- Built with Go backend and React frontend
- Optimized for performance at any scale
-
🐳 Simple Deployment
- One-line Docker installation
- Supports SQLite, MySQL, and PostgreSQL
-
🔗 Developer-Friendly
- Full REST and gRPC APIs
- Easy integration with existing workflows
-
🎨 Beautiful Interface
- Clean, minimal design and dark mode support
- Mobile-responsive layout
Quick Start
Docker (Recommended)
docker run -d \
--name memos \
-p 5230:5230 \
-v ~/.memos:/var/opt/memos \
neosmemo/memos:stable
Open http://localhost:5230 and start writing!
Try the Live Demo
Don't want to install yet? Try our live demo first!
Other Installation Methods
- Docker Compose - Recommended for production deployments
- Pre-built Binaries - Available for Linux, macOS, and Windows
- Kubernetes - Helm charts and manifests available
- Build from Source - For development and customization
See our installation guide for detailed instructions.
Contributing
We welcome contributions of all kinds! Whether you're fixing bugs, adding features, improving documentation, or helping with translations — every contribution matters.
Ways to contribute:
- 🐛 Report bugs
- 💡 Suggest features
- 🔧 Submit pull requests
- 📖 Improve documentation
- 🌍 Help with translations
Sponsors
Love Memos? Sponsor us on GitHub to help keep the project growing!
Star History
License
Memos is open-source software licensed under the MIT License.
Website • Documentation • Demo • Discord • X/Twitter
Made with ❤️ by the Memos community