In this project, I recreated the landing page of Oli Harris's portfolio website. This was a challenge from Frontend Practice. The project involves building a responsive website for a design agency called OH Studio. The website should have a clean and modern design, with a homepage showcasing the agency's work, services, and contact.
Client: React, TailwindCSS, Framer Motion.
Hosting: Vercel.
Clone the project
git clone https://github.com/victorcodess/oh-studio-landingGo to the project directory
cd folio-v1Install dependencies
npm installStart the server
npm run devIn this project I learnt a couple of new things, especially CSS and JavaScript animations. The toughest part was recreating the hover animations on the project cards and also animating the SVG stroke-width and translate properties. I also used react-intersection-observer to animate the text fading in on both page load and while scrolling. I used CSS backdrop filters to create the blurred glass effect on the fixed navigation menu.