A modern, minimalist chord viewer app for beginner guitar players and hobbyists.
Chordium focuses on providing a distraction-free experience for learning and practicing guitar chords.
Experience Chordium's clean interface, smart search, and intuitive chord display in action.
🎵 Try it live | Backend:
Chordium is designed with simplicity in mind, helping new guitar players and casual enthusiasts learn songs without visual clutter:
- Install-less App (PWA) - Works offline and installs like a native app
- Clean Interface - Distraction-free chord viewing experience
- Smart Search - Find songs and artists with intelligent caching
- Chord Diagrams - Clear fingering positions for each chord
- Auto-scrolling - Practice at your own pace with speed controls
- Mobile-friendly - Learn on-the-go with responsive design
- File Upload - Import your own chord sheets with metadata extraction
- React + TypeScript - Modern UI with type safety
- Vite - Fast build tool and development server
- Tailwind CSS + shadcn/ui - Beautiful, accessible components
- React Router - Client-side navigation
- @tanstack/react-query - Data fetching and state management
- Node.js/Express + TypeScript - RESTful API server
- Supabase - PostgreSQL database and authentication
- AWS S3 - Cloud storage for cached data
- Puppeteer + Cheerio - Web scraping and HTML parsing
- Turborepo - High-performance build system for monorepos
- npm Workspaces - Monorepo dependency management
- @chordium/types - Shared TypeScript types published to npm
- Vitest + Jest + Cypress - Comprehensive testing
| Topic | Description |
|---|---|
| 🚀 Getting Started | Installation, setup, and development commands |
| 🧪 Testing | Testing frameworks, running tests, and guidelines |
| 🛡️ Error Handling | Error recovery and user-friendly error messages |
| 🏗️ Project Structure | Codebase organization and architecture |
| 🚀 Deployment | Frontend and backend deployment guides |
| 🤝 Contributing | How to contribute to the project |
| 📖 Backend API | Backend documentation and API reference |
| 🔍 Search Guide | Smart search functionality details |
| 🏢 Monorepo | Monorepo architecture and workspace management |
| 🗄️ Cache Architecture | Frontend caching system design and implementation |
| ⚡ Build Optimizations | Performance optimizations and bundle configuration |
| 📱 PWA Development | PWA setup, development workflow, and features |
| 🧠 Technical Decisions | Key architectural decisions and rationale |
# Clone and install
git clone https://github.com/arthurboss/chordium.git
cd chordium
npm installSee Getting Started for development setup and commands.
This project is licensed under the MIT License - see the LICENSE file for details.