YoVDO

Animated Portfolio Website with React and Framer Motion - React Project for Beginners

Offered By: Lama Dev via YouTube

Tags

React Courses Responsive Design Courses Framer Motion Courses

Course Description

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
Create an animated portfolio website using React and Framer Motion in this comprehensive tutorial for beginners. Learn essential techniques like scroll snapping, sidebar animations, parallax effects, and progress bars. Master Framer Motion hooks such as useScroll, useTransform, and useInView to create engaging animations. Design responsive sections including a navbar, hero, services, portfolio, and contact form. Implement smooth scrolling, SVG animations, and an animated mouse cursor. Conclude with deploying your React app to shared hosting, equipping you with the skills to build an impressive, interactive portfolio website.

Syllabus

Introduction
Installation
How To Scroll Snap CSS Snap Scroll Effect
Global CSS
Navbar Design
React Framer Motion Crash Course
Animated Sidebar Hamburger Menu Animation
How to smooth scroll between HTML sections?
Hamburger Menu Button SVG Animation
Sidebar Menu Link Animations
Animated Hero Section Design
Framer Motion Sliding Text Animation
Framer Motion Parallax Tutorial
Framer Motion useScroll and useTransform Hook Tutorial
Services Section Design
Framer Motion How to Animate in View useInWiew Hook
Animated Portfolio Section Design
Framer Motion Animated Progress Bar
How to Animate Items on Scroll?
Contact Section Design
How to send mail in React?
React Animated Mouse Cursor
Mobile Responsive Design
How to Deploy React App to a Shared Hosting
Outro


Taught by

Lama Dev

Related Courses

Framer Motion for React Tutorial
Net Ninja via YouTube
Animating React Components with Framer Motion
egghead.io
Animate React Apps with Framer Motion
egghead.io
Build and Deploy a Fullstack Responsive Portfolio Website - Ultimate Step by Step Tutorial 2022
JavaScript Mastery via YouTube
How to Make a React Website with Page Transitions Using Framer Motion
Brian Design via YouTube