EduVerse AI–Your Personalized AITeacher for Smarter Learning

• 

  starts with login credentials

• 

  shows the what content is in Eduverse AI

• 

  you have to login with Supabase linked email for security purpose For trail you can use demo credentials

• 

  This is the lessons section

• 

  This is AI Teacher Chat

• 

  quiz questions for better learning

Inspiration

In today’s rapidly evolving educational landscape, students are often overwhelmed by the abundance of resources but lack personalized guidance. We were inspired to build EduVerse AI to bridge this gap with the power of AI—offering an interactive learning platform that combines static lessons, real-time AI chat, and self-assessment tools like quizzes.

My goal was to create a friendly, personalized educational assistant that can teach, answer, and test, all in one place—especially for beginners in web development.

What it does

EduVerse AI is an AI-powered learning platform where students can:

• Learn from handpicked static lessons on HTML, CSS, and JavaScript.
• Chat with an AI Teacher (GPT-3.5) for explanations, clarifications, and motivation.
• Take interactive quizzes to test their understanding.
• Login securely using Supabase Authentication.

How we built it

We used a modern full-stack front-end toolkit:

• Frontend: Vite + React + TypeScript
• Styling: Tailwind CSS
• Authentication: Supabase (email/password login)
• AI Chat: OpenAI GPT-3.5 Turbo API
• Routing: react-router-dom
• Project Structure: Modular components for Navigation, AI Chat, Lessons, and Quizzes

I managed state locally and routed pages using protected and public route logic.

Challenges we ran into

• Setting up Supabase Auth correctly and ensuring protected route redirection worked was initially tricky.
• Managing OpenAI API responses and error states inside the chat while maintaining a smooth user experience.
• Debugging vite HMR (Hot Module Reload) errors and broken imports across nested components.
• Tailwind CSS class debugging and consistent styling across components.

Accomplishments that we're proud of

• Built a complete AI-powered education app in a modular structure.
• Integrated OpenAI GPT-3.5 Turbo into a usable and responsive chat UI.
• Deployed a secure login system using Supabase with smooth UX.
• Designed a clean and interactive UI using Tailwind CSS.

What we learned

• How to build a modern front-end app with Vite + React + TypeScript.
• How to connect GPT-3.5 API for conversational AI inside a web app.
• How to handle authentication logic and protected routes with Supabase.
• How to manage page-level state and navigation using React Router.
• How to organize a scalable component-based project structure.

What's next for EduVerse AI–Your Personalized AITeacher for Smarter Learning

• Store user learning progress and chat history using Supabase DB.
• Add video-based lessons and in-depth coding projects.
• Implement adaptive quizzes using AI-generated questions.
• Support multi-language learning modes for global learners.
• Enable context-aware AI memory for ongoing learning sessions.

Built With

• gpt-3.5turbo
• openrouterapi(openai-compatible)
• react+vite
• react-markdown
• react-router-dom
• supabase(auth&db)
• tailwindcss
• typescript