Animated Responsive Navbar (Part 1) - React & CSS Animation Tutorial for Beginners

Published: 29 December 2022
on channel: TK
1,726
28

Animated Responsive Navbar (Part 1) - React & CSS Animation Tutorial for Beginners

#42 #navbar #responsive #react #CSS #tutorial

Due to the length of this video, I wanted to keep it as short as possible. So I split this tutorial into 2 parts. Part one is creating a navbar with CSS animation, and the responsive problem. For part two, we will use the React Router and Framer Motion to make the page transitions.

00:00 Demo
01:00 Intro
02:18 Design the Logo
04:56 Dive into Coding
09:08 CSS
13:36 Navbar animation
16:26 Responsive

The next video: Page Transitions In React (Part 2) - React Router V6 and Framer Motion Tutorial
   • Page Transitions In React (Part 2) - React...  

My finished project (GitHub): https://github.com/thekietvuong/The-R...

Install React Icons: npm install react-icons

Lorem Ipsum Generator:
https://loremipsum.io/

Check out my Etsy shop:
https://www.etsy.com/shop/DesignByKiet

Download and install Node JS right here:
https://nodejs.org/en/

Check out the dropdown menu - React tutorial right here:
1.Dropdown Menu - React Tutorial for Beginners
   • Dropdown Menu - React Tutorial for Beginners  

2.Click Outside to Close - React Hook
https://www.youtube.com/watch?v=HfZ7p...

🎵Track: Rewind
Youtube Library Audio


On this page of the site you can watch the video online Animated Responsive Navbar (Part 1) - React & CSS Animation Tutorial for Beginners with a duration of hours minute second in good quality, which was uploaded by the user TK 29 December 2022, share the link with friends and acquaintances, this video has already been watched 1,726 times on youtube and it was liked by 28 viewers. Enjoy your viewing!