The Perfect Advanced React/TypeScript Project – Markdown Supported Note Taking With Categories

Highlight: https://app.highlight.run/?promo=WEBDEVSIMPLIFIED
Coupon Code: WEBDEVSIMPLIFIED (This should be automatically filled in as you go through the signup process)

Todo lists are boring and pretty limited so in this video I am going to show you how to build a more advanced project that covers all the features of a todo list while also adding tons of additional features like categories, markdown support, filter, etc. This is a great intermediate to advanced project.

📚 Materials/References:

GitHub Code: https://github.com/WebDevSimplified/react-note-taking-app
React Router Video: https://youtu.be/Ul3y1LXxzdU
React Router Article: https://blog.webdevsimplified.com/2022-07/react-router
React Multiselect Video: https://youtu.be/bAJlYgeovlg

🌎 Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified

⏱️ Timestamps:

00:00:00 – Introduction
00:00:30 – Demo
00:01:10 – Setup
00:02:20 – Routing
00:05:38 – New Note Form JSX
00:13:18 – New Note Form Functionality
00:19:19 – useLocalStorageHook
00:24:40 – Note Creation Logic
00:28:53 – Tag Creation Logic
00:33:37 – Note List Page
00:50:20 – Note Layout Wrapper
00:53:45 – Note Show Page
00:58:10 – Note Edit Page
01:02:42 – Delete Note Logic
01:04:35 – Edit/Delete Tags Modal

#React #WDS #TypeScript