After much dedication and a significant learning curve, I'm delighted to share my interactive online resume! This project is particularly special to me because it's one of the very first project I built from the ground up while diving deep into the React.
Key Features:
- Smooth Full-Page Snap Scroll ➡️ One of the core UX features is the snap-scroll navigation. This creates a polished, controlled scrolling experience where each section neatly snaps into view.
How it works: Achieved primarily using CSS scroll-snap-type: y mandatory; on the main container and scroll-snap-align: start; on each section. This ensures that when a user scrolls, the viewport "snaps" to the beginning of a new section.
<main className="h-screen overflow-y-scroll
snap-y snap-mandatory sm:snap-none
md:snap-y md:snap-mandatory"
>
<section id='home' className='snap-start min-h-screen'>
<Header />
</section>
I also implemented conditional snapping with Tailwind's responsive prefixes (sm:snap-none md:snap-y md:snap-mandatory) to ensure a smoother, more natural scrolling experience on mobile devices where content might extend beyond min-h-screen.
- Responsive Project Showcase 💻 My projects are displayed in a clean, responsive grid, making it easy to browse on any device.
Check it Out!
I invite you to explore the live version of my portfolio to see these features in action:
👉 Live Demo: https://react-basic-resume.vercel.app/
The complete source code is also available on GitHub. Feel free to clone it, explore, and provide any feedback!
🧑💻 GitHub Repository: https://github.com/Gojer16/Personal-Resume
Let's Connect!
I'm currently seeking new opportunities, including networking, full-time roles, collaborations, and freelance projects. Don't hesitate to reach out!
Top comments (0)
Some comments may only be visible to logged-in visitors. Sign in to view all comments.