https://github.com/tanmay-chandgude/learnhub
LearnHub is a modern e-learning platform that offers course listings, progress tracking, and video embedding. The interface is multi-page and interactive, with enhanced UI/UX features.
https://github.com/tanmay-chandgude/learnhub
elearning elearning-platform lucide-react reactjs typescript vite
Last synced: about 2 months ago
JSON representation
LearnHub is a modern e-learning platform that offers course listings, progress tracking, and video embedding. The interface is multi-page and interactive, with enhanced UI/UX features.
- Host: GitHub
- URL: https://github.com/tanmay-chandgude/learnhub
- Owner: Tanmay-Chandgude
- Created: 2025-02-08T06:12:07.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2025-02-08T07:03:04.000Z (3 months ago)
- Last Synced: 2025-02-08T07:26:37.134Z (3 months ago)
- Topics: elearning, elearning-platform, lucide-react, reactjs, typescript, vite
- Language: TypeScript
- Homepage: https://learn-hub-five.vercel.app
- Size: 184 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# LearnHub
LearnHub is a modern e-learning platform that offers course listings, progress tracking, and video embedding. The interface is multi-page and interactive, with enhanced UI/UX features.
## Key Features
- **Navigation:** Clean bar with logo and sections, seamless transitions via React Router.
- **Course Listing:** Grid layout, progress indicators, thumbnails, key info, and smooth transitions.
- **Course Detail:** Detailed course info, module listing, progress tracking, and interactive buttons.
- **Progress Tracking:** Visualization of overall and individual course progress.
- **UI Design:** Responsive with a modern indigo color scheme, consistent spacing/typography, loading/error states, Lucide icons.
## Enhancements
- **Course Cards:** Skill tags, enrollment numbers, ratings, difficulty badges, and improved hierarchy.
- **Course Detail:** Two-column layout, video player placeholder, module resources, interactive selection, skills, and statistics.
- **Home Page:** Search, category and difficulty filtering, course count, better layout, and empty state handling.
- **UI/UX:** Improved typography, spacing, interactive elements, visual feedback, consistent design, and better mobile responsiveness.
- **Dark Mode:** Theme context management, navbar toggle, persistent preference, and dark mode styles.
- **Footer:** Company info, quick links, categories, contact info, social media links, and copyright notice.
- **Help & Support:** Search functionality, live chat, knowledge base, email, FAQs, clean layout.
- **Profile Page:** User info, statistics, progress tracking, certificates, achievements, and preferences.
- **Navigation:** New items for Help and Profile, improved mobile responsiveness, better visual feedback.
## Development
To run the development server:
```bash
npm install
npm run dev