#typescript #tailwindcss #react #reactfrontend #reactrouter #zustand
Hi Everyone!
In this video, I am going to teach you Zustand for state management and Tanstack Router for routing of React app by building a note taking app.
This project is called NoteVault and is built with React, TypeScript, Tailwind CSS, Zustand, and Tanstack Router. This project is designed to help you learn how to integrate these powerful technologies to create a responsive and efficient web application. Whether you're a beginner or an experienced developer, NoteVault offers a hands-on approach to understanding state management, routing, and styling in a React environment.
*-*-*-*-* Get Alerts for New Courses and Content Releases
https://arnacode.com/
*-*-*-*-* Features
- State Management with Zustand
- Routing with TanStack Router
- Type Safety
- Note Management
- Tagging System
- Responsive Design
Chapters
00:00:00 App Overview
00:06:36 App Setup
00:09:18 Implementing the Routing - TanStack Router
01:04:27 Coding the Navigation
01:23:42 Coding the Note Vault Page
01:33:17 The need for Zustand
01:36:42 Implementing a Zustand Store with Middleware
02:06:17 Coding the Note Edit/New Note Page
03:25:29 Coding the Notes List Page
03:59:29 Coding the Note Details Page
04:19:56 Coding the Tags Page
05:07:50 Conclusion
*-*-*-*-* Source Code
https://github.com/ArnaCode/React-Zustand-Typescript-TanStack-Router-Tailwind-NoteVault-App