AI-powered Skill Constellation App that helps you visualize your skills, discover new ones, and create a personalized career roadmap.
- 📝 Onboarding Form – Add known skills + select a target career role
- 🤖 AI Skill Suggestions – Personalized recommendations with difficulty levels
- 🌐 Interactive Constellation – Skills visualized as nodes:
- 🟢 Mastered skills
- 🟡 Suggested skills
- 🔵 Related skills
- 🎯 Career-Focused Growth – Understand dependencies & build your roadmap
| Frontend | Backend | AI/ML |
|---|---|---|
| React, TailwindCSS, D3.js | Node.js, Express | Custom AI skill recommendation engine |
- 🍴 Clone the repository
git clone
cd skillmap
-
⚙️ Install dependencies
npm install
-
🚀 Start the Backend server
cd backend
node server.js
- 💻 Running the Frontend Locally
1. 📂 Open the frontend folder in VS Code
2. ⚡ Click `Go Live` in the bottom-right corner
3. 🌐 The app will open in your default browser
- 🌐 HTML5 – Structure and content
- 🎨 CSS3 – Styling with custom animations and gradients
- 💻 JavaScript (ES6+) – Client-side functionality and interactivity
- 🛠️ Tailwind CSS – Utility-first CSS framework for styling
- 🔤 Google Fonts (Orbitron, Inter, Exo 2) – Typography
- 🟢 Node.js – JavaScript runtime environment
- ⚡ Express.js – Web application framework
- 🔒 CORS – Cross-Origin Resource Sharing middleware
- 🗝️ dotenv – Environment variable management
- 🤖 Ollama – Local LLM framework
- 🧠 Mistral model – AI model for skill suggestions
- 🗺️ Custom skill graph logic – Predefined skill relationships and pathfinding
- 📦 ES Modules – Import/export syntax
- 🌐 node-fetch – HTTP requests for AI API calls
- 💾 Local Storage – Client-side data persistence
- 🌌 Interactive constellation visualization
- 🤖 AI-powered skill recommendations
- 🗺️ Skill dependency mapping and pathfinding
- 📱 Responsive design with glassmorphism UI
- ✋ Drag-and-drop constellation navigation
- 🔍 Zoom controls for constellation exploration
- 🖌️ Canvas API – For potential export functionality
- 📐 CSS Grid & Flexbox – Layout
- ✨ CSS Animations and Transitions
- 💾 Local Storage API – Data persistence
- User authentication & personalized constellation states
- Progress tracking dashboard
- Integration with external learning resources
- Mobile responsiveness & accessibility improvements