DevPortfolio: Developer Profile Management Platform

Table of Contents

• Project Overview
• Key Features
• Tech Stack
• Team Structure
• Installation
• Project Structure
• Design Philosophy
• Future Roadmap
• Contributors
• License

Project Overview

DevPortfolio is a comprehensive platform designed to empower developers in managing their professional identity. This student project combines portfolio management, ATS-optimized resume generation, and job application tracking into a single cohesive system. Built as a capstone project, it demonstrates modern web development practices with emphasis on usability, accessibility, and visual appeal.

Key Features

✨ Portfolio Manager
📄 Smart Resume Generator
🔍 ATS Compatibility Tracker
🌓 Dark/Light Mode Toggle
📱 Fully Responsive Design
🎨 Custom Theme Support
⚡ Performance Optimized

Tech Stack

Frontend

• React 18 with Hooks
• Tailwind CSS + Custom CSS Modules
• GSAP for performant animations
• React Router DOM for navigation
• Vite build tool

Backend (Future Implementation)

• Node.js/Express
• MongoDB
• JWT Authentication

Team Structure

Role	Team Member	Responsibilities
ML Lead	[Name]	ATS algorithm development, data modeling
ML Lead	[Name]	Recommendation systems, NLP integration
Fullstack Developer	[Name]	API development, database design
Fullstack + Security	[Your Name]	Auth systems, security protocols, backend
Frontend Lead	[Name]	UI/UX implementation, component library

Installation

1. Clone the repository:

git clone https://github.com/your-repo/devportfolio.git
cd devportfolio


## Install dependencies:

npm install

npm run dev

npm run build
npm run preview



## Project Structure
text
devportfolio/
├── src/
│   ├── assets/                 # Static assets
│   ├── components/             # Reusable components
│   ├── pages/                  # Page components
│   ├── styles/                 # CSS modules
│   ├── utils/                  # Helper functions
│   ├── App.jsx                 # Root component
│   └── main.jsx                # Entry point
├── public/                     # Public assets
├── tailwind.config.js          # Tailwind config
└── vite.config.js              # Vite config
Design Philosophy
Color Palette
Primary: #40E0D0 (Turquoise)

Dark BG: #0D1117 (Navy)

Accent: #9C27B0 (Purple)

Text: #E5E5E5 (Light) / #1F2937 (Dark)

Animations
GSAP-powered scroll-triggered animations

Subtle bounce effects for engagement

Performance-optimized motion

UI Principles
Mobile-first responsive design

Accessible color contrasts

Consistent spacing system

Intuitive navigation

Future Roadmap
Backend API integration

Advanced ATS scoring system

User customization dashboard

Analytics tracking

Multi-format export (PDF, JSON, XML)

Contributors
👨‍💻 Harshita Bhanu - Fullstack & Security
👩‍💻 Karan Pawar - Frontend Lead
🧑‍💻 Divanshu Bhargava - ML Lead
👨‍💻 Aayushi Thakre - ML Lead
👩‍💻 Aryan Kesarwani - Fullstack Developer

License
This project is licensed under the MIT License - see the LICENSE file for details.

<div align="center"> <sub>Built with ❤️ by Team DevPortfolio | Capstone Project 2023</sub> </div>