Inspiration

Everyone watches YouTube videos to learn and stay informed, but how can you be sure you've understood everything explained in the video? Video2Quiz.Ai – the app designed to test your knowledge about the YouTube videos you've just watched. With Video2Quiz.Ai, you can transform any YouTube video into an engaging quiz that helps reinforce what you've learned and ensures you grasp the key concepts.

What it does

Key features of Video2Quiz.ai includes: AI-Powered Quiz Generation: Simply enter the URL of any YouTube video, and our AI will generate a comprehensive quiz based on the video's content. Real-Time Knowledge Testing: Immediately test your understanding of the video and get a score. Save and Review Quizzes: Save quizzes to revisit later in your dashboard after authentication, and review your past quizzes to track your learning progress. Responsive Design: Enjoy a seamless experience across all devices, whether you're on your phone, tablet, or desktop.

How we built it

To build this, I've used Next.js as a full stack framework, an npm package called YouTube-transcript to get the text from the YouTube video links, and then send this transcribed text to Google's Gemini ai model to generate multiple choice questions. Then show these questions to the user and then they can choose the answers when they click on the submit button they will get their score of how they have performed in the MCQ test. For now, I've stored these user-generated quizzes using MongoDB as database. They can later on come to the website and see the saved quizzes that they have generated and also see the correct answers.

Challenges we ran into

The biggest challenge was to prompt the Gemini model to do the quiz generation from the transcript of the YouTube video. As this was my first time using Gemini API it was quite hard for me. Then the next hurdle was in understanding the type of response model was sending to me it was very cluttered so doing a cleanup of it. And after removing any type errors I could show it perfectly to the users in the UI. Other than this, I've used Next.js for this project, I understood server actions, file-based routing, and other features of Next.js from which I was impressed, and will use it for my future projects.

Accomplishments that we're proud of

The most pride taken accomplishment of this project was to be able to connect my client component to the backend route and that backend route to Gemini API.

What we learned

I learned about Next.js and its features like server-side rendering, client side rendering and server actions and what to use when. Also, learnt to integrate AI model in the project.

What's next for Video2quiz.ai

For future, I want to show users the analytics of their performance on the basis of how many quizzes they have solved and the average score they obtain. Another task would be to have a leaderboard and other things to gamify the learning process.

Built With

  • accertinity-ui
  • ai
  • gemini
  • next.js
  • tailwind
Share this project:

Updates