khan Academy

“I added coding classes to the site to help users easily learn and improve their programming skills with structured, accessible content.”

Comment

Inspiration

“Inspired by the global impact of Khan Academy, I wanted to create a simple, clean, and fully responsive educational platform where users can explore subjects and view course details — all through a frontend-only setup. The goal was to replicate a real-world learning platform’s structure, improve my React skills, practice TailwindCSS for modern UI design, and showcase the power of building functional, scalable apps without needing a backend.”## What it does

How we built it

“We built this Khan Academy clone using React.js for creating dynamic and reusable components and Tailwind CSS for fast, responsive, and modern UI styling. React Router was used to manage multiple pages like Home, Subjects, and Course Details without page reloads. All subject and course data were handled using static JSON and local state, ensuring the entire application runs smoothly on the frontend without a backend. The project structure follows a component-based architecture, allowing scalability and easy maintenance. Vite was used for faster development and bundling.”

Challenges we ran into

“Building a fully responsive UI, managing multiple pages with React Router, and organizing static data without backend support were key challenges we overcame to deliver a smooth user experience.

Accomplishments that we're proud of

“We created a smooth, responsive Khan Academy-style platform using React and TailwindCSS, with working search, navigation, and course exploration — all without any backend support.”

What we learned

Through building this project, we deepened our understanding of creating fully functional frontend applications using React.js and Tailwind CSS. We learned how to structure a scalable component-based architecture, manage state for dynamic search and filtering without any backend, and handle complex routing between multiple pages using React Router. Additionally, we gained hands-on experience designing responsive layouts and improving overall user experience with smooth transitions and mobile-first design principles.”

What's next for khan Academy

“In the future, we plan to integrate backend functionality to support real user authentication, live course progress tracking, and dynamic content loading. We also aim to add video streaming capabilities for lessons, quizzes for interactive learning, and a personalized dashboard for users. Expanding the site to support multiple languages and adding accessibility improvements will further make the platform more inclusive and globally scalable.”

Built With

Share this project:

Updates