Đang tải... (xem toàn văn)
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TINKHOA CÔNG NGHỆ PHẦN MỀM
Thành phố Hồ Chí Minh, tháng 12 năm 2023
Trang 2NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN
Trang 3Ths Nguyễn Công Hoan
LỜI CẢM ƠN
Đồ án với đề tài “ỨNG DỤNG NEXTJS VÀ XÂY DỰNG ỨNG DỤNG WEBSITEGIỚI THIỆU VÀ MUA BÁN BẤT ĐỘNG SẢN” là minh chứng cho quá trình cố gắngkhông ngừng trong việc tìm tòi, học hỏi khi học tập tại trường Đại học Công nghệ Thôngtin Thể hiện khả năng của bản thân trong việc áp dụng kiến thức chuyên môn vào giảiquyết bài toán thực tế.
Trong quá trình thực hiện đồ án, em đã nhận được sự hướng dẫn tận tình từ thầy Mộtcách đặc biệt, em xin được gửi lời cảm ơn chân thành đến:
Các thầy cô trường Đại học Công nghệ Thông Tin nói chung và thầy NguyễnCông Hoan nói riêng đã tận tình truyền đạt kiến thức tới em trong những năm học tập tạitrường Đó là tài sản quý báu đã giúp em hoàn thành đề tài đồ án và cũng là hành trangcho con đường sự nghiệp của bản thân sau này.
Em xin được gửi lời cảm ơn sâu sắc tới ThS Nguyễn Công Hoan, người đã trựctiếp hướng dẫn, chỉ bảo, giúp đỡ em những lúc khó khăn, đưa ra những lời khuyên bổ íchđể đồ án được hoàn thành đúng tiến độ và đáp ứng các yêu cầu đề ra ban đầu.
Trong khoảng thời gian thực hiện đồ án, chúng em đã học hỏi thêm được nhiều kiến thức,kinh nghiệm, biết được thêm về nhiều công nghệ mới Nhóm em đã vận dụng những kiếnthức nền tảng đã tích lũy đồng thời kết hợp với việc học hỏi và nghiên cứu những kiếnthức mới Từ đó, vận dụng tối đa những gì đã học hỏi được để hoàn thành báo cáo đồ ánnày.
Mặc dù đã cố gắng hoàn thành báo cáo với tất cả nỗ lực song đồ án của nhóm chúng emchắc chắn không tránh khỏi những thiếu sót, chúng em rất mong nhận được sự thông cảmvà góp ý chân thành từ quý thầy, cô Nhóm em xin chân thành cảm ơn.
Trang 4Tp.HCM, ngày tháng … năm 2023
Nhóm sinh viên thực hiện
Phan Chí Bảo, Triệu Văn Kim
Trang 52.1 Phân tích yêu cầu 7
2.1.1 Yêu cầu chức năng 7
2.1.1.1 Sơ đồ Usecase 7
2.1.1.2 Miêu tả Usecase 7
2.1.1.3 Đặc tả usecase 9
2.1.1.3.1 Đăng nhập và đăng ký tài khoản 9
2.1.1.3.2 Tìm kiếm bất động sản theo tiêu chí 10
2.1.1.3.3 Xem thông tin chi tiết về bất động sản 11
2.1.1.3.4 Liên hệ với chủ bất động sản qua tin nhắn, email hoặc cuộc gọi 12
2.1.1.3.5 Yêu thích và lưu trữ 13
2.1.1.3.6 Quản lý tài khoản 14
2.1.1.3.7 Đăng tải thông tin về bất động sản 15
2.1.2.4 Danh sách sơ đồ sequence 16
2.1.2 Yêu cầu phi chức năng 22
Trang 73.3.1 Sử Dụng ASP.NET Framework và Entity Framework 52
Trang 8CHƯƠNG 1: GIỚI THIỆU1.1 Lý do chọn đề tài
Trong bối cảnh xuất hiện ngày càng nhiều nhu cầu mua bán và tìm kiếm thông tinvề bất động sản, việc xây dựng một trang web chuyên về giới thiệu và mua bán bất độngsản trở nên cực kỳ quan trọng Chúng em chọn đề tài này nhằm đáp ứng nhu cầu thịtrường, cung cấp một nền tảng thuận tiện và đáng tin cậy cho người dùng trong quá trìnhgiao dịch bất động sản.
1.2 Mục tiêu
Mục tiêu chính của đồ án là xây dựng một trang web giới thiệu và mua bán bất độngsản có khả năng cung cấp thông tin đầy đủ, chính xác, và thuận tiện cho người sử dụng.Trang web sẽ tập trung vào việc cung cấp trải nghiệm tốt cho người dùng, hỗ trợ quảngcáo và giới thiệu bất động sản một cách hiệu quả.
1.3 Phạm vi
Phạm vi của đồ án sẽ bao gồm các chức năng cơ bản như đăng tin, tìm kiếm,xem chi tiết thông tin bất động sản, và liên hệ với người đăng tin Đối tượng người dùngchủ yếu là những người có nhu cầu mua, bán, hoặc cho thuê bất động sản, bao gồm cảngười dùng cá nhân và doanh nghiệp trong lĩnh vực bất động sản.
1.4 Công nghệ sử dụng
Trong quá trình xây dựng trang web, chúng em sử dụng một số công nghệ chínhbao gồm Next.js cho phần frontend, Material-UI để hỗ trợ thiết kế giao diện người dùng,và ASP.NET Framework cùng với Entity Framework để xây dựng phần backend và kếtnối cơ sở dữ liệu SQL Server.
1.5 Kết luận chương
Chương giới thiệu đã trình bày mục tiêu, lý do chọn đề tài, phạm vi, đối tượngngười dùng, và công nghệ sử dụng trong quá trình xây dựng trang web giới thiệu và muabán bất động sản Các chương tiếp theo sẽ chi tiết hóa từng giai đoạn của dự án để đảmbảo việc triển khai được thực hiện một cách hiệu quả và đạt được các mục tiêu đề ra.
Trang 9CHƯƠNG 2: THIẾT KẾ2.1 Phân tích yêu cầu
Trước khi bắt đầu quá trình thiết kế, chúng tôi đã tiến hành phân tích kỹ lưỡng vềyêu cầu của dự án Các yêu cầu chức năng và phi chức năng đã được xác định chi tiết đểđảm bảo rằng trang web có thể đáp ứng đầy đủ nhu cầu của người dùng.
2.1.1 Yêu cầu chức năng2.1.1.1 Sơ đồ Usecase
Hình 2.1 Sơ đồ usecase
2.1.1.2 Miêu tả UsecaseI
01 Quản Lý NgườiDùng
Quản Trị Viên (Administrator)
Thêm, xoá, sửa đổi danh sách người dùng trong hệ thống
02 Thêm Danh Sách Bất Động Sản
Đại Lý Bất Động Sản (Real Estate Agent)
Đại lý bất động sản có thể thêm các bất động sản vào danh sách
Trang 1003 Sửa Đổi Danh Sách Bất Động Sản
Đại Lý Bất Động Sản (Real Estate Agent)
Đại lý bất động sản có thể sửa đổi thông tin của các bất động sản trong danh sách
04 Xoá Danh Sách Bất Động Sản
Đại Lý Bất Động Sản (Real Estate Agent)
Đại lý bất động sản có thể xoá các bất động sản khỏi danh sách
05 Liên Hệ với ĐạiLý Bất Động Sản
Người Dùng Đã Đăng Ký (RegisteredUser)
Người dùng đã đăng ký có thể liên hệ trực tiếp với đại lý bất động sản hoặc chủ nhân bất động sản qua thông tin của chủ bất động sản trên trang web.
06 Lưu Bất Động Sản Yêu Thích
Người Dùng Đã Đăng Ký (RegisteredUser)
Người dùng có thể lưu lại các bất động sản mà họ quan tâm vào tài khoản của mình để dễ dàng kiểm tra và so sánh trong tương lai
07 Tìm Kiếm Bất Động Sản
Khách (Guest) Khách có thể tìm kiếm và duyệt qua danh sách bất động sản trên nền tảng Bao gồm việc sử dụng các bộ lọc để hạn chế kết quả tìm kiếm dựa trên các tiêu chí như địa điểm, khoảng giá, loại bất động sản và các tính năng khác.
08 Xem Chi Tiết Bất Động Sản
Khách (Guest) Khách có thể xem thông tin cơ bản về bất động sản, bao gồm mô tả, hình ảnh và, trong một số trường hợp, chi tiết cấp cao về vị trí và tính năng của bất động sản.
09 Đăng Ký Tài Khoản
Khách (Guest) Khách có thể đăng ký một tài khoản để sử dụng các chức năng dành cho người dùng đã đăng ký.
10 Đăng Nhập Khách (Guest) Khách có thể đăng nhập vào hệ thống bằng tài khoản đã đăng ký.
11 Đăng Xuất Khách (Guest) Khách có thể đăng xuất khỏi hệ thống.12 Thêm bất động
Người Dùng Đã Đăng Ký (RegisteredUser)
Người dung có thể đăng bài quảng cáo bằng cách điền đầy đủ thông tin cần thiết.
Trang 122.1.1.3.1 Đăng nhập và đăng ký tài khoản
Feature Đăng nhập và đăng ký tài khoản
Description Cho phép người dùng đăng nhập vào ứng dụng Homelist bằng tài khoản đã đăng ký Người dùng cũng có thể đăng ký tài khoản mới.Purpose Đảm bảo tính cá nhân hóa và bảo mật thông tin người dùng, cung cấp
quyền truy cập vào các tính năng và dữ liệu cá nhân.
User problem Người dùng muốn tạo và quản lý tài khoản cá nhân để có thể sử dụngcác tính năng và tiện ích của ứng dụng Homelist.
User value Người dùng có thể lưu trữ thông tin cá nhân và sử dụng tài khoản để tìm kiếm, lưu trữ yêu thích và quản lý các giao dịch thuê nhà.
Assumptions Người dùng cung cấp thông tin đăng nhập chính xác và có kết nối internet ổn định.
Not doing Không hỗ trợ đăng nhập bằng các tài khoản khác ngoài Google và Facebook.
Acceptance criteria
Người dùng có thể đăng ký tài khoản mới.
Hệ thống xác thực người dùng và bảo mật thông tin tài khoản. Cung cấp thông báo lỗi nếu người dùng nhập sai thông tin
đăng nhập.
Trang 132.1.1.3.2 Tìm kiếm bất động sản theo tiêu chí
Feature Tìm kiếm bất động sản theo tiêu chí
Description Cho phép người dùng tìm kiếm bất động sản theo các tiêu chí như địa điểm, giá thuê, diện tích, số phòng, tiện ích,…
Purpose Giúp người dùng thuận tiện tìm kiếm các bất động sản phù hợp với nhu cầu và yêu cầu của họ.
User problem Người dùng muốn tìm kiếm nhà theo các tiêu chí cụ thể để thuê bất động sản phù hợp với nhu cầu và ngân sách của mình.
User value Người dùng có thể tìm kiếm và lọc bất động sản dễ dàng và nhanh chóng, tiết kiệm thời gian và công sức tìm kiếm.
Assumptions Có dữ liệu đầy đủ và chính xác về các bất động sản cho thuê.Not doing Không hỗ trợ tìm kiếm bằng giọng nói.
Acceptance criteria
Người dùng có thể tìm kiếm bất động sản theo các tiêu chí như địa điểm, giá thuê, diện tích, số phòng, tiện ích, v.v. Kết quả tìm kiếm phù hợp và chính xác.
Cung cấp giao diện người dùng dễ sử dụng và trực quan để tìm kiếm và lọc bất động sản.
Trang 142.1.1.3.3 Xem thông tin chi tiết về bất động sản
Feature Xem thông tin chi tiết về bất động sản
Description Cho phép người dùng xem thông tin chi tiết về bất động sản, bao gồm hình ảnh, mô tả, tiện ích, vị trí, giá thuê, v.v.
Purpose Cung cấp cho người dùng cái nhìn tổng quan và chi tiết về các bất động sản để họ có thể đưa ra quyết định thuê bất động sản.
User problem Người dùng muốn xem thông tin chi tiết và hình ảnh về bất động sản để có cái nhìn rõ ràng về nó.
User value Người dùng có thể xem thông tin chi tiết về bất động sản, đánh giá vàso sánh các lựa chọn thuê bất động sản.
Assumptions Có thông tin chi tiết và hình ảnh đầy đủ về các bất động sản.Not doing Không cung cấp chức năng xem bất động sản 360 độ.
Acceptance criteria
Người dùng có thể xem thông tin chi tiết về bất động sản, bao gồm hình ảnh, mô tả, tiện ích, vị trí, giá thuê, v.v.
Cung cấp giao diện người dùng thân thiện và trực quan để xem thông tin chi tiết về bất động sản.
Trang 152.1.1.3.4 Liên hệ với chủ bất động sản qua tin nhắn, email hoặc cuộc gọi
Feature Liên hệ với chủ bất động sản qua tin nhắn, email hoặc cuộc gọiDescription Cho phép người dùng liên hệ trực tiếp với chủ bất động sản qua tin
nhắn, email hoặc cuộc gọi từ website Homelisti.
Purpose Tạo kết nối thuận tiện và trực tiếp giữa người thuê và chủ bất động sản để thảo luận, đặt câu hỏi, hoặc xác nhận thông tin về bất động sản.User problem Người dùng muốn có phương tiện liên hệ nhanh chóng và dễ dàng vớichủ bất động sản để giải đáp các thắc mắc hoặc sắp xếp việc xem bất động sản.
User value Người dùng có thể liên hệ trực tiếp và chủ động giao tiếp với chủ bất động sản để giải đáp thắc mắc, thương lượng giá thuê và xác nhận thông tin về bất động sản.
Assumptions Chủ bất động sản cung cấp thông tin liên hệ (số điện thoại, địa chỉ email) và có thể tiếp nhận cuộc gọi hoặc tin nhắn từ người thuê.Các phương tiện liên hệ (tin nhắn, email, cuộc gọi) đều hoạt động và có kết nối mạng.
Not doing Không cung cấp tính năng video call hoặc video chat.Acceptance
Người dùng có thể nhấp vào thông tin liên hệ trên trang chi tiếtbất động sản để chọn phương tiện liên hệ (tin nhắn, email, cuộcgọi).
Cung cấp tính năng sao chép số điện thoại hoặc địa chỉ email của chủ bất động sản để dễ dàng liên hệ.
Đảm bảo tính bảo mật thông tin liên hệ và tuân thủ quy định vềquyền riêng tư của người dùng.
Trang 162.1.1.3.5 Yêu thích và lưu trữ
Feature Chức năng yêu thích và lưu trữ
Description Cho phép người dùng yêu thích và lưu trữ các bất động sản mà họ quan tâm trong danh sách yêu thích để dễ dàng truy cập và quản lý sau này.
Purpose Cung cấp cho người dùng khả năng lưu trữ và quản lý các bất động sản mà họ quan tâm để có thể theo dõi, so sánh và đưa ra quyết định thuê bất động sản.
User problem Người dùng muốn theo dõi và lưu trữ các bất động sản mà họ quan tâm để không bị mất dấu và dễ dàng tìm lại trong quá trình tìm kiếm.User value Người dùng có thể lưu trữ và quản lý danh sách các bất động sản yêu
thích, giúp họ theo dõi, so sánh và lựa chọn bất động sản phù hợp với nhu cầu và yêu cầu của mình.
Người dùng đã đăng nhập vào tài khoản của mình.
Các bất động sản có thể được lưu trữ và theo dõi dựa trên thông tin duy nhất của mỗi bất động sản.
của chủ bất động sản để dễ dàng liên hệ.
Đảm bảo tính bảo mật thông tin liên hệ và tuân thủ quy định vềquyền riêng tư của người dùng.
Trang 172.1.1.3.6 Quản lý tài khoản
Feature Chức năng quản lý tài khoản.
Description Cung cấp cho người dùng khả năng quản lý thông tin cá nhân, tài khoản và cài đặt liên quan đến trang web Homelist.
Purpose Cho phép người dùng có quyền kiểm soát thông tin cá nhân, bảo mật tài khoản và tùy chỉnh các cài đặt cá nhân theo nhu cầu.
User problem Người dùng muốn có khả năng quản lý thông tin tài khoản và cá nhânmột cách dễ dàng và thuận tiện.
User value Người dùng có thể cập nhật thông tin cá nhân, thay đổi mật khẩu, quản lý thông báo và tùy chỉnh các cài đặt ứng dụng theo sở thích và yêu cầu của mình.
Người dùng đã đăng nhập vào tài khoản của mình.
Các thông tin cá nhân và tài khoản được bảo mật và chỉ được truy cập bởi chính người dùng.
Người dùng có thể cập nhật thông tin cá nhân như tên, địa chỉ, số điện thoại, v.v.
Người dùng có thể thay đổi mật khẩu của tài khoản. Cung cấp khả năng đăng xuất khỏi tài khoản.
Người dùng có thể quản lý cài đặt thông báo, bao gồm tắt/mở thông báo, tuỳ chỉnh loại thông báo, v.v.
Cung cấp giao diện người dùng dễ sử dụng và trực quan để quản lý tài khoản và cài đặt.
Trang 182.1.1.3.7 Đăng tải thông tin về bất động sản
Feature Chức năng đăng tải thông tin về bất động sản.
Description Cho phép người dùng đăng tải và quản lý thông tin về các bất động sản muốn cho thuê trên trang web Homelist.
Purpose Cung cấp nền tảng cho người dùng và chủ nhà để đăng tải và quản lý thông tin về bất động sản, như hình ảnh, mô tả, giá cả, vị trí, tiện ích và các chi tiết khác.
User problem Người dùng muốn có phương tiện để quảng bá và chia sẻ thông tin về bất động sản của mình một cách hiệu quả.
User value Chủ bất động sản có thể đăng tải thông tin chi tiết và hình ảnh về căn hộ để thu hút người thuê tiềm năng.
Người thuê có thể dễ dàng tìm kiếm và xem thông tin về các bất động sản, giúp họ đưa ra quyết định thuê bất động sản dễ dàng hơn.
Assumptions Chủ bất động sản đã đăng ký tài khoản và được phép đăng tải thông tin bất động sản.
Người dùng có thể xem thông tin bất động sản mà không cần đăng nhập.
Not doing Không cung cấp tính năng đặt chỗ trực tiếp từ ứng dụng. Không cung cấp tính năng giao dịch thanh toán trực tiếp trong
ứng dụng.Acceptance
Chủ bất động sản có thể đăng tải thông tin chi tiết về bất động sản, bao gồm hình ảnh, mô tả, giá cả, vị trí, tiện ích, v.v. Người dùng có thể tìm kiếm và xem thông tin chi tiết về các
bất động sản, bao gồm hình ảnh, mô tả, giá cả, vị trí, tiện ích, v.v.
Đảm bảo tính chính xác và đầy đủ của thông tin bất động sản được đăng tải.
Cung cấp giao diện người dùng dễ sử dụng để quản lý và xem thông tin bất động sản.
Trang 192.1.2.4 Danh sách sơ đồ sequence
2.1.2.4.1 Create Listing Sequence Diagram
Hình 2.2 Create Listing Sequence Diagram
Trang 202.1.2.4.2 Update Listing Sequence Diagram
Hình 2.3 Update Listing Sequence Diagram
2.1.2.4.3 Search by Location Sequence Diagram
Hình 2.4 Search by Location Sequence Diagram
Trang 212.1.2.4.4 Listing Creation Sequence Diagram
Hình 2.5 Listing creation Sequence Diagram
Trang 222.1.2.4.5 Listing Update Sequence Diagram
Hình 2.6 Listing update Sequence Diagram
Trang 232.1.2.4.6 User Registration Sequence Diagram
Hình 2.7 User registration Sequence Diagram
Trang 242.1.2.4.7 User login Sequence Diagram
Hình 2.8 User login Sequence Diagram
Trang 252.1.2.4.8 User logout Sequence Diagram
Hình 2.9 User logout Sequence Diagram
2.1.2 Yêu cầu phi chức năng2.1.2.1 Giao diện
2.1.2.1.1 Giao diện người dùng
• Hệ thống cung cấp một giao diện web thân thiện với người dùng có thể truy cập từ
các trình duyệt web phổ biến.
• Giao diện hệ thống là có độ phản hồi và tương thích với các nền tảng khác nhautrên các thiết bị khác nhau.
Trang 262.1.2.2 Chất lượng
2.1.2.2.1 Tính sử dụng
• Hệ thống sẽ tuân theo các tiêu chuẩn sử dụng đã được thiết lập, bao gồm điều
hướng trực quan và thiết kế thân thiện với người dùng.
• Thời gian đào tạo cho người dùng thông thường để thành thạo với các thao tác cơbản sẽ không vượt quá một giờ.
Trang 272.2 Thiết kế giao diện người dùng
Giao diện người dùng của trang web được thiết kế để mang lại trải nghiệm ngườidùng mượt mà và hiệu quả Chúng em đã sử dụng Material-UI để tạo ra giao diện đẹpmắt và có tính thẩm mỹ cao.
2.2.1 Screen flow
Hình 2.10 Sơ đồ sreen flow
Trang 282.2.2 Miêu tả màn hìnhST
1 Đăng Nhập Màn Hình Đăng Nhập
Màn hình cho người dùng đăng nhập vàohệ thống
2 Đăng Ký Màn Hình Đăng Ký Màn hình cho người dùng đăng ký tài khoản mới
3 Đổi Mật Khẩu Màn Hình Đổi Mật Khẩu
Màn hình để người dùng thay đổi mật khẩu
4 Hồ Sơ Người Dùng
Màn Hình Hồ Sơ Người Dùng
Màn hình cho người dùng xem thông tin tài khoản cá nhân
5 Danh Sách BấtĐộng Sản
Màn Hình Danh Sách Bất Động Sản
Màn hình hiển thị danh sách các bất động sản trong hệ thống
6 Chi Tiết Bất Động Sản
Màn Hình Chi Tiết Bất Động Sản
Màn hình hiển thị thông tin chi tiết về một bất động sản mà người dùng muốn xem
7 Tìm Kiếm Bất Động Sản
Màn Hình Tìm Kiếm Bất Động Sản
Màn hình cho người dùng tìm kiếm bất động sản
8 Liên Hệ Màn Hình Liên Hệ Màn hình liên lạc giữa người dùng và đại lý bất động sản
9 Danh Sách Yêu Thích
Màn Hình Danh Sách Yêu Thích
Màn hình hiển thị danh sách bất động sản yêu thích của người dùng