หน้าแรก>การเขียนโปรแกรมที่เกี่ยวข้อง>ซอร์สโค้ดอื่น ๆ
ดาวน์โหลด

แอพ Todolist

นี่คือแอพ Task Manager ที่อนุญาตให้ผู้ใช้สร้างอ่านอัปเดตการลบและเพิ่มไปยังงานที่ชื่นชอบ มันถูกสร้างขึ้นบน Mern Stack (MongoDB, Express, React และ Node.js) และมีคุณสมบัติการอนุญาตและการรับรองความถูกต้องโดยใช้ JWT และ BCrypt สำหรับการจัดการสถานะฉันใช้ชุดเครื่องมือ Redux

-updated v-2.0--

  1. เพิ่มคุณสมบัติ Google Authentication (OAUTH) โดยใช้ Firebase
  2. Changed UI ในการสร้างรายการหน้าลงชื่อเข้าใช้/ลงทะเบียน
  3. Added User Profile Page (มีรูปภาพโปรไฟล์ผู้ใช้ชื่อผู้ใช้ Email-ID และ UID)
  4. เพิ่มฟังก์ชั่น User Delete Account
  5. เพิ่มหน้า GENAI มันเป็น AI feature ที่คุณสามารถถามปัญหาความคิดการแก้ปัญหาและ ฯลฯ สำหรับ AI ที่สร้างขึ้นบนราศีเมถุน
  6. เพิ่มฟิลด์ตัวเลือก NOTES ในหน้าสร้างซึ่งคุณสามารถเขียนโน้ตของคุณพร้อมกับงานของคุณ
  7. เพิ่ม STATUS (pending, in-working, completed) ใน TODO-TASK
  8. เพิ่มคุณสมบัติ Show/Hide รหัสผ่านในฟิลด์การลงชื่อเข้าใช้/ลงทะเบียนรหัสผ่าน
  9. Updated โฮมเพจในโหมดมืด
  10. Add GenAI button บนบ้านและสร้างหน้า
  11. Added Update User Profile feature (อัปเดตรูปภาพโปรไฟล์ผู้ใช้ชื่อผู้ใช้อีเมลและรหัสผ่าน)

  12. Continue......

คุณสมบัติ

  • ผู้ใช้สามารถลงทะเบียนและเข้าสู่ระบบด้วยอีเมลและรหัสผ่าน
  • ผู้ใช้สามารถสร้างงานที่มีชื่อเรื่อง
  • ผู้ใช้สามารถดูงานของพวกเขาในรายการ
  • ผู้ใช้สามารถแก้ไขหรือลบงานได้
  • ผู้ใช้สามารถทำเครื่องหมายงานของพวกเขาว่าเสร็จสมบูรณ์หรือไม่สมบูรณ์
  • ผู้ใช้สามารถออกจากระบบจากบัญชีของพวกเขา
  • โหมดมืดเพิ่มฟังก์ชั่นที่ชื่นชอบ

ลิงค์ตัวอย่างโครงการ

todolist_project_link

การติดตั้ง

ในการเรียกใช้แอพนี้ในเครื่องคุณจะต้องติดตั้ง Node.js, NPM และ MongoDB บนเครื่องของคุณ จากนั้นทำตามขั้นตอนเหล่านี้:

  • โคลนที่เก็บนี้ไปยังเครื่องในพื้นที่ของคุณ

  • นำทางไปยังโฟลเดอร์โครงการและเรียกใช้ npm install เพื่อติดตั้งการอ้างอิง

  • สร้างไฟล์ .env ในโฟลเดอร์รูทและเพิ่มตัวแปรต่อไปนี้:

    • PORT : หมายเลขพอร์ตสำหรับเซิร์ฟเวอร์ (ค่าเริ่มต้นคือ 5000)
    • MONGO_URI : สตริงการเชื่อมต่อสำหรับฐานข้อมูล MongoDB ของคุณ
    • JWT_SECRET : คีย์ลับสำหรับการสร้างโทเค็น JWT

  • เรียกใช้ npm run dev เพื่อเริ่มต้นเซิร์ฟเวอร์และเรียกใช้ npm run start เพื่อเริ่มต้นแอป React

  • เปิดเบราว์เซอร์ของคุณและไปที่ http://localhost:3000 เพื่อดูแอพพลิเคชั่น

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด