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

Introduction to ReactJS
Microsoft via edX
Front-End Web Development with React
The Hong Kong University of Science and Technology via Coursera
Multiplatform Mobile App Development with React Native
The Hong Kong University of Science and Technology via Coursera
Client-based Web Applications development: ReactJS & Angular
Universidad Politécnica de Madrid via Miríadax
React
Udacity