Google AI — Roadmap App - uPath

Concise overview:

• Purpose: Guides users step-by-step through a learning path. Each step is a widget with a description and resources. Steps are generated via the Prompt API (one step per widget) rather than showing all steps at once.
• Database: Firebase (Firestore + Firebase Admin on server).

Tech stack:

• FIREBASE (client SDK + Admin on server)
• REACT (frontend)
• VITE (build/dev tool)
• EXPRESS (server)
• TAILWIND CSS
• PROMPT API (for generating each learning step)

Versions

• React: 18.x
• Vite: 5.x

Quick setup (Windows)

1. Clone / open repo.

2. Server:

   cd server
   npm install
   # start dev (if package.json defines a dev script)
   node server.js

3. Client:

   cd client
   npm install
   npm run dev

4. Open the client URL shown by Vite.

Environment notes

• Client env vars must use the Vite prefix: VITE_*. Example in client/.env:

  VITE_APP_API_URL=...
  

  Access in code via import.meta.env.VITE_FIREBASE_API_KEY.

Security

• Uses Firebase Auth as the main authenticated

How it works

• Frontend (React + Vite + Tailwind) renders roadmap widgets based on a node graph stored in Firestore.
• Each widget is a node with resources and a goal.
• New next-step nodes are generated by calling the Prompt API; results are stored in Firestore via the Express server.
• Server uses Firebase Admin SDK for authenticated DB ops.

Check it out Here

ADMIN LOGIN:

• email -> admin@test.com
• password -> admin12345

uPath

Demo Video

[Click Me!](https://youtu.be/ya7St-rhShY?si=DsX1LHmfDvkIZixX)