
In this video, you will learn how to build React portfolio website from scratch with advanced animations.
โ๏ธ Slobodan developed this course: https://www.youtube.com/channel/UCBu5ulO4d-d47lAVybpRTkw
๐ Code and assets: https://github.com/bobangajicsm/react-portfolio-website
๐ Map library https://react-leaflet.js.org/
๐ EmailJS library: https://www.emailjs.com/docs/examples/reactjs/
๐ Final version: https://bobangajicsm.github.io/portfolio
Learn:
โ๏ธ How to draw SVG animation using GSAP and React
โ๏ธ How to animate letters on hover using Animate.css and React
โ๏ธ How to add page loading animation using React-Loaders
โ๏ธ How to add Pacman animation in React
โ๏ธ How to create custom 3D CSS animations
โ๏ธ How to implement font icons in React
โ๏ธ How to create and implement contact form in React using EmailJS
โ๏ธ How to add maps to your website in React using Leafleat.js
โญ๏ธ Course Contents โญ๏ธ
โจ๏ธ (0:00:00) Intro
โจ๏ธ (0:00:43) Create React app with npx
โจ๏ธ (0:01:01) Instaling libraries
โจ๏ธ (0:03:56) Define global styles
โจ๏ธ (0:06:56) Create routes
โจ๏ธ (0:09:01) Building left sidebar
โจ๏ธ (0:20:31) Building site layout
โจ๏ธ (0:23:01) Building Home page
โจ๏ธ (0:40:51) Draw SVG Logo animation
โจ๏ธ (0:48:29) Build About page
โจ๏ธ (1:03:56) Build page loader
โจ๏ธ (1:06:11) Build Contact page
๐ Thanks to our Champion and Sponsor supporters:
๐พ Raymond Odero
๐พ Agustรญn Kussrow
๐พ aldo ferretti
๐พ Otis Morgan
๐พ DeezMaster
โ
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://freecodecamp.org/news
And subscribe for new videos on technology every day: https://youtube.com/subscription_center?add_user=freecodecamp