Build a Complete Responsive Task Management System | HTML & CSS & Javascript | 4 Hours Course
〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️
Have fun while coding with me 🥳 👩🏻💻
〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️
In this video, we will build a two-pages task management system. We will work intensively with HTML & CSS. And we are going to use Javascript as well to add some user interactions. What we will accomplish together:
⚙️ Build login/signup page
⚙️ Build dashboard page
⚙️ Display tasks in two different ways: list & board views
⚙️ Build popups: add task & view task popups
⚙️ Build a design system using CSS custom properties
⚙️ Construct fully responsive pages
⚙️ Show/hide elements
⚙️ Show feedback notifications
⏰ Chapters
00:00 Overview
04:09 Global style
25:56 Signup page – HTML
37:09 Signup page – CSS
56:18 Login page
01:00:28 Dashboard page – Header
01:10:30 Dashboard page – View options
01:25:07 Dashboard page – List view
01:57:06 Dashboard page – Board view
02:16:18 Change view – Javascript
02:25:59 “Add task” popup – HTML
02:46:55 “Add task” popup – CSS
03:11:20 Show/hide popup – Javascript
03:19:51 “View task” popup – HTML & CSS & Javascript
03:38:36 Success notification
03:47:36 The end 🥳
👩🏻💻 Github Code
https://github.com/AhlamKhalid/Task-M...
〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️
🎀 Watch my other useful tutorials
-Build Shopping Cart With Javascript | E-commerce Shopping Cart Tutorial
• Build Shopping Cart With Javascript | E-co...
-Build quiz app with React
• Build quiz app with React
-How To Build a Shopping Cart with Vue 3 and JSON Server [Composition API]
• How To Build a Shopping Cart with Vue 3 an...
💻 Github
https://github.com/AhlamKhalid
🌐 Social links
Twitter: / ahlamkarkashan
linkedin: / ahlam-karkashan
facebook: https://www.facebook.com/profile.php?...
〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️〰️
I’m happy that you watched my video. If you find my channel helpful, like & subscribe & share with your friends, this makes me very happy 🥳 And I’m waiting for you to come back again!