XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC 5

TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH KHOA ĐÀO TẠO CHẤT LƢỢNG CAO ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC Nhóm SVTH : NGUYỄN HUỲNH MINH LUÂN PHẠM THANH PHONG Khoá : 2010-2014 Ngành : Công nghệ thông tin GVHD : ThS NGUYỄN MINH ĐẠO Tp Hồ Chí Minh, tháng năm 2015 10110066 10110084 TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH KHOA ĐÀO TẠO CHẤT LƢỢNG CAO ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC Nhóm SVTH : NGUYỄN HUỲNH MINH LUÂN PHẠM THANH PHONG Khoá : 2010-2014 Ngành : Công nghệ thông tin GVHD : ThS NGUYỄN MINH ĐẠO Tp Hồ Chí Minh, tháng năm 2015 10110066 10110084 CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh Phúc ******* Tp Hồ Chí Minh, ngày 22 tháng năm 2014 NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP Họ tên Sinh viên: NGUYỄN HUỲNH MINH LUÂN PHẠM THANH PHONG Ngành: Công nghệ thông tin Giảng viên hƣớng dẫn: NGUYỄN MINH ĐẠO Ngày nhận đề tài: 22/9/2014 MSSV: 10110066 MSSV: 10110084 Lớp: 10110CLC ĐT: 0903982082 Ngày nộp đề tài: 10/1/2014 Tên đề tài: XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC5 Các số liệu, tài liệu ban đầu: Nội dung đề tài thực hiện: - Tìm hiểu mô hình bán lẻ B2C thƣơng mại điện tử - Xây dựng sở liệu Microsoft SQL Server 2012 - Tìm hiểu công nghệ ASP.NET MVC5 - Xây dựng trang web sử dụng công nghệ ASP.NET MVC5 giao diện Bootstrap - Upload website lên internet Sản phẩm: Website bán laptop TRƢỞNG NGÀNH GIẢNG VIÊN HƢỚNG DẪN CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh Phúc ******* BẢNG NHẬN XÉT CỦA GIÁO VIÊN HƢỚNG DẪN Họ tên Sinh viên: NGUYỄN HUỲNH MINH LUÂN MSSV: 10110066 PHẠM THANH PHONG MSSV: 10110084 Ngành: Công nghệ thông tin Tên đề tài: XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC5 Họ tên giáo viên hƣớng dẫn: NGUYỄN MINH ĐẠO NHẬN XÉT Về nội dung đề tài & khối lƣợng thực hiện: Ƣu điểm: Khuyết điểm: Đề nghị cho bảo vệ hay không? Đánh giá loại: Điểm:……………….(Bằng chữ: ) Tp Hồ Chí Minh, ngày tháng Giáo viên hƣớng dẫn (Ký & ghi rõ họ tên) Nguyễn Minh Đạo năm 2015 CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh Phúc ******* BẢNG NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN Họ tên Sinh viên: NGUYỄN HUỲNH MINH LUÂN MSSV: 10110066 PHẠM THANH PHONG MSSV: 10110084 Ngành: Công nghệ thông tin Tên đề tài: XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC5 Họ tên giáo viên phản biện: NGUYỄN THANH PHƢỚC NHẬN XÉT Về nội dung đề tài & khối lƣợng thực hiện: Ƣu điểm: Khuyết điểm: Đề nghị cho bảo vệ hay không? Đánh giá loại: Điểm:……………….(Bằng chữ: ) Tp Hồ Chí Minh, ngày tháng năm 2015 Giáo viên phản biện (Ký & ghi rõ họ tên) Nguyễn Thanh Phước LỜI CẢM ƠN Chúng em xin chân thành cảm ơn Quý Thầy Cô Khoa Chất Lƣợng Cao Trƣờng Đại Học Sƣ Phạm Kỹ Thuật Tp.HCM tạo điều kiện cho em thực đề tài Em xin chân thành cảm ơn Thầy Nguyễn Minh Đạo tận tình hƣớng dẫn, bảo em suốt trình thực khóa luận tốt nghiệp Chân thành cảm ơn Quý Thầy Cô Khoa Công Nghệ Thông Tin, trƣờng Đại Học Sƣ Phạm Kỹ thuật TP Hồ Chí Minh, giảng suốt khóa học, kiến thức tảng nhƣ kiến thức chuyên ngành giúp cho em hoàn thành tốt đề tài Xin chân thành cám ơn anh chị bạn bè ủng hộ, giúp đỡ động viên em thời gian học tập nghiên cứu Trong phạm vi khả cho phép, em cố gắng để hoàn thành đề tài cách tốt Song, chắn không tránh khỏi thiếu sót Em kýnh mong nhận đƣợc cảm thông ý kiến đóng góp Quý Thầy Cô bạn Nhóm sinh viên thực hiện: Nguyễn Huỳnh Minh Luân Phạm Thanh Phong i TÓM TẮT BẰNG TIẾNG VIỆT Ngày nay, công nghệ web NET Framework Microsoft ngày phát triển mạnh mẽ, với công nghệ khác nhƣ: PHP, JSP, Trong công nghệ ASP.NET MVC công nghệ mang nhiều tính ƣu việt Bên cạnh đó, việc bán hàng qua mạng thông qua website trực tuyến không xa lạ ngƣời Việt ngày phát huy mạnh Những gian hàng online giúp tiết kiệm đƣợc nhiều thời gian cho ngƣời bận rộn Vì nhóm chúng em chọn xây dựng website bán Laptop dựa tảng framework ASP.NET MVC5 số tính khác để hỗ trợ khách hàng việc đặt hàng qua mạng Internet Các vấn đề mà nhóm em nghiên cứu đƣợc framework ASP.NET MVC5, công nghệ AJAX, cấu trúc JSON, API service, dịch vụ SMS, Bootstrap Các hƣớng tiếp cận phát triển chúng em tìm kiếm thông tin qua Internet, xử lý thông tin dƣới giúp đỡ Giáo viên hƣớng dẫn Trong trình nghiên cứu chúng em gặp nhiều khó khăn có số phƣơng pháp giải vấn đề nhƣ: lên forum tham khảo hỏi ý kiến ngƣời, xin ý kiến đóng góp giáo viên hƣớng dẫn, trao đổi ý kiến với bạn nhóm để tìm vấn đề giải Kết cuối cùng, chúng em xây dựng thành công website bán laptop đáp ứng đầy đủ nhu cầu khách hàng Website sử dụng giao diện Bootstrap, hỗ trợ ngƣời dùng sử dụng nhiều thiết bị với kích thƣớc hình khác nhƣ máy desktop, laptop, tablet, smartphone ii TÓM TẮT BẰNG TIẾNG ANH Today, technical web base on Microsoft’s NET Framework is strong growing up beside other technicals such as PHP, JSP, However, ASP.NET MVC technical have many good feature In addition ,the online sales website was not so strange with the Vietnamese The online stores help to save a lot of time for busy people So, we decided to build a website sell Laptops base on ASP.NET MVC5 Framework and some other features to support customer order product via internet Issues that we reseached are ASP.NET MVC5 Framework, technical AJAX, structor JSON, API Service, service SMS, Bootstrap Our approach to development are: find information via internet, processing information with the helping of supervisor During our research, we had many trouble and had some method to solve the problem such as references to the forum and ask for people's opinions, ask opinions of supervisor, ask opinions team mate to solved the problem Finally, we are build website sell laptop successfully, website satisfies customer’s requirement Website used Bootstrap interface, the maximum support from the users use desktop to the users who love smartphones or tablet screen with the compact size iii MỤC LỤC NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP BẢNG NHẬN XÉT CỦA GIÁO VIÊN HƢỚNG DẪN BẢNG NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN LỜI CẢM ƠN i TÓM TẮT BẰNG TIẾNG VIỆT .ii TÓM TẮT BẰNG TIẾNG ANH iii MỤC LỤC .iv DANH SÁCH CÁC CHỮ VIẾT TẮT ix DANH SÁCH CÁC BẢNG BIỂU x DANH SÁCH CÁC HÌNH ẢNH, BIỂU ĐỒ xii Chƣơng - TỔNG QUAN 1.1 Giới thiệu tổng quát 1.2 Mục đích đồ án 1.3 Kết phần mềm Chƣơng 2.1 CƠ SỞ LÝ THUYẾT Công nghệ ASP.NET MVC5 2.1.1 Lịch sử đời MVC 2.1.2 Sự khác MVC webform 2.1.3 Kiến trúc sử dụng ASP.NET MVC 2.1.4 Đặc điểm ASP.NET MVC Framework 2.2 Mô hình MVC5 2.2.1 Các tính mô hình MVC3 MVC4 2.2.2 Các cải tiến MVC5 2.3 Vài nét thƣơng mại điện tử B2C 2.3.1 Khái niệm 2.3.2 Phân loại mô hình B2C iv 2.3.3 2.4 Giới thiệu hệ thống SMS Chƣơng 3.1 Hoạt động mô hình B2C - THIẾT KẾ GIAO DIỆN 10 Giao diện ngƣời dùng (FrontEnd) 10 3.1.1 Giao diện trang chủ 10 3.1.2 Giao diện tìm kiếm 11 3.1.3 Giao diện chi tiết sản phẩm 12 3.1.4 Giao diện danh sách yêu thích 13 3.1.5 Giao diện so sánh sản phẩm 13 3.1.6 Giao diện Shopping Cart 14 3.1.7 Giao diện toán 15 3.1.8 Giao diện quản lý đơn hàng 16 3.1.9 Giao diện đăng ký 17 3.1.10 Giao diện đăng nhập 18 3.1.11 Giao diện lấy lại mật 18 3.1.12 Giao diện liên hệ 19 3.1.13 Giao diện bình luận 20 3.1.14 Giao diện chia sẻ qua Facebook 20 3.2 Giao diện quản trị website (admin) 21 3.2.1 Giao diện trang chủ 21 3.2.2 Giao diện quản lý sản phẩm 22 3.2.3 Giao diện quản lý chi tiết sản phẩm 24 3.2.4 Giao diện quản lý nhà cung cấp 26 3.2.5 Giao diện quản lý đặt hàng 27 3.2.6 Giao diện quản lý phí vận chuyển 28 3.2.7 Giao diện quản lý tài khoản 29 v 10 11 12 13 PhoneNumberConfirmed TwoFactorEnabled LockoutEndDateUtc LockoutEnabled AccessFailedCount bit bit datetime bit int 14 UserName nvarchar(256) Xác nhận điện thoại 256 Số lần đăng nhập thất bại Tên thành viên Bảng 4-34 Bảng AspNetUser 4.4.2.11 Cấu trúc bảng AspNetUserLogins H nh 4-22 Bảng AspNetUserLogins - Mô tả bảng AspNetUserLogins Tên trƣờng LoginProvider Kiểu liệu nvarchar(128) ProviderKey nvarchar(128) UserId nvarchar(128) Số ký tự tối đa Mô tả 128 Tên nhà cung cấp dịch vụ nhƣ Google, Facebook 128 Khóa đại diện cho nhà cung cấp(url) 128 Mã thành viên Bảng 4-35 Bảng AspNetUserLogins 72 4.4.2.12 Cấu trúc bảng AspNetUserRoles H nh 4-23 Bảng AspNetUserRoles - Mô tả bảng AspNetUserRoles Tên trƣờng UserId RoleId Kiểu liệu nvarchar(128) nvarchar(128) Số ký tự tối đa Mô tả 128 Mã thành viên 128 Mã vai trò Bảng 4-36 Bảng AspNetUserRoles 4.4.2.13 Cấu trúc bảng AspNetUserClaims H nh 4-24 Bảng AspNetClaims - Mô tả bảng AspNetUserClaims Tên trƣờng Id UserId ClaimType ClaimValue Kiểu liệu int nvarchar(128) nvarchar(MAX) nvarchar(MAX) Số ký tự tối đa 128 Max Max Mô tả Khóa Mã thành viên Kiểu Claim Giá trị Claim Bảng 4-37 Bảng AspNetClaims 73 Chƣơng KẾT QUẢ SO SÁNH THỰC NGHIỆM PH N T CH TỔNG HỢP 5.1 Kết đạt đƣợc  Đã xây dựng hoàn chỉnh ứng dụng dựa mô hình MVC framework ASP.NET vào website, với đầy đủ chức bản: a Chức dành cho ngƣời dùng: 1) Đăng nhập, đăng xuất 2) Đăng ký 3) Đổi mật 4) Lấy lại mật 5) Tìm kiếm theo tên sản phẩm 6) Tìm kiếm nâng cao 7) Xem chi tiết sản phẩm 8) Bình luận, chia sẻ qua Facebook 9) Thanh toán có tính phí vận chuyển khu vực TPHCM 10) Lập danh sách yêu thích 11) So sánh sản phẩm 12) Quản lý giỏ hàng 13) Quản lý đặt hàng 14) Đặt hàng 15) Nhận tin nhắn SMS xác nhận đơn hàng đặt thành công b Chức dành cho Admin: 1) Đăng nhập, đăng xuất 2) Đổi mật 3) Lấy lại mật 4) Quản lý loại sản phẩm 5) Quản lý sản phẩm 6) Quản lý đơn hàng 7) Quản lý nhà sản xuất 8) Quản lý đặt hàng 9) Quản lý phí vận chuyển 10) Quản lý tài khoản 11) Quản lý quyền hạn tài khoản 12) Thống kê  Ứng dụng sms vào website cho chức nhắn tin thông báo khách hàng đặt hàng thành công  Áp dụng giao diện Bootstrap nên website tƣơng thích với kích thƣớc hình khác (máy tính, máy tính bảng, điện thoại di động) 74 5.2 Thực nghiệm  Website đƣợc uphost triển khai cho khách hàng sử dụng, nhiên website chƣa đƣợc phổ biến rộng rãi  Địa website là: http://shopmaytinh.somee.com/ Chƣơng KẾT LUẬN 6.1 Ƣu khuyết điểm Ƣu điểm: - Giúp ngƣời dùng xem đặt sản phẩm dễ dàng, thuận tiện - Có tính ứng dụng cao - Website có tính responsive Nhƣợc điểm: Tốc độ thực thi hiệu suất hệ thống chƣa cao 6.2 Hƣớng phát triển Làm thêm số chức mở rộng, phát triển thêm số chức mới: - Quản lý khách hàng theo nhóm ( vd: Khách hàng VIP, khách hàng thƣờng,…) - Nâng cao tốc độ thực thi hiệu suất hệ thống - Nâng cao tính bảo mật hệ thống - Nâng cấp hệ thống phí vận chuyển toàn nƣớc - Đồ án tốt nghiệp chúng em tránh đƣợc khiếm khuyết, mong đƣợc tham gia góp ý Quý Thầy Cô Nhóm em xin chân thành cảm ơn! 75 TÀI LIỆU THAM KHẢO Tiếng Việt [1] [2] [2] [3] [4] [5] Tiếng Anh [1] [2] [3] [4] [5] Nguyễn Tuấn Anh (21/9/2013), “Làm quen với mô hình MVC4 ASP.NET” http://nguyentuananhtn.blogspot.com/2013/09/bai-1-lam-quen-voi-mohinh-mvc-4-aspnet.html Đào Hải Nam (21/7/2013), “Bắt đầu với mô hình ASP.NET MVC5” http://namdh.wordpress.com/2013/07/23/getting-started-with-asp-netmvc-5/ FIBOSMS (2009), “SMS API gì?” http://www.fibosms.com/sms-api-la-gi/ Lập trình ASP.NET MVC http://www.slideshare.net/tuoitrecomvn/lap-trinhaspnetmvc Tổng quan công nghệ SMS http://www.thegioitongdai.com.vn/khuyen-mai/tu-van-lap-dat-tongdai/tong-quan-cong-nghe-sms/87.html Tài liệu thƣơng mại điện tử http://aitech.edu.vn/thu-vien-tai-lieu/thuong-mai-dien-tu-c82.html Jon Galloway, Phil Haack, Brad Wilson, K.Scott Allen, Scott Hanselman (2012), “Proffessional ASP.NET MVC4”, John Wiley & Sons, Inc 10475 Crosspoint Boulevard Indianapolis, IN 46256 Jose Guay Paz (2013), “Beginning ASP.NET MVC5”, Apress, LLC 233 Spring Street New York, NY 10013 Bryan P Johnson, John Earl Clark (4/2013), “Creating Mobile Apps with Sencha Touch 2”, Packt Publishing Ltd Livery Place35 Livery Street Birmingham B3 2PB, UK Adrian Kosmaczewski (14/6/2012), “Mobile JavaScript Application Development”, O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopo.f Learn about ASP.NET MVC http://www.asp.net/mvc/overview/getting-started Chƣơng PHỤ LỤC 7.1 Cài đặt ứng dụng - Sử dụng SQL Server 2012  Import sở liệu vào SQL Server Bƣớc 1: Mở Microsoft SQL Server Management, kết nối vào server, chọn file  open  file Bƣớc 2: Chọn đƣờng dẫn đến file Database/DBmaytinh.sql Bƣớc 3: Nhấn click vào Execute phím F5 để tạo Database  Chỉnh sửa cấu hình file config project Bƣớc 1: Khởi động visual studio 2012 Bƣớc 2:Mở file ShopMayTinh.sln Bƣớc 2: Bên tay phải chọn cửa sổ Solution Explorer kéo xuống dƣới chọn file web.config: Bƣớc 3: Chỉnh cấu hình file web.config Nhấn double click vào Web.config sau tìm đến thẻ dòng