How To Make To-Do List App Using React JS And Tailwind CSS | Create Task App In React JS

Veröffentlicht am: 10 Juni 2024
auf dem Kanal: GreatStack
84,532
1.9k

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-...

👉 30 Days React.js Learning Plan: https://topmate.io/greatstack/1514677

-----------------
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 CSS St...  

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

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

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

-------------------------
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, Learn...  

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

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

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

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

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

How to make an Ecommerce Website Design:
►    • How To Make eCommerce Website Using HTML CSS  

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

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

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

◼️ 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  


Auf dieser Seite können Sie das Online-Video How To Make To-Do List App Using React JS And Tailwind CSS | Create Task App In React JS mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer GreatStack 10 Juni 2024 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 84,532 Mal angesehen und es wurde von 1.9 tausend den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!