DevFolio Pro

Inspiration

As CS students, we struggled to showcase everything in one place — projects, certificates, LeetCode stats, internships. LinkedIn felt too formal, GitHub showed only code, and resumes had no space for achievements. We always ended up sharing 5 different links to recruiters. That frustration sparked DevFolio Pro.

What it does

DevFolio Pro is a one-stop developer portfolio platform where students can showcase projects, skills, certificates, internships, and hackathons. It auto-fetches live coding stats from LeetCode, Codeforces, and GitHub. Every user gets a shareable public profile link to send directly to recruiters.

How we built it

We built the frontend using React 18 with Vite and Tailwind CSS for a clean dark-themed UI. The backend runs on Node.js with Express and MongoDB for data storage. We integrated GitHub REST API, LeetCode GraphQL API, and Codeforces API for live stats, and deployed using Railway and Vercel.

Challenges we ran into

LeetCode, Codeforces, and GitHub all have completely different API structures which made integration tricky. We hit peer dependency conflicts with Cloudinary, regex errors with skill names like C++ and C#, and React white screen issues due to provider ordering. Windows vs Linux path differences also caused unexpected crashes during development.

Accomplishments that we're proud of

We successfully integrated 3 live coding platform APIs with real-time stat fetching in a single dashboard. Built 13+ feature modules including a badge system, public profile, and learning tracker entirely from scratch without any UI component library.

What we learned

We learned that proper error handling and graceful API fallbacks matter more than adding extra features. Setting up .gitignore before the first commit, handling cross-platform path issues, and keeping backend routes modular were our biggest technical takeaways.

What's next for DevFolio Pro

We plan to add an AI-powered resume builder using Claude API that auto-generates resumes from the user's profile. GitHub contribution heatmap, mobile app using React Native, and one-click portfolio PDF export are also on our roadmap.

Built With

• api
• atlas
• axios
• cloudinary
• css
• express.js
• github
• javascript
• jwt
• mongodb
• mongoose
• motion
• multer
• node.js
• railway
• react
• recharts
• rest
• router
• tailwind
• vercel
• vite