A fully responsive personal portfolio with smooth CSS animations, hover effects and accessible semantic HTML — the first project every Learn Refill student ships.
A first portfolio has to look professional on every screen size and feel alive — without any JavaScript framework.
Semantic HTML5 structure styled with Flexbox and Grid, mobile-first media queries, and CSS keyframes and transitions for reveal, hover and loading effects.
Plan sections and write semantic HTML with proper headings.
Build the layout with Flexbox and Grid, mobile first.
Add transitions, keyframes and hover effects that feel smooth, not distracting.
Check spacing, colours and accessibility on real devices.
Deploy on GitHub Pages or Netlify and share the link.
Every line of AI-generated code is reviewed and understood before it ships.
Certificate after clearing the final interview with 90%+.
This project is part of HTML & CSS with Animations.
A fast, search-engine-friendly job board built with Next.js App Router and TypeScript — server rendering, dynamic metadata, filters and typed API data.
How a role-based learning portal with auto attendance, live class links, quizzes and project uploads is built with Next.js, Node.js, Express and MongoDB.
A complete online store with product search, cart, checkout in payment test mode and an admin panel — built end to end with React, Node.js, Express and MongoDB.