LearnFlow is a personalized learning platform built using React + Vite, designed to help learners identify their learning style, track their skills through a visual skill tree, and get daily content recommendations from YouTube and blog sources.
-
- Users take a quiz to determine their learning style (visual, auditory, etc.).
- Tailored learning recommendations based on quiz results.
-
Visual representation of skills with levels.
-
Unlock new skills based on progress.
-
Tracks completed and locked skills.
-
Integrates YouTube tutorials, blog posts, and more.
-
Supports bookmarking and watched status.
-
React.js (Functional Components, React Router)
-
Twailwind CSS(UI Design)
-
LocalStorage (for saving preferences/bookmarks)
-
React Context API (for managing bookmarks, watched videos)
-
- YouTube API (for fetching tutorial videos)
- Mock APIs (for storing learning data) as youtube api limit exceeded
-
- Upon signing in, you'll be prompted to take a quiz to determine your preferred learning style (visual, auditory, kinesthetic, etc.). -
- As you progress through tutorials, your skill levels will increase. Skills are unlocked based on your progress in the app. -
-Bookmark useful tutorials or articles and mark them as watched once you complete them. -
-Every day, the app will present a feed of content tailored to your current learning path and preferences.
-
Gamification 🎮: Add achievements, badges, and more ways to motivate users to complete their learning milestones.
-
Social Learning 🤝: Enable users to share their progress, challenge each other, and collaborate on learning projects.
-
Advanced Analytics ⭐ Provide detailed insights into users' learning patterns and offer suggestions for improvement.
/vite-project/vite-project/src/assets/Screenshot of Daily Feed.png')
/vite-project/vite-project/src/assets/Screenshot of HomePage.png')