Xây dựng website đặt pizza online

TRƯỜNG ĐẠI HỌC SƯ PHẠM – ĐẠI HỌC ĐÀ NẴNG KHOA TIN HỌC BÁO CÁO ĐỒ ÁN TỐT NGHIỆP TÊN ĐỀ TÀI XÂY DỰNG WEBSITE ĐẶT PIZZA ONLINE Giảng viên hướng dẫn : TS PHẠM ANH PHƯƠNG Sinh viên thực : HUỲNH VĂN CAO TÍN Mã số sinh viên : 312022151153 Lớp sinh hoạt : 15CNTT1 Ngành : CỬ NHÂN CÔNG NGHỆ THÔNG TIN Khoa : KHOA TIN HỌC Đà Nẵng, 04/2018 LỜI CẢM ƠN Ngày nay, với thời kỳ cơng nghiệp hóa – đại hóa đất nước cơng nghệ thơng tin thật trở thành lĩnh vực quan trọng đời sống người Kỹ thuật số giúp chúng at tiết kiệm đáng để chi phi nhờ chi phí vận chuyển trung giang, Chi phí ciao dịch vụ đặc biệt giúp tiết kiệm thời gian đề người đầu tư vào hoạt động khác nhâu, tự động cung cấp thông tin theo nhu cầu sở thích người ngồi nhà để mua sắm thứ theo ý muốn website bán hàng mạng giúp ta làm điều Chính công nghệ mã nguồn mở trở nên ý tính Giá thành rẻ hỗ trợ nhiều mạng giúp ta nhanh chóng xây dựng website bán hàng thân thiện dễ sử dụng với người dùng Chính đồ án em chọn đề tài về: “Xây dựng website đặt pizza online” Em chọn đề tài lí nhằm củng cố kiến thức mà năm qua tơi tích lũy ngồi ghế nhà trường từ thực tế mà trải nghiệm Tuy thân cố gắng tìm hiểu tài liệu từ nhiều nguồn thơng tin khác giáo trình, sách, báo, Cũng vốn hiểu biết đề tài nội dung đề tài không tránh khỏi thiếu sót Kính mong đóng góp ý kiến q thầy để tơi hồn thiện báo cáo sở vững để sau trường làm việc Xin trân trọng cảm ơn! Đà Nẵng, ngày 25 tháng 04 năm 2018 Sinh viên thực Huỳnh Văn Cao Tín Huỳnh Văn Cao Tín – 15CNTT (2015 – 2019) Báo cáo đồ án tốt nghiệp LỜI CAM ĐOAN Tôi xin cam đoan: Những nội dung báo cáo thực hướng dẫn trực tiếp TS Phạm Anh Phương Mọi tham khảo dùng báo cáo trích dẫn rõ ràng tên tác giả, tên cơng trình, thời gian, địa điểm công bố Mọi chép không hợp lệ, vi phạm quy chế đào tạo, hay gian trá, xin chịu hoàn toàn trách nhiệm Sinh viên thực hiện, Huỳnh Văn Cao Tín Huỳnh Văn Cao Tín – 15CNTT (2015 – 2019) Báo cáo đồ án tốt nghiệp NHẬN XÉT CỦA CÁN BỘ HƯỚNG DẪN Đà Nẵng, ngày tháng Cán hướng dẫn Huỳnh Văn Cao Tín – 15CNTT (2015 – 2019) Báo cáo đồ án tốt nghiệp năm 2018 NHẬN XÉT CỦA HỘI ĐỒNG PHẢN BIỆN Đà Nẵng, ngày tháng Hội đồng phản biện Huỳnh Văn Cao Tín – 15CNTT (2015 – 2019) Báo cáo đồ án tốt nghiệp năm 2018 MỤC LỤC DANH MỤC HÌNH VẼ viii MỞ ĐẦU 1 Lý chọn đề tài Mục tiêu đề tài Nhiệm vụ đề tài 1 Đối tượng nghiên cứu Phạm vi nghiên cứu Phương pháp nghiên cứu Bố cục đề tài CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 1.1 Phân tích thiết kế hệ thống 1.2 Phân tích thiết kế hệ thống 1.2.1 1.2.2 1.2.3 Khái niệm Reactive Programming Khái niệm TypeScript Functional Programming gì? Nền tảng công nghệ 10 1.3 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.6 Giới thiệu Angular 10 Amazon Web Services gì? 15 Giới thiệu visual studio code 17 Giới thiệu Dynamodb 20 Giới thiệu Amazon S3 20 Giới thiệu AWS Lambda 21 1.3.7 Giới thiệu Amazon API Gateway 22 CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ 24 2.1 Yêu cầu chức 24 2.1.1 Chức public 24 2.1.2 Chức admin 24 2.2 Yêu cầu phi chức 24 2.3 Phân tích thiết kế hệ thống 25 Huỳnh Văn Cao Tín – 15CNTT (2015 – 2019) Báo cáo đồ án tốt nghiệp 2.3.1 Sơ đồ case sử dụng (Usecase diagram) 25 2.3.1.1 Case sử dụng user 25 2.3.1.2 Case sử dụng cho admin 26 2.3.2 Đặc tả Use-case 26 2.3.3 Thiết kế sở liệu 28 2.3.4 Cấu trúc bảng ràng buộc 29 CHƯƠNG 3: TRIỂN KHAI VÀ KẾT QUẢ ĐẠT ĐƯỢC 33 3.1 Môi trường triển khai 33 3.2 Kết triển khai 33 3.2.1 3.2.2 3.2.3 3.2.4 3.2.5 3.2.6 3.2.7 3.2.8 3.2.9 Giao diện trang chủ 33 Giao diện trang danh sách sản phẩm 34 Giao diện trang chi tiết sản phẩm 34 Giao diện phần bình luận sản phẩm 35 Giao diện trang đặt sản phẩm 36 Giao diện trang đăng nhập 37 Giao diện trang dashboard 37 Giao diện trang quản lý sản phẩm 38 Giao diện trang setting dashboard 38 KẾT LUẬN VÀ KIẾN NGHỊ 39 TÀI LIỆU THAM KHẢO 40 Huỳnh Văn Cao Tín – 15CNTT (2015 – 2019) Báo cáo đồ án tốt nghiệp DANH MỤC CÁC BẢNG Bảng 1: Bảng mô tả sử dụng web khách vãng lai 26 Bảng : Bảng mô tả sử dụng hệ thống người dùng 27 Bảng 3: Bảng mô tả sử dụng hệ thống Admin 27 Bảng 5: Bảng User 29 Bảng 6: Bảng Product 30 Bảng 7: Bảng Images 30 Bảng 8: Bảng Price 31 Bảng 9: Bảng Comment 31 Bảng 10: Bảng Categories 31 Bảng 11: Bảng Order detail 32 Bảng 12: Bảng Order Item 32 Huỳnh Văn Cao Tín – 15CNTT (2015 – 2019) Báo cáo đồ án tốt nghiệp DANH MỤC HÌNH VẼ Hình 1: Giới thiệu Visual studio code 18 Hình 3: Case sử dụng cho user 25 Hình 4: Case sử dụng cho admin 26 Hình 8: Sơ đồ sở liệu 29 Hình 9: Giao diện trang chủ 33 Hình 10: Giao diện trang danh sách sản phẩm 34 Hình 11: Giao diện trang chi tiết sản phẩm 34 Hình 12: Giao diện phần bình luận sản phẩm 35 Hình 13: Giao diện trang đặt sản phẩm 37 Hình 14: Giao diện trang đăng nhập 37 Hình 15: Giao diện trang dashboard 37 Hình 16: Giao diện trang quản lý sản phẩm 38 Hình 18: Giao diện trang setting dashboard 38 Huỳnh Văn Cao Tín – 15CNTT (2015 – 2019) Báo cáo đồ án tốt nghiệp Xây dựng website đặt pizza online MỞ ĐẦU Lý chọn đề tài Hiện nay, phát triển Công nghệ Thông tin nước ta bước vào thời kì với việc triển khai rộng rãi ứng dụng tin học cho tổchức xã hội Khơng cịn nghi ngờ vai trị Công nghệ Thông tin đời sống, khoa học kỹ thuật, kinh doanh, mặt xã hội, cá nhân Công nghệ Thông tin bước vào sống người bạn đồng hành, có vai trị lớn phát triển đất nước đời sống người Để đáp ứng nhu cầu ăn uống giảm chi phí, thời gian lại viêc đặt thức ăn giao hàng tận nơi khơng cịn xa lạ với người dùng Chính ưu điểm nên em định xây dựng Website đặt pizza online Mong website giúp người dùng lựa chọn Pizza theo sở thích cách dễ dàng thuận tiện Mục tiêu đề tài ➢ Thiết kế trang web hoàn chỉnh với angular, Amazon web services ➢ Xây dựng website order pizza hoàn chỉnh giúp người dùng thuận tiện việc mua sản phẩm ➢ Website cung cấp tính phù hợp với người dùng Nhiệm vụ đề tài ➢ Tìm hiểu vấn đề nhiều người quan tâm ➢ Mơ hình hóa website ➢ Nghiên cứu cài đặt môi trường phục vụ xây dựng website ➢ Xây dựng chức cần thiết website Huỳnh Văn Cao Tín – 15CNTT1 Trang Xây dựng website đặt pizza online 2.3.1.2 Case sử dụng cho admin Hình 3: Case sử dụng cho admin 2.3.2 Đặc tả Use-case Bảng 1: Bảng mô tả sử dụng web khách vãng lai Mã Usecase UC1 Tên Sử dụng web khách vãng lai Mô tả Khách vãng lai xem sản phẩm thi Xem thơng tin sản phẩm Bình luận sản phẩm Tìm kiếm sản phẩm Đặt hàng Người thực Khách vãng lai Huỳnh Văn Cao Tín – 15CNTT1 Trang 26 Xây dựng website đặt pizza online Điều kiện trước Không xử lý Sau xử lý Hiển thị danh sách tất sản phẩm Các bước thực Hiển thị danh sách sản phẩm vào hệ thống Truy cập vô sản phẩm để xem chi tiết sản phẩm bình luận sản phẩm Bảng : Bảng mô tả sử dụng hệ thống người dùng Mã Usecase UC2 Tên Sử dụng hệ thống người dùng Mơ tả Người dùng đăng nhập vào hệ thống thi Người thực Khách hàng Điều kiện trước Có xử lý Sau xử lý Hiển thị điểm số thi xong thi Các bước thực Khi truy cập vào thi để xem thông tin, nhấn vào “vào thi” để thi Ngoại lệ Không Bảng 3: Bảng mô tả sử dụng hệ thống Admin Huỳnh Văn Cao Tín – 15CNTT1 Trang 27 Xây dựng website đặt pizza online Mã Usecase UC3 Tên Sử dụng hệ thống admin Mơ tả Người admin tạo nhiều sản phẩm Người thực Người quản lý website Điều kiện trước Không xử lý Sau xử lý Người quản lý tạo sản phẩm, xem thống kê, xem tất bình luận sản phẩm Các bước thực Người quản lý vào trang đăng nhập vào trang quản lý trang web Ngoại lệ Không 2.3.3 Thiết kế sở liệu ➢ Sơ đồ sở liệu Huỳnh Văn Cao Tín – 15CNTT1 Trang 28 Xây dựng website đặt pizza online Hình 4: Sơ đồ sở liệu 2.3.4 Cấu trúc bảng ràng buộc Bảng 4: Bảng User TÊN TRƯỜNG MƠ TẢ id Mã User, khóa email Email người dùng fullname Tên đầy đủ người dùng Huỳnh Văn Cao Tín – 15CNTT1 Trang 29 Xây dựng website đặt pizza online phoneNumber Số điện thoại người dùng address Địa người dùng Bảng 5: Bảng Product TÊN TRƯỜNG MÔ TẢ id Mã Product, khóa name Tên sản phẩm description Mơ tả sản phẩm discount Sản phẩm giảm giá theo phần trăm image Hình ảnh sản phẩm categoryId ID danh mục sản phẩm uid ID người dùng tạo sản phẩm timestamp Thời gian tạo sản phẩm Bảng 6: Bảng Images TÊN TRƯỜNG MƠ TẢ id Mã Image, khóa image Hình ảnh sản phẩm productId ID sản phẩm Huỳnh Văn Cao Tín – 15CNTT1 Trang 30 Xây dựng website đặt pizza online Bảng 7: Bảng Price TÊN TRƯỜNG MƠ TẢ id Mã price, khóa price giá sản phẩm size Kích cở sản phẩm productId Mã sản phẩm Bảng 8: Bảng Comment TÊN TRƯỜNG MÔ TẢ id Mã comment , khóa comment Nội dung bình luận productId ID sản phẩm uid ID người bình luận Bảng 9: Bảng Categories TÊN TRƯỜNG MÔ TẢ id Mã Category, khóa name Tên danh mục Huỳnh Văn Cao Tín – 15CNTT1 Trang 31 Xây dựng website đặt pizza online timestamp Thời gian tạo uid Id người tạo Bảng 101: Bảng Order detail TÊN TRƯỜNG MÔ TẢ id Mã chi tiết hóa đơn, khóa productId ID sản phẩm orderID ID hóa đơn Bảng 11: Bảng Order Item TÊN TRƯỜNG MƠ TẢ id Mã hóa đơn người dùng, khóa status trạng thái đơn hàng uid ID người dùng đặt hàng timestamp Thời gian đặt hàng Huỳnh Văn Cao Tín – 15CNTT1 Trang 32 Xây dựng website đặt pizza online CHƯƠNG 3: TRIỂN KHAI VÀ KẾT QUẢ ĐẠT ĐƯỢC 3.1 Môi trường triển khai • Cơng cụ lập trình: Visual studio code • Ngơn ngữ lập trình: Angular, nodejs • Thiết bị sử dụng: Laptop 3.2 Kết triển khai 3.2.1 Giao diện trang chủ Hình 5: Giao diện trang chủ Huỳnh Văn Cao Tín – 15CNTT1 Trang 33 Xây dựng website đặt pizza online 3.2.2 Giao diện trang danh sách sản phẩm Hình 6: Giao diện trang danh sách sản phẩm 3.2.3 Giao diện trang chi tiết sản phẩm Hình 7: Giao diện trang chi tiết sản phẩm Huỳnh Văn Cao Tín – 15CNTT1 Trang 34 Xây dựng website đặt pizza online 3.2.4 Giao diện phần bình luận sản phẩm Hình 8: Giao diện phần bình luận sản phẩm Huỳnh Văn Cao Tín – 15CNTT1 Trang 35 Xây dựng website đặt pizza online 3.2.5 Giao diện trang đặt sản phẩm Huỳnh Văn Cao Tín – 15CNTT1 Trang 36 Xây dựng website đặt pizza online Hình 9: Giao diện trang đặt sản phẩm 3.2.6 Giao diện trang đăng nhập Hình 10: Giao diện trang đăng nhập 3.2.7 Giao diện trang dashboard Hình 11: Giao diện trang dashboard Huỳnh Văn Cao Tín – 15CNTT1 Trang 37 Xây dựng website đặt pizza online 3.2.8 Giao diện trang quản lý sản phẩm Hình 12: Giao diện trang quản lý sản phẩm 3.2.9 Giao diện trang setting dashboard Hình 13: Giao diện trang setting dashboard Huỳnh Văn Cao Tín – 15CNTT1 Trang 38 Xây dựng website đặt pizza online KẾT LUẬN VÀ KIẾN NGHỊ ƯU ĐIỂM • Học hỏi nhiều kinh nghiệm cơng việc • Học quy trình xây dựng hệ thống với công nghệ angular, aws, thư viện mã nguồn mở cách thiết kế giúp sản phẩm trở nên đẹp hơn, hướng đến trải nghiệm người dùng • Áp dụng kiến thức học vào việc xây dựng sản phẩm • Nâng cao trách nhiệm công việc, tinh thần tự giác • Cải thiện tương đối kỹ đọc – hiểu tiếng Anh • Rút nhiều kinh nghiệm quý báu, học cách tự lập, tự nghiên cứu, kỹ mềm phong cách làm việc mơi trường chun nghiệp có nhìn nhận cơng việc tương lai HẠN CHẾ • Thời gian hạn chế nên chưa phát triển nhiều • Do kiến thức kinh nghiệm kỹ lập trình cịn hạn chế nên sản phẩm phần mềm đơn giản, chưa triển khai tưởng xây dựng hệ thống đề tài HƯỚNG PHÁT TRIỂN • Hỗ trợ thêm nhiều tính đề hệ thống đưa để sử dụng rộng rãi Huỳnh Văn Cao Tín – 15CNTT1 Trang 39 Xây dựng website đặt pizza online TÀI LIỆU THAM KHẢO [1] http://ictvietnam.vn/danh-gia-va-trao-doi/ly-luan/reactive-programming-lagi.htm [2] https://viblo.asia/p/tai-sao-chung-ta-nen-su-dung-angular-eW65GEYPZDO [3] https://tech.vccloud.vn/amazon-web-services-aws-la-gi20181101093139012.htm [4] https://aws.amazon.com/vi/ [5] https://angular.io/ [6] https://w3layouts.com/ Huỳnh Văn Cao Tín – 15CNTT1 Trang 40 ... hình hóa website ➢ Nghiên cứu cài đặt môi trường phục vụ xây dựng website ➢ Xây dựng chức cần thiết website Huỳnh Văn Cao Tín – 15CNTT1 Trang Xây dựng website đặt pizza online ➢ Xây dựng trang... Trang Xây dựng website đặt pizza online CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 1.1 Phân tích thiết kế hệ thống Để xây dựng website đặt pizza thành công đạt yêu cầu, cần tiến hành phân tích thiết kế hệ thống website. .. Trang 34 Xây dựng website đặt pizza online 3.2.4 Giao diện phần bình luận sản phẩm Hình 8: Giao diện phần bình luận sản phẩm Huỳnh Văn Cao Tín – 15CNTT1 Trang 35 Xây dựng website đặt pizza online