(Nextjs+ TypeScript + Tailwind + DNDKit) Sharecode Trello kéo thả

[Mã code 38909]
  1 Đánh giá    Viết đánh giá
 1      166      0
Phí tải: 250 Xu (1Xu = 1.000đ)
Danh mục
Thể loại
Nhóm code
Ngày đăng
30-4-2024
Loại file
Full code
Dung lượng
248 KB
Code đã kiểm thử
Cam kết hỗ trợ
Không chứa mã độc
Có demo thực tế
Có hướng dẫn cài đặt

Trang web là một ứng dụng kéo thả tương tự như Trello, được xây dựng bằng Next.js và thư viện kéo và thả DNDKit. Người dùng có thể tạo, chỉnh sửa và sắp xếp các thẻ và danh sách một cách dễ dàng.


MÔ TẢ CHI TIẾT

Chức năng chính:

  1. Dark Mode:

    • Trang web hỗ trợ chế độ giao diện tối (dark mode) cho trải nghiệm người dùng linh hoạt hơn.
    • Người dùng có thể chuyển đổi giữa chế độ sáng và chế độ tối dễ dàng.
  2. Chuyển đổi Ngôn ngữ:

    • Trang web cho phép người dùng chuyển đổi giữa các ngôn ngữ khác nhau để đáp ứng nhu cầu đa ngôn ngữ của người dùng.
    • Có thể tích hợp các thư viện hoặc dịch vụ như i18n để quản lý văn bản đa ngôn ngữ.
  3. Kéo và Thả Cards và Columns:

    • Sử dụng thư viện DNDKit để tạo ra trải nghiệm kéo và thả mượt mà cho người dùng.
    • Người dùng có thể di chuyển thẻ (cards) giữa các cột (columns) một cách dễ dàng bằng cách kéo và thả.
  4. Đăng nhập bằng Google bằng NextAuth:

    • Sử dụng NextAuth để quản lý quá trình xác thực và đăng nhập của người dùng.
    • Cho phép người dùng đăng nhập vào trang web bằng tài khoản Google một cách tiện lợi và an toàn.

Công nghệ sử dụng:

  • Next.js: Sử dụng Next.js làm framework phát triển web để tạo ra ứng dụng web React mạnh mẽ và hiệu quả.
  • Tailwind CSS: Sử dụng Tailwind CSS để thiết kế giao diện người dùng một cách linh hoạt và nhanh chóng.
  • DNDKit: Sử dụng DNDKit để tạo ra trải nghiệm kéo và thả mượt mà cho việc di chuyển thẻ và cột trên trang web.
  • NextAuth: Sử dụng NextAuth để quản lý xác thực người dùng và đăng nhập bằng tài khoản Google.


XEM THÊM ==> Hướng dẫn cài đặt chi tiết

 

HÌNH ẢNH DEMO

Sharecode,source code,trello web,kéo thả,dnd kid

Sharecode,source code,trello web,kéo thả,dnd kid

Sharecode,source code,trello web,kéo thả,dnd kid

Nguồn: Sharecode.vn



HƯỚNG DẪN CÀI ĐẶT

B1: Tải về và giải nén file

B2: Mở terminal của thư mục chứa dự án để chạy các câu lệnh quen thuộc:

- npm install hoặc npm i để cài các thư viện trong dự án

npm run dev để chạy dự án

 
 
LINK DOWNLOAD

trello-official-web-master.zip [248 KB]

File đã được kiểm thử
     Báo vi phạm bản quyền
Pass giải nén (Nếu có):
sharecode.vn
DOWNLOAD
(250 Xu)
Bạn có code hay
ĐĂNG BÁN NGAY

BÌNH LUẬN



ĐÁNH GIÁ


ĐIỂM TRUNG BÌNH

5
1 Đánh giá
Code rất tốt (1)
Code tốt (0)
Code rất hay (0)
Code hay (0)
Bình thường (0)
Thành viên
Nội dung đánh giá
17:14 - 30/4/2024
Code rất tốt
Code rất tốt và phù hợp để phát triển

 HỖ TRỢ TRỰC TUYẾN