File size: 7,956 Bytes
0ed2558 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 | import { motion } from 'framer-motion'
import { useInView } from 'react-intersection-observer'
import { FiGithub, FiExternalLink, FiFolder } from 'react-icons/fi'
const PROJECTS = [
{
number: '01',
title: 'Healthcare Chatbot',
description: 'AI-powered healthcare assistant with semantic retrieval over curated medical knowledge.',
highlights: [
'RAG pipeline with Pinecone for semantic document retrieval',
'LangChain + Groq LLM for accurate, context-aware responses',
'Streamlit UI with conversation history & real-time streaming',
],
tags: ['RAG', 'Pinecone', 'LangChain', 'Groq LLM', 'Streamlit'],
github: 'https://github.com/babaiii07/Agentic-HealthCare-Chatbot',
demo: 'https://parthib07-multiagent-healthcare-chatbot.hf.space',
accent: '#6366f1',
},
{
number: '02',
title: 'AI Virtual Dev POD',
description: 'Multi-agent SDLC automation platform where specialized agents manage the full dev lifecycle.',
highlights: [
'LangGraph orchestration with PM, Dev, QA, and DevOps agents',
'ChromaDB for persistent cross-agent memory sharing',
'Automated code generation, review, and testing pipelines',
],
tags: ['Multi-Agent', 'LangGraph', 'ChromaDB', 'Agentic AI'],
github: 'https://github.com/babaiii07/AI_Virtual_dev_POD',
demo: 'https://agnik28-ai-virtual-pod.hf.space/',
accent: '#8b5cf6',
},
{
number: '03',
title: 'Virtual Research Assistant',
description: 'Autonomous research workflow that discovers, summarizes, and synthesizes knowledge at scale.',
highlights: [
'AutoGen-powered multi-step research pipeline',
'MySQL-backed persistence for research sessions and citations',
'Groq LLM for rapid summarization and insight extraction',
],
tags: ['AutoGen', 'Groq LLM', 'MySQL', 'NLP'],
github: 'https://huggingface.co/spaces/parthib07/Virtual_Research_Paper_Assistant/tree/main',
demo: 'https://parthib07-virtual-research-paper-assistant.hf.space',
accent: '#06b6d4',
},
{
number: '04',
title: 'OwnGPT',
description: 'Secure, AI-powered platform that transforms enterprise data into actionable insights through natural language interaction.',
highlights: [
'Enterprise-grade RAG system with multi-source ingestion (documents, DBs, APIs)',
'LangGraph + LangChain orchestration for intelligent reasoning workflows',
'Secure authentication (Google Auth) with scalable FastAPI backend',
],
tags: ['FastAPI', 'LangChain', 'LangGraph', 'MongoDB', 'Google Auth', 'Python'],
github: null,
demo: 'https://parthib07-owngpt-v2.hf.space',
accent: '#10b981',
},
{
number: '05',
title: 'CodeFusion',
description: 'AI-powered vibecoding platform designed to enhance developer productivity using DeepSeek intelligence.',
highlights: [
'DeepSeek-powered code generation and intelligent assistance',
'Real-time coding environment with AI-driven suggestions and optimizations',
'Built for developers, data scientists, and AI engineers workflows',
],
tags: ['DeepSeek AI', 'FastAPI', 'React', 'Python'],
github: null,
demo: 'https://codefusion-v2-parthib.onrender.com',
accent: '#f59e0b',
},
{
number: '06',
title: 'AnySITE',
description: 'Next-gen vibecoding platform enabling rapid AI-driven web creation and prototyping.',
highlights: [
'AI-assisted website generation from minimal input (prompt → app)',
'Full-stack generation pipeline with real-time rendering',
'Designed for rapid prototyping and creative development workflows',
],
tags: ['FastAPI', 'React', 'AI Models', 'Python'],
github: null,
demo: 'https://anysite-vibecoding-parthib.onrender.com',
accent: '#f43f5e',
},
]
function ProjectCard({ project, index }) {
const [ref, inView] = useInView({ triggerOnce: true, threshold: 0.08 })
return (
<motion.div
ref={ref}
className="glass-card"
style={{ padding: '1.5rem', display: 'flex', flexDirection: 'column', gap: '0.8rem', position: 'relative', overflow: 'hidden' }}
initial={{ opacity: 0, y: 40 }}
animate={inView ? { opacity: 1, y: 0 } : {}}
transition={{ duration: 0.6, delay: (index % 3) * 0.1, ease: [0.22, 1, 0.36, 1] }}
whileHover={{ y: -6 }}
>
<div style={{ position: 'absolute', top: 0, left: 0, right: 0, height: 2, background: `linear-gradient(90deg, ${project.accent}, transparent)` }} />
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<span style={{ fontFamily: 'var(--font-mono)', fontSize: '0.7rem', color: 'var(--text-muted)', letterSpacing: '0.08em' }}>{project.number}</span>
<FiFolder size={18} style={{ color: project.accent, opacity: 0.7 }} />
</div>
<h3 style={{ fontSize: '1.05rem', fontWeight: 700, color: 'var(--text-primary)', lineHeight: 1.3 }}>{project.title}</h3>
<p style={{ fontSize: '0.85rem', color: 'var(--text-secondary)', lineHeight: 1.7 }}>{project.description}</p>
<ul style={{ listStyle: 'none', padding: 0, display: 'flex', flexDirection: 'column', gap: 5, margin: 0 }}>
{project.highlights.map((h, i) => (
<li key={i} style={{ display: 'flex', gap: 8, fontSize: '0.8rem', color: 'var(--text-secondary)', lineHeight: 1.55 }}>
<span style={{ color: project.accent, flexShrink: 0 }}>→</span>
{h}
</li>
))}
</ul>
<div style={{ display: 'flex', flexWrap: 'wrap', gap: 5, marginTop: 'auto' }}>
{project.tags.map(tag => (
<span key={tag} className="tech-tag" style={{ background: `${project.accent}12`, borderColor: `${project.accent}25`, color: project.accent, fontSize: '0.68rem' }}>
{tag}
</span>
))}
</div>
<div style={{ display: 'flex', gap: 8, marginTop: 4 }}>
{project.github && (
<motion.a href={project.github} target="_blank" rel="noopener noreferrer"
className="btn btn-secondary btn-sm" whileHover={{ scale: 1.04 }} whileTap={{ scale: 0.97 }}>
<FiGithub size={13} /> Code
</motion.a>
)}
<motion.a href={project.demo} target="_blank" rel="noopener noreferrer"
className="btn btn-primary btn-sm" whileHover={{ scale: 1.04 }} whileTap={{ scale: 0.97 }}>
<FiExternalLink size={13} /> Demo
</motion.a>
</div>
</motion.div>
)
}
export default function Projects() {
const [ref, inView] = useInView({ triggerOnce: true, threshold: 0.05 })
return (
<section id="projects" className="section">
<div className="orb orb-cyan" style={{ width: 400, height: 400, top: '10%', left: '-8%', position: 'absolute', opacity: 0.35 }} />
<div className="container" ref={ref}>
<motion.div className="section-header"
initial={{ opacity: 0, y: 24 }} animate={inView ? { opacity: 1, y: 0 } : {}} transition={{ duration: 0.55 }}>
<div className="section-tag"><FiFolder size={12} /> Projects</div>
<h2 className="section-title">Featured Work</h2>
<p className="section-subtitle">Production-grade AI systems built with cutting-edge technology.</p>
</motion.div>
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(320px, 1fr))', gap: '1.25rem' }}>
{PROJECTS.map((p, i) => <ProjectCard key={p.number} project={p} index={i} />)}
</div>
<motion.div style={{ textAlign: 'center', marginTop: '2.5rem' }}
initial={{ opacity: 0 }} animate={inView ? { opacity: 1 } : {}} transition={{ delay: 0.5 }}>
<a href="https://github.com/babaiii07" target="_blank" rel="noopener noreferrer" className="btn btn-secondary">
<FiGithub size={15} /> View All on GitHub
</a>
</motion.div>
</div>
</section>
)
}
|