Chakra UI Responsive Sidebar

Code a beautiful sidebar navigation using Chakra UI.

Helpful Links:
Code: https://github.com/bjcarlson42/chakra...
Demo: https://chakra-left-responsive-navbar...
Chakra Docs: https://chakra-ui.com/
Feather React Icons: https://react-icons.github.io/react-i...
Dribbble Design: https://dribbble.com/shots/15307679-S...

This video is part of the "From Design To Code" Playlist: Design 🎨 to Code 💻

0:00 Introduction
0:22 Starter files
0:58 Sidebar.js
6:22 NavItem.js
11:42 NavHoverBox.js
14:23 Conclusion

My Coding Gear:
⌨️  Keyboard - Apple Magic Keyboard - https://amzn.to/3g8A8QI
💻  Laptop - Apple MacBook Pro (2018 / 15 inch) - https://amzn.to/3wddJHL
🖥️  Monitor - Samsung CF390 Series - https://amzn.to/3pDc9fO

My Camera Gear:
📹  Camera - Canon EOS M50 - https://amzn.to/3ixAZfq
🔭  Awesome Camera Lens - Sigma (16mm / f1.4) - https://amzn.to/3pH1K2B
🎤  Microphone - Blue Yeti - https://amzn.to/2TdXLyq
💡  Lights - Neewer LED Lights - https://amzn.to/3gbm6ht

My Favorite Software:
📽️  Final Cut Pro - https://www.apple.com/final-cut-pro/
❗  Student Discount For FCP - https://www.apple.com/us-hed/shop/pro...
🚀  VSCode - https://code.visualstudio.com/

View All My Gear - https://benjamincarlson.io/gear

Support Me:
👨🏼‍💼  Join this channel to get access to perks - @benjamincarlson
💸  Sponsor me on GitHub - https://github.com/sponsors/bjcarlson42

Who Am I?
I’m Benjamin Carlson, a developer, student, and YouTube creator living in CT, USA. I make videos on programming, computer science, and productivity. I also started a programming tutorial website called Coffeeclass (https://coffeeclass.io) that complements this YouTube channel. Finally, I have a newsletter (https://buttondown.email/benjamincarlson) where I send out updates on my recent videos, writing, and anything I’m currently working on or find interesting. You can expect emails every 2 to 3 weeks.

Connect With Me:
📧  Email - [email protected]
🚅  Website - https://benjamincarlson.io
🐦  Twitter - Twitter: bjmncrlsn
🚀  Github: https://github.com/bjcarlson42
💼  LinkedIn - LinkedIn: bjcarlson42
✍️  Medium - Medium: benjamincarlson
📓  Newsletter - https://buttondown.email/benjamincarlson

If you need to contact me, the best way is email. I try to respond to everyone but it may take some time!

Disclaimer: Some of the above links are affiliate links. This means I may receive a small commission at no expense to you. This allows me to continue to post videos like this one!

#chakra #nextjs #designToCode

• #education
• #chakra
• #chakra_ui
• #chakra_ui
• #sidebar_navigation