How To Make To-Do List App Using React JS And Tailwind CSS | Create Task App In React JS
GreatStack GreatStack
1.07M subscribers
27,814 views
873

 Published On Jun 10, 2024

Learn How To Make A ToDo List App (To-Do List App) Using React JS And Tailwind CSS | Create Task App In React JS And Tailwind. #ReactJS #reactjsproject #tailwindcss
SUBSCRIBE: ‪@GreatStackDev‬

❤️ Zero to Advanced JavaScript Course with Certification:
👉 https://greatstack.dev/go/javascript-...

-----------------
In this tutorial, we will create a To-Do list web app (Task App) using react JS and tailwind CSS. This react ToDo app contains a input field, so that user can enter their task. Then the task will be added in the list.

When user click on any task (or any to-do list) then it will be marked a completed or incomplete task. User can also delete the to-do items from the list using the delete icon (bin icon).

This To-Do Task list will be saved in the browser, so that when we open the browser again we will find all our saved To-Do list / task list. To design this React App we will use Tailwind CSS.

👉 Download Assets: https://drive.google.com/file/d/15EFr...

Tailwind CSS tutorial for beginners:
   • How To Make A Website With Tailwind C...  

------------------------------
Recommended Full Stack Projects:

Watch Full Stack E-commerce Website tutorial:
👉    • How To Create Full Stack E-Commerce W...  

Watch Full Stack Food Order Website tutorial:
👉    • How To Create Full Stack Food Deliver...  

-------------------------
Timestamp:

00:00 Project Overview
02:51 Setup React Project
06:42 Install & configure Tailwind CSS
10:58 Create To-Do app UI
34:32 Add new task in To-do App
46:05 Delete task from To-Do app
51:46 Mark task as complete or incomplete
01:02:04 Store task list or To-Do List in browser

-----------------------------------------
Suggested Course:

Complete JavaScript course with 30 projects:
👉 https://greatstack.dev/go/javascript-...

Complete HTML and CSS with 8 projects:
👉 https://easytutorialspro.com/go/course/

-------------------------------------
Recommended Videos:

Beginner's HTML and CSS tutorial:
►    • HTML And CSS Tutorial For Beginners, ...  

Beginner's JavaScript tutorial:
►    • JavaScript Full Course For Beginners ...  

Make A Complete Website for college using HTML & CSS:
►    • How To Make A College Website Using H...  

How to make a Business website step by step:
►    • How To Make Website Using HTML CSS | ...  

How to make personal resume website step by step:
►    • How To Make A Website Using HTML And ...  

How to make fitness website design using HTML CSS:
►    • How To Make A Website Using HTML CSS ...  

How to make an Ecommerce Website Design:
►    • How To Make eCommerce Website Using H...  

How to make a Job Portal website design with HTML & CSS:
►    • How To Make Website Using HTML CSS An...  

How to make travel website design with HTML CSS Bootstrap:
►    • How To Make A Website Step By Step Us...  

-------------------------------------

◼️ Source code link is shared in community post for all my coding videos exclusively for channel members (only channel members can see)
Join Channel Membership:
►    / @greatstackdev  

-------------------
Image and icon credit:
https://freepik.com/

-------------------------------------
Connect with me:
👉 https://linktr.ee/iamavinashkr

Connect with GreatStack:
Instagram:   / greatstackdev  
Twitter:   / greatstackdev  
Facebook:   / greatstack  

show more

Share/Embed