| 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: '0.6rem', margin: '0.5rem 0' }}> |
| {project.highlights.map((h, i) => ( |
| <li key={i} style={{ display: 'flex', gap: 12, fontSize: '0.82rem', color: 'var(--text-secondary)', lineHeight: 1.6 }}> |
| <span style={{ |
| minWidth: 22, height: 22, borderRadius: '50%', |
| background: `${project.accent}15`, border: `1px solid ${project.accent}30`, |
| color: project.accent, fontSize: '0.7rem', fontWeight: 700, |
| display: 'flex', alignItems: 'center', justifyContent: 'center', |
| flexShrink: 0, marginTop: 2 |
| }}> |
| {i + 1} |
| </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> |
| ) |
| } |
|
|
