Báo cáo bài tập lớn bài tập lớn dapp quyên góp, từ thiện qucf môn project 1

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (660.93 KB, 16 trang )

<span class="text_page_counter">Trang 1</span><div class="page_container" data-page="1">

TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI

Viện Công nghệ thông tin và Truyền thông

<b>BÁO CÁO BÀI TẬP LỚNBài tập lớn:</b>

<b>DApp qun góp, từ thiệnQUCF</b>

<b>Mơn: Project 1</b>

<small>Giảng viên hướng dẫn:Thầy Trần Nhật HóaSinh viên thực hiện:Đặng Đình Quý 20215466</small>

</div><span class="text_page_counter">Trang 2</span><div class="page_container" data-page="2">

<b><small>4.1 Giao diện của trang...4</small></b>

<b><small>4.5 Chức năng chỉnh sửa thông tin dự án ( chỉ người khởi tạo dự án mới thấy)...8</small></b>

<b><small>4.6 Chức năng xóa dự án (nếu có sai sót và chỉ có thể là người khởi tạo dự án mới có quyềnxóa)...8</small></b>

<b><small>4.7 Hiển thị thơng tin thống kê của những người tham gia đóng góp...9</small></b>

<b><small>4.8 Khi số tiền đã đủ sẽ tự đóng phần góp tiền và trở về trạng thái đã chuyển tiền cho ngườikhởi tạo dự án...9</small></b>

<b><small>V. KIẾN THỨC ĐÃ HỌC ĐƯỢC VÀ SỰ PHÁT TRIỂN...10</small></b>

<b><small>5.1 Lập Trình và Framework:...10</small></b>

</div><span class="text_page_counter">Trang 3</span><div class="page_container" data-page="3">

<b>I. GIỚI THIỆU DỰ ÁN</b>

Dapp QUCF là một mô hình huy động vốn mới nổi dựa trên cơng nghệ

blockchain. Thay vì huy động vốn thơng qua các kênh trung gian truyền thống như ngân hàng, quỹ đầu tư mạo hiểm hay các nền tảng huy động vốn tập trung, QUCF cho phép các dự án kết nối trực tiếp với các nhà đầu tư cá nhân ở mọi nơi thế giới thông qua nền tảng blockchain, tạo ra một hệ thống minh bạch, an toàn và hiệu quả hơn.

Với mong muốn tạo ra một nền tảng đơn giản để mọi người dễ dàng sử dụng. • Có thể tạo nhiều sự kiện, tự xử lý chúng.

• Theo dõi tiến độ dự án một cách dễ dàng.

• Tạo trải nghiệm người dùng thoải mái và dễ sử dụng. • Quản lý các dự án hiệu quả.

• Bảo mật thơng tin người dùng và thanh tốn.

<b>II. CHỨC NĂNG CHÍNH</b>

<b>2.1 Các tác nhân trong hệ thống</b>

</div><span class="text_page_counter">Trang 4</span><div class="page_container" data-page="4">

<b>Tên tác nhânMô tả tác nhân</b>

1 Người tạo dự án Người quản lý dự án mà họ tạo trên hệ thống 2 Người tham gia Người sử dụng hệ thống sau khi đăng nhập thành

ủng hộ công

3 Khách Người sử dụng hệ thống khi chưa đăng nhập

• Đăng nhập vào trang web bằng ví Metamask.

• Quản lý dự án (thêm sửa xóa), hiện thị thơng tin tiến độ của dự án. • Theo dõi từng người tham gia ủng hộ cho dự án.

</div><span class="text_page_counter">Trang 5</span><div class="page_container" data-page="5">

<b>2.3 Đăng nhập vào hệ thống</b>

• Đăng nhập: Người dùng khơng cần đăng ký, chỉ đơn giản click vào nút “Connect Wallet” và đồng ý cho phép kết nối ví Metamask của họ với

<b>2.5 Theo dõi từng người tham gia ủng hộ cho dự án</b>

• Truy cập vào từng dự án để xem chi tiết địa chỉ, số lượng (ETH), thời gian … của những người tham gia quyên góp.

</div><span class="text_page_counter">Trang 6</span><div class="page_container" data-page="6">

Dự án sử dụng một loạt cơng nghệ để đảm bảo tính ổn định, hiệu suất và bảo mật của trang web, bao gồm:

• Ngơn ngữ lập trình: Javascript ( tạo giao diện, tương tác với giao diện), Solidity (tạo hợp đồng thơng minh).

• Framework cho giao diện: ReactJs • Thư viện: Tailwind CSS

• Mơi trường phát triển & deploy contract: Hardhat • Framework cho tương tác với smartcontract: Ether.Js

<b>IV. KẾT QUẢ ĐẠT ĐƯỢC4.1 Giao diện của trang</b>

- Nếu chưa có ví thì sẽ hiển thị thơng báo u cầu người dùng tải ví về

</div><span class="text_page_counter">Trang 7</span><div class="page_container" data-page="7">

- Sau khi tải và kết nối thì ta có giao diện như sau

</div><span class="text_page_counter">Trang 8</span><div class="page_container" data-page="8">

- Click load more để xem được nhiều dự án hơn

</div><span class="text_page_counter">Trang 9</span><div class="page_container" data-page="9">

Khi nhấn Submit thì ví sẽ u cầu người tạo dự án xác nhận hoặc từ chối

</div><span class="text_page_counter">Trang 10</span><div class="page_container" data-page="10">

- Cả người tạo dự án hay những người khác đều có thể xem chi tiết dự án khi click vào dự án bất kỳ, và chỉ có người tạo dự án mới có thể thấy phần Edit và Delete dự án

</div><span class="text_page_counter">Trang 11</span><div class="page_container" data-page="11">

- Có thể đặt số lượng ETH tùy ý mà người dùng muốn quyên góp

- Nếu đặt nhiều hơn số lượng ETH cần thiết thì hệ thống cũng vẫn sẽ tự đóng ln và khơng hồn lại cho họ ( vì ETH rất đắt nên khả năng nhầm là ít ) nên tổng số họ qun góp vẫn sẽ chuyển thẳng vào ví của người khởi tạo

</div><span class="text_page_counter">Trang 12</span><div class="page_container" data-page="12">

<b>4.5 Chức năng chỉnh sửa thông tin dự án ( chỉ người khởi tạo dự án mớithấy)</b>

-Người khởi tạo dự án có thể tự do sửa lại thơng tin của dự án y như lúc tạo dự

án mới.

<b>4.6 Chức năng xóa dự án (nếu có sai sót và chỉ có thể là người khởi tạo dựán mới có quyền xóa)</b>

</div><span class="text_page_counter">Trang 13</span><div class="page_container" data-page="13">

Sau khi xóa sẽ có trạng thái như sau

<b>4.7 Hiển thị thông tin thống kê của những người tham gia đóng góp</b>

- Cứ sau khi có một người đóng góp thì sẽ lại tăng thêm 1 người vào trong bảng thống kệ và thêm ngay ở trên đầu

<b>4.8 Khi số tiền đã đủ sẽ tự đóng phần góp tiền và trở về trạng thái đãchuyển tiền cho người khởi tạo dự án</b>

</div><span class="text_page_counter">Trang 14</span><div class="page_container" data-page="14">

- Nếu quá hạn thời gian dự án tồn tại mà người dùng vẫn gửi tiền vào thì contract sẽ tự gửi lại số ETH cho người quyên góp mà họ đã đặt vào dự án

</div><span class="text_page_counter">Trang 15</span><div class="page_container" data-page="15">

<b>V. KIẾN THỨC ĐÃ HỌC ĐƯỢC VÀ SỰ PHÁT TRIỂN</b>

<b>5.1 Lập Trình và Framework:</b>

• Sử dụng Javascript và học thêm được Reactjs cơ bản để xây dựng Dapp. • Học được thêm về cách dùng Tailwind CSS, tiết kiệm được thời gian

• Sử dụng Solidity để viết Smartcontract.

• Sử dụng Hardhat để tạo môi trường Blockchain chạy cục bộ cho Dapp. • Sử dụng Etherjs để tương tác với Smartcontract.

• Áp dụng các cách dùng đối với mảng, đối tượng để xử lý dữ liệu • Sử dụng các hàm và thuật toán để cắt chuỗi

• Sử dụng các thư viện trong javascript

Hiện tại thì dự án vẫn rất là sơ sài, và có thể có sai sót ở đâu đó như: • Phần giao diện quá đơn giản.

• Bố cục chưa được đẹp mắt và thơ sơ.

</div><span class="text_page_counter">Trang 16</span><div class="page_container" data-page="16">

• Các chức năng và tính năng cịn ít.

Vì thế, nên tương lai dự án này vẫn có thể phát triển với giao diện đẹp hơn, thêm nhiều các tính năng hơn để phục vụ cho nhu cầu người tham gia một cách tốt nhất.

<small>-</small> Nhìn chung, Dapp này là một giải pháp thay thế đầy hứa hẹn cho các dự án đổi mới nhằm đảm bảo nguồn vốn đồng thời mang lại sự thuận tiện cho các nhà đầu tư và người đóng góp. Nếu áp dụng được trong thực tế, nó sẽ giúp giải quyết được rất nhiều vấn đề như chuyển tiền, quyên góp đa quốc gia, kêu gọi được các nhà hảo tâm mà không cần tốn cơng sức. Vì vậy, đây cũng là vấn đề chung để tiếp tục phát triển mở rộng thêm trong lĩnh vực này.

</div>