Frontend Frameworks
A guide comparing frontend frameworks by building the same app in React, Svelte, Qwik, and more.
🎶 Frontend Frameworks: LyricFinder Comparison
This repository serves as a guide to frontend frameworks by building the same project—LyricFinder—in multiple frameworks.
📌 Why This Exists
- Compare different frontend frameworks (React, Svelte, Qwik, Solid, Vue, etc.)
- Understand their strengths & weaknesses
- Learn by building the same app multiple times
🚀 Available Implementations
| Framework | Status | Folder |
|---|---|---|
| React | ✅ Completed | lyricfinder-react |
| SvelteKit | ✅ Completed | lyricfinder-svelte |
| Qwik | 🔄 Coming Soon | lyricfinder-qwik |
| SolidJS | 🟡 Planned | lyricfinder-solid |
| Vue | 🟡 Planned | lyricfinder-vue |
🎨 Features Implemented
- ✅ Search for lyrics by artist & song
- ✅ Loading states for better UX
- ✅ Recent Searches
- ✅ API Caching
- ✅ Accessibility Fixes
Each implementation follows best practices for that framework, making it easy to compare their approaches.
📖 How to Run Each Project
React Version
cd lyricfinder-react
npm install
npm run dev
SvelteKit Version
cd lyricfinder-svelte
npm install
npm run dev
🌟 Future Frameworks to Explore
- 🔄 Qwik
- 🔄 SolidJS
- 🔄 Vue
- 🔄 Angular
- 🔄 Svelte 5
