Roadmap Learning Platform

This project is a web-based platform designed to help users achieve their learning goals through structured roadmaps. Users can explore various roadmaps, track their progress, and interact with AI-powered chatbots for guidance.

Features

• Roadmaps: Explore curated learning paths with steps and topics to achieve specific goals.
• Progress Tracking: Track your progress through roadmaps and mark steps as completed.
• User Profiles: Manage your profile, including updating your name and profile picture.
• AI Chatbot: Interact with an AI chatbot for personalized learning assistance.
• Trending Topics: Discover the most popular study fields and topics.
• Resource Management: Access resources like articles, videos, and tutorials for each topic.

Tech Stack

• React: A JavaScript library for building user interfaces.
• Vite: A fast build tool for modern web projects.
• CSS Modules: Scoped and modular CSS for styling components.
• React Router: For client-side routing.
• Axios: For making HTTP requests to the backend.
• React Icons: For adding icons to the UI.

Installation

Steps

1. Clone the repository:

   git clone <repo-url>
   cd Capstone
   cd frontend
   

2. Install dependencies:

   npm i
   

3. Set up environment variables:

   VITE_UNSPLASH_API_KEY=<your-unsplash-api-key>
   VITE_GROQ_API_KEY=<your-groq-api-key>
   

4. Start the frontend development server:

   npm run dev
   

Folder Structure

• src/components: Reusable React components.
• src/pages: Page-level components for routing.
• src/services: API service files for interacting with the backend.
• src/styles: CSS modules for styling.