YoVDO

React Project Tutorial – Build a Portfolio Website w/ Advanced Animations

Offered By: freeCodeCamp

Tags

React Courses Web Development Courses 3d Animation Courses CSS Animation Courses SVG Animation Courses

Course Description

Overview

Build a React portfolio website from scratch with advanced animations in this comprehensive tutorial. Learn to create SVG animations using GSAP, animate letters on hover with Animate.css, implement page loading animations with React-Loaders, and add a Pacman animation. Master custom 3D CSS animations, integrate font icons, and create a functional contact form using EmailJS. Explore how to incorporate maps into your website using Leaflet.js. Follow along as the instructor guides you through setting up a React app, installing necessary libraries, defining global styles, creating routes, and constructing various components including a left sidebar, home page, about page, and contact page. Gain hands-on experience in drawing SVG logo animations and building page loaders to enhance your portfolio's visual appeal and functionality.

Syllabus

) Intro.
) Create React app with npx.
) Instaling libraries.
) Define global styles.
) Create routes.
) Building left sidebar.
) Building site layout.
) Building Home page.
) Draw SVG Logo animation.
) Build About page.
) Build page loader.
) Build Contact page.


Taught by

freeCodeCamp.org

Related Courses

CSS Animation With Latest Effects - 2020
Udemy
Creative Advanced CSS & JavaScript Animations - 150 Projects
Udemy
Level Up Your CSS Animation Skills
Udemy
Advanced CSS and Sass: Flexbox, Grid, Animations and More!
Udemy
CSS - Basics to Adv for front end development
Udemy