Full Stack Project Manager App Using, React, Next Js, Mongo DB, Tailwind CSS скачать в хорошем качестве

Full Stack Project Manager App Using, React, Next Js, Mongo DB, Tailwind CSS

In this video, we will be building a full stack project manager App, using the latest technologies, react, tailwind css, next js, mongo db for storing our projects. Also we will be adding clerk for authentification. 👉 Source Code: https://ko-fi.com/s/5ee03607f9 👉 Source code of all my projects: https://ko-fi.com/devscript/shop 👉 Live Project: https://project-master-iota.vercel.app/ 👉 Save your code snippets for FREE: https://www.snippetsaver.com/ Connect with DevScript: 🐦 Twitter: https://x.com/Devscript05 ------------------- Watch Full Stack AI Content Generator tutorial: 👉    • Full Stack AI Content Generator Saas ...   Watch Full Stack Task Management tutorial: 👉    • Full Stack Task Manager App with Reac...   ------------------- Chapters: 00:00:00 Demo of the project 00:07:46 Setting up the project 00:11:14 Creating the sidebar 00:15:58 Adding the header and the sub heading in the dashboard 00:25:38 Creating the project card list 00:34:11 Adding the right sidebar 00:41:05 Adding the header and the subheader in the all tasks page 00:48:34 Adding the tasks list 00:54:49 Making the all projects page responsive 01:02:04 Making all the tasks responsive 01:13:07 Creating the context API and open and close the sidebar 01:24:13 Closing the sidebar when the user clicks outise of it 01:30:09 Adding the menu selection and changing the pages 01:40:09 Creating the project window 01:47:44 Adding the validation to the project form using ZOD and react form 01:53:45 Adding the icon window 01:59:00 Adding the icon selection logic in the project window 02:05:28 Adding the projects data and adding the project in the array 02:18:41 Adjusting the project card 02:28:44 Adding the drop down to edit each project 02:36:47 Adding the confirmation window to delete the project 02:43:43 Deleting the project 02:47:47 Showing the empty screen when there's no project 02:51:33 Handling the editing in the project window 02:56:39 Editing the project in the all projects array 03:01:41 Creating the sorting drop down 03:11:06 Creating the selection logic of the sorting drop down 03:15:46 Sorting all the projects 03:23:09 Updating the right side bar 03:29:15 Showing the empty screen at the right side bar 03:30:59 Move to the all tasks page when the user clicks on a project 03:36:11 Counting the on going tasks and the completed tasks 03:39:47 Switiching the tabs in all tasks page 03:44:36 Filetring tasks based on the clicked tab 03:48:38 Creating the all projects drop down 03:51:31 Opening and closing the projects drop down 03:55:16 Updating the tasks when the projects is clicked from the drop down 04:02:43 Creating the task form window 04:24:48 Adding a new task 04:32:58 Updating the task 04:43:48 Deleting the task 04:49:32 Updating the edit project function 04:51:01 Updating the status of the task when it is checked 04:54:57 Adding a new task from the the project card 04:59:57 Sorting all tasks #ReactJS #TypeScript #TailwindCSS #MongoDB #CodingTutorial #WebDevelopment #FrontendDevelopment #BackendDevelopment #ResponsiveDesign #WebAppDevelopment #Programming #DevCommunity #CodeWithMe #LearnToCode #developerlife