AI Roadmap Generator

• 

  AI-powered platform that generates personalized learning roadmaps based on your goals, skills, and time.

Inspiration

In today’s world, students and beginners often feel overwhelmed when starting a new field. Whether it's web development, data science, or AI, the biggest question is:

“What should I learn next?”

There are countless resources online, but no clear, structured path tailored to an individual’s current skills, goals, and time availability.

This inspired us to build an intelligent system that removes confusion and provides a clear, personalized roadmap using AI.

What it does

AI Roadmap Generator creates structured learning paths for users based on:

Target role (e.g., Frontend Developer, Data Scientist) Current skills Time availability

It generates:

Phase-wise learning plan Skills to learn Real-world projects Curated learning resources

Users can also:

Sign up and log in securely Save their roadmaps View detailed roadmaps Delete roadmaps Copy roadmap for external use

How we built it

Frontend React.js Tailwind CSS React Router for navigation State management using hooks

Backend Node.js + Express.js MongoDB + Mongoose JWT-based authentication

AI Integration Used LLM via API to generate structured roadmap JSON Prompt engineered to ensure: Structured output Real-world projects Valid learning resources

Challenges we ran into

1. Parsing AI Response

The AI response was not always clean JSON.

Solution:

Used regex to extract JSON Added error handling for invalid responses

1. Authentication Issues

Faced issues with:

Token not being stored Unauthorized (401) errors

Solution:

Fixed frontend token handling Debugged middleware and JWT verification

Accomplishments that we're proud of

Built a full-stack AI-powered application from scratch within a limited timeframe Successfully implemented secure authentication using JWT and protected routes Integrated an AI model to generate structured, personalized learning roadmaps Designed a clean and responsive UI with grid layouts, detail pages, and smooth UX Enabled users to save, view, copy, and delete roadmaps Handled real-world challenges like API errors, JSON parsing, and async data flow Delivered a complete, usable product rather than just a prototype

What we learned

Implementing JWT authentication and protected routes Handling real-world API responses and parsing AI output Building a full-stack application from scratch Writing effective AI prompts (prompt engineering) Managing user-specific data in MongoDB

What's next for AI Roadmap Generator

Add PDF export for easy sharing of roadmaps Introduce favorites/bookmarking for important roadmaps Build a progress tracking system to track learning completion Improve AI to generate more personalized and adaptive roadmaps Add real-time resource validation to ensure all links are always working Enhance mobile responsiveness for better accessibility Enable community features like sharing roadmaps with others

Built With

• express.js
• mongodb
• node.js
• react
• tailwind