TechNav: AI Powered Career Navigation

A premium AI mentor and execution roadmap platform for computer_science students to discover their ideal tech domain and transition seamlessly from zero to industry-ready.

Comment

Inspiration

As a computer science student, I realized there are way too many career options in tech today (like 40+ different fields!). It gets super confusing. Most students don't know what to choose, and sometimes they end up wasting whole semesters learning things they don't even enjoy. Even if they pick a field, they don't know the exact steps to get a job in it. I built TechNav to solve this exact problem and give students a clear, step-by-step path from college to their first job.

What it does

TechNav is a platform that acts like a personal tech career guide. Here is how it helps:

  1. Interest Quiz: A quick, smart quiz that figures out what you actually like doing and suggests the best tech careers for you.
  2. AI Mentor: A 24/7 chat assistant that answers your specific doubts and gives you advice based on the career you are looking at.
  3. Clear Roadmaps: Step-by-step guides showing exactly what to learn from day one to getting hired. You can even download these as cool dark-themed PDFs.
  4. Market Reality: It shows you actual data on how much demand a job has and what salary you can expect.

How we built it

I wanted the website to look really cool—like a hacker terminal—but also run super fast.

  • Frontend: Built using the latest React 19 and Vite.
  • Design: Used Tailwind CSS for a strict dark theme. Added Framer Motion and a custom cursor to make everything feel smooth and premium.
  • AI Feature: Used the Groq API (Llama 3) to make the AI chat super fast and smart.
  • Hosting: Deployed the whole project on Vercel.

Challenges we ran into

Building this wasn't easy, especially with the deadline approaching:

  • Version Conflicts: Because I used the newest React 19, a lot of older libraries (like the smooth scrolling one) started breaking. My Vercel builds kept crashing with 'Exit Code 1'. I had to dig deep into npm commands and use --legacy-peer-deps to finally force the build to work.
  • The PDF Download Issue: I wanted users to download roadmaps, but installing more heavy libraries was breaking the app again. So, I used a clever trick with a basic html2pdf.js script to turn the web page directly into a PDF without ruining the dark theme.
  • Controlling the AI: Making sure the AI mentor only talks about career advice and doesn't just give random answers took a lot of testing and prompt tweaking.

Accomplishments that we're proud of

  • Fixing those terrible Vercel build errors right before the deadline without giving up.
  • Building a floating AI chat button that looks awesome and works perfectly without lagging the site.
  • Designing a dark, techy UI that actually feels fun to use instead of looking like a boring college portal.

What we learned

This hackathon really tested my debugging skills. I learned how to fix messy dependency errors, manage Vercel deployments properly, connect fast AI models, and generate files directly from the browser without extra npm packages.

What's next for TechNav

  • Adding a login system so users can save their quiz results and roadmaps.
  • Building a community section where students can talk to people who are already working in the industry.
  • Upgrading the AI so it can check a user's GitHub profile and give them tips on how to improve their projects.

Built With

Share this project:

Updates

Submission history