Personal portfolio site: about, certifications, education, internships, and project write-ups, all driven from a single content file so the site can be updated without touching component code.
Live at sfeirc.github.io/PORTFOLIO.
- Next.js 15 (App Router, static export) / React 19 / TypeScript
- Tailwind CSS for styling
- Framer Motion + GSAP for animations and page transitions
- react-three-fiber / drei / three.js for the 3D hero background
- Heroicons / react-icons for iconography
All page content — nav links, skills, certifications, internships, projects, PDF/image link mappings — lives in src/data/portfolioData.json, with src/data/usePortfolioData.ts transforming the raw JSON into typed React data (mapping icon-name strings to actual icon components, resolving image/PDF paths through imageMappings/pdfMappings lookup tables). Components (Hero, About, Projects, ProjectSkillsMatrix, Navbar) consume that typed data — updating the site is usually a JSON edit, not a component rewrite.
The site is a fully static export (output: 'export' in next.config.ts) deployed to GitHub Pages under the /PORTFOLIO base path, with a custom image loader (image-loader.js) so local image paths resolve correctly under that subpath.
npm install
npm run dev # http://localhost:3000
npm run build # static export to ./out
npm run lintPersonal project — feel free to look, not to republish as your own.