ĐỒ án môn học lập TRÌNH WEB bán HÀNG CÔNG NGHỆ

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ TPHCM KHOA CÔNG NGHỆ THÔNG TIN ***** ĐỒ ÁN MƠN HỌC LẬP TRÌNH WEB BÁN HÀNG CÔNG NGHỆ GVHD: SVTH: TPHCM, Ngày 15/05/2017 MỤC LỤC CHƯƠNG I: TỔNG QUAN VẤN ĐỀ NGHIÊN CỨU 1.1 Giới thiệu đề tài: 1.2 Mục đích nghiên cứu: 1.3 Mục tiêu đề tài: CHƯƠNG II: TÌM HIỂU VỀ CƠ SỞ LÝ THUYẾT 2.1 Tổng quan ASP.NET: 2.1.1 Giới thiệu ASP.NE 2.1.2 Tìm hiểu mơ hình 2.2 Giới thiệu mơ hình lập trình Web ASP.NET M 2.3 Hoạt động thành phần ASP.NE 2.4 Tại phải sử dụng ASP.NET? 2.5 Ưu điểm khuyết điểm ASP.NET: 2.6 Sự khác biệt mơ hình lập trình Web ASP.NET MV 2.7 Ajax: 2.7.1 Ajax nhỉ? 2.7.2 Ajax hoạt động n 2.7.3 Nhược điểm AJA 2.8 HTML: 2.8.1 HTML gì? 2.8.2 HTML xử lý 2.8.3 Dùng chương trình g 2.8.4 HTML đóng vai trò g 2.9 CSS: 2.10 Bootstrap: 2.10.1 Bootstrap gì? 2.10.2 Vì phải dùng nó? 2.11 Jquery: 2.11.1 Jquery gì? 2.11.2 Jquery giúp ích cho người lập trình web? 2.11.3 Tại phải dùng Jquery? 2.12 HTML5: 2.12.1 HTML5 gì? 2.12.2 HTML5 vấn đề quan trọng chúng ta? 2.13 CSS3: CHƯƠNG III: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 3.1 Phân tích thiết kế chức ứng dụng: 3.1.1 Mô tả chức ứng dụng: 3.1.2 Sơ đồ Use Case: 3.1.3 Sơ đồ Activity: 3.1.4 Sơ đồ Class Diagram: 3.2 Thiết kế liệu: 3.2.1 Mơ hình vật lý: 3.2.2 Danh sách đối tượng: 3.2.3 Mô tả chi tiết bảng: CHƯƠNG 4: KẾT QUẢ THỰC NGHIỆM 4.1 Giao diện User: 4.1.1 Giao diện trang chủ: 4.1.2 Giao diện Menu chọn: 4.1.3 Giao diện trang sản phẩm: 4.1.4 Giao diện trang chi tiết sản phẩm 4.1.5 Giao diện trang đăng ký tài kho 4.1.6 Giao diện trang đăng nhập: 4.1.7 Giao diện trang giỏ hàng: 4.1.8 Giao diện trang xác nhận đặt hà 4.1.9 Giao diện trang xác nhận đặt 4.1.10 Giao diện trang tìm kiếm: 4.1.11 Giao diện trang giải đáp thắc mắc: 4.1.12 Giao diện trang liên hệ: 4.2 Giao diện Admin: 4.2.1 Giao diện trang đăng nhậ 4.2.2 Giao diện trang chủ Adm 4.2.3 Giao diện trang thêm mớ 4.2.4 Giao diện trang sửa sản p 4.2.5 Giao diện trang xóa sản p 4.2.6 Giao diện trang nhập hàn 4.2.7 Giao diện trang sản phẩm 4.2.8 Giao diện trang thống kê CHƯƠNG 5: TỔNG KẾT 5.1 Kết đạt được: 5.2 Hoàn thành: 5.3 Hướng phát triển: 5.4 Tài liệu tham khảo: CHƯƠNG I: TỔNG QUAN VẤN ĐỀ NGHIÊN CỨU 1.1 Giới thiệu đề tài: Trong năm gần đây, ứng dụng CNTT quản lý web phát triển mạnh mẽ, giúp cho cửa hàng kiếm lợi nhuận nhiều nhờ vào trang website bán hàng nhanh Nên nhóm chúng em định chọn đề tài xây dựng trang website bán hàng công nghệ Với mong muốn giúp cho cửa hàng kiếm thêm thu nhập nhiều nhờ vào việc bán online Ngoài ra, website bán hàng thân thiện giúp cho khách hàng mua thuận lợi hơn, khách hàng mua hàng cơng nghệ mà thích khơng cần tốn nhiều thời gian để cửa hàng mua Đây điều tuyệt khách hàng Một nhà phát triển phần mềm hàng đầu giới lĩnh vực Microsoft, họ cho đời mơ hình ASP.NET MVC5 hỗ trợ người phát triển ứng dụng web NET Framework có tích hợp cơng nghệ LINQ với Entity Framework hỗ trợ làm việc với loại CSDL Do đó, nhóm sinh viên chúng em chọn đề tài “Ứng dụng công nghệ phát triển web ASP.NET MVC5, Xây dựng Website bán hàng công nghệ ” để thực đồ án lập trình web đáp ứng theo chương trình đào tạo Trường, đồng thời mong muốn góp phần đẩy đưa ứng dụng CNTT vào Website việc bán hàng cơng nghệ hồn thiện thân thiện giúp cho khách hàng hài lòng vào Website bán hàng cơng nghệ nhóm chúng em 1.2 Mục đích nghiên cứu:  Học kiến thức  Tìm hiểu kĩ thuật lập trình ASP.NET MVC5  Tìm hiểu công nghệ hỗ trợ như: HTML5, CSS3, Ajax, Jquery, Web Sevice…  Tìm hiểu ngơn ngữ kiến thức tương tác CSDL (LINQ to SQL Entity FrameWork)  Cách điều khiển liệu(Controller)  Tìm hiểu toán trực tuyến vào web để cung cấp chức toán online qua thẻ…  Tìm hiểu Domain Hosting triển khai vận hành Website môi trường Internet  Xây dựng trang web “chuẩn Seo”  Tìm hiểu GoogleMapAPI để đánh dấu địa điểm website đồ, dẫn đường từ vị trí khách hàng đến cửa hàng website, giúp thân thiện với người dùng  Tìm hiểu Google API để đăng nhập gmail cho trang website  Tìm hiểu FB API để đăng nhập FB làm coment, like, share cho web,  Tìm hiểu Websivice để web cung cấp thành phần ứng dụng chuyển đổi tiền tệ, báo cáo thời tiết… 1.3 Mục tiêu đề tài: Vì website bán hàng, nên điều nhóm chúng em trọng tính thân thiện với người dùng, giao diện đẹp mắt, cách trình bày sản phẩm chi tiết sản phẩm, giá hợp lý cách để gây ấn tượng tốt với khách hàng Cả khách hàng nhà quản lý cảm thấy thoải mái sử dụng trang web đẹp dễ truy cập  Người dùng (User): Tham quan trang web Tìm kiếm lựa chọn sản phẩm cần mua Xem chi tiết sản phẩm Xem quảng cáo Đăng ký, đăng nhập phục vụ cho việc mua bán online Thực việc mua hàng toán trực tuyến Gửi ý kiến phản hồi, bình luận sản phẩm qua facebook chi tiết sản phẩm Gửi liên hệ cho công ty TTBShop Xem nơi bán shop thông qua Google Map trang liên hệ, giới thiệu  Người quản trị (Admin):  Quản lý trang web thông qua tài khoản Admin rõ ràng, dễ sử dụng, bảo mật cao  Quản lý tất sản phẩm cách dễ dàng Xem sản phẩm danh sách sản phẩm danh sách sản phẩm bán chạy  Thêm loại sản phẩm, màu cho loại sản phẩm   Kiểm tra xử lý đơn đặt hàng  Theo dõi phản hồi ý kiến khách hàng CHƯƠNG II: TÌM HIỂU VỀ CƠ SỞ LÝ THUYẾT 2.1 Tổng quan ASP.NET: 2.1.1 Giới thiệu ASP.NET: Đầu năm 2002, Microsoft giới thiệu kỹ thuật lập trình Web mẻ với tên gọi ban đầu ASP+, tên thức sau ASP.Net Với ASP.Net, khơng khơng cần địi hỏi bạn phải biết tag HTML, thiết kế web, mà cịn hỗ trợ mạnh lập trình hướng đối tượng trình xây dựng phát triển ứng dụng Web ASP.Net kỹ thuật lập trình phát triển ứng dụng web phía Server (Server-side) dựa tảng Microsoft Net Framework Hầu hết, người đến với lập trình web bắt đầu tìm hiểu kỹ thuật phía Client (Client-side) như: HTML, Java Script, CSS (Cascading Style Sheets) Khi Web browser yêu cầu trang web (trang web sử dụng kỹ thuật clientside), Web server tìm trang web mà Client u cầu, sau gởi cho Client Client nhận kết trả từ Server hiển thị lên hình ASP.Net sử dụng kỹ thuật lập trình phía server hồn tồn khác, mã lệnh phía server (ví dụ: mã lệnh trang ASP) biên dịch thi hành Web Server Sau Server đọc, biên dịch thi hành, kết tự động chuyển sang HTML/JavaScript/CSS trả cho Client Tất xử lý lệnh ASP.Net thực Server đó, gọi kỹ thuật lập trình phía server ASP.NET Microsoft phát triển qua nhiều phiên từ ASP.NET 1.0, 1.1, 2.0 gần phiên ASP.NET 2.1.2 Tìm hiểu mơ hình lập trình web MVC ASP.NET: Mơ hình MVC (viết tắt chữ đầu từ Model - View - Controller) kiến trúc phần mềm hay mô hình thiết kế sử dụng kỹ thuật phần mềm (đặc biệt phát triển ứng dụng web) Nó giúp cho tổ chức ứng dụng (phân bố source code ứng dụng) thành phần khác Model, View Controller Mỗi thành phần có nhiệm vụ riêng biệt độc lập với thành phần khác Model: thành phần chứa tất nghiệp vụ logic, phương thức xử lý, truy xuất CSDL, đối tượng mô tả liệu Class, hàm xử lý Model giao nhiệm vụ cung cấp liệu cho CSDL lưu liệu vào kho chứa liệu Tất nghiệp vụ logic thực thi Model Dữ liệu vào từ người dùng thông qua View để kiểm tra Model trước lưu vào sở liệu Việc truy xuất, xác nhận lưu liệu phần Model View: View hiển thị thông tin cho người dùng ứng dụng giao nhiệm vụ cho việc nhận liệu vào từ người dùng, gởi yêu cầu người dùng đến điều khiển (Controller), sau nhận lại phản hồi từ điều khiển hiển thị kết cho người dùng Các trang HTML, JSP, thư viện thể file nguồn phần View Controller: Controller tầng trung gian Model View Controller giao nhiệm vụ nhận yêu cầu từ người dùng (phía máy khách) Một yêu cầu nhận từ máy khách thực chức logic thích hợp từ thành phần Model sau sinh kết cho người dùng thành phần View hiển thị ActionServlet, Action, ActionForm, struts-config.xml thành phần Controller Một ứng dụng web phát triển theo mơ hình MVC, có ngun lý hoạt động xử lý yêu cầu người dùng sau: - Khi có u cầu phát sinh từ người dùng (phía Client), yêu cầu gởi đến phía Server, Contronler tiếp nhận yêu cầu để xử lý - Bên Controller chứa nhiều phương thức (action), action tương ứng với yêu cầu cụ thể từ người dùng Controller lựa chọn action phù hợp với yêu cầu để xử lý Trong trình xử lý, Controller tương tác với Model để có liệu mà người dùng mong muốn - Sau Controller làm việc với model để có liệu theo yêu cầu, Controller gởi cho View thành phần Data Model, nhiệm vụ View chuyển Data Model nhận thành liệu ứng dụng gởi trả phía Client để hiển thị kết yêu cầu Hình 2.1: Mơ hình MVC 2.2 Giới thiệu mơ hình lập trình Web ASP.NET MVC5 ASP.NET MVC5 giúp cho tạo ứng dụng web áp dụng mơ hình MVC thay tạo ứng dụng theo mẫu ASP.NET Web Forsm Nền tảng ASP.NET MVC có đặc điểm bật nhẹ (lightweight), dễ kiểm thử phần giao diện (so với ứng dụng Web Forms), tích hợp tính có sẵn ASP.NET Nền tảng ASP.NET MVC định nghĩa namespace System.Web.MVC phần name space System.Web MVC mẫu thiết kế (design pattern) chuẩn mà nhiều lập trình viên quen thuộc Một số loại ứng dụng web thích hợp với kiến trúc MVC Một số khác thích hợp với ASP.NET Web Forms chế postbacks Đơi có ứng dụng kết hợp hai kiến trúc Tách bạch tác vụ ứng dụng (logic nhập liệu, business logic, logic giao diện), dễ dàng kiểm thử mặc định áp dụng hướng phát triển TDD Tất tính mơ hình MVC cài đặt dựa Interface kiểm thử cách sử dụng đối tượng mocks, mock object đối tượng mô tính đối tượng thực ứng dụng Bạn kiểm thử unit-test cho ứng dụng mà khơng cần chạy Controller tiến trình 4.1.9 Giao diện trang xác nhận đặt hàng: 49 4.1.10Giao diện trang tìm kiếm: 50 4.1.11Giao diện trang giải đáp thắc mắc: 4.1.12Giao diện trang liên hệ: 51 4.2 Giao diện Admin: 4.2.1 Giao diện trang đăng nhập phần Admin: 52 4.2.2 Giao diện trang chủ Admin: 53 4.2.3 Giao diện trang thêm sản phẩm: 54 4.2.4 Giao diện trang sửa sản phẩm: 55 4.2.5 Giao diện trang xóa sản phẩm: 56 4.2.6 Giao diện trang nhập hàng mới: 57 4.2.7 Giao diện trang sản phẩm hết: 58 4.2.8 Giao diện trang thống kê: 59 CHƯƠNG 5: TỔNG KẾT 5.1 Kết đạt được: Qua trình thực đồ án mơn học lập trình web này, nhóm sinh viên chúng em mốt số kết sau: -Hiểu biết thêm ứng dụng web công nghệ asp.net khác biệt so với ứng dụng desktop (ứng dụng winform) học -Hiểu biết ngơn ngữ lập trình C# ứng dụng vào Web Microsoft, cụ thể ASP.NET MVC5 -Hiển thêm số ngôn ngữ HTML5, CSS3, JQUERY, AJAX, … -Hiểu biết ngôn ngữ truy vấn CSDL LINQ, ngôn ngữ truy vấn CSDL theo dạng hướng đối tượng, gần gũi với người lập trình từ trước tới tương tác với CSDL khác XML, CSDL quan hệ, … -Đồ án giúp sinh viên tổng hợp kiến thức học từ môn sở trường trang bị cho sinh viên từ học kỳ trước CSDL, hệ quản trị CSDL nâng cao, SQL Server, kỹ thuật lập trình, lập trình hướng đối tượng (OOP), phân tích thiết kế hệ thống thơng tin, … -Nâng cao khả lập trình, biết thêm mốt số công nghệ như: toan trực tuyến, FaceBook API, Google API, -Trên sở kiến thức học nhóm chúng em phát họa ứng web mang tính nhu cầu phục vụ cho việc học Tuy ứng dụng web đơn giản nội dung chưa đầy đủ nhiều chức cần thiết, chưa tối ưu mặt giao diện, giải thuật hay xử lý lỗi, bước làm tảng cho nhóm phát triển, xây dựng ứng dụng web thực tế 60 5.2 Hoàn thành: STT Chức Đăng ký Đăng nhập Thêm sản phẩm vào giỏ hàng Xem Sản phẩm theo danh mục Tìm kiếm Xem chi tiết sản phẩm Cập nhật giỏ hàng Đặt hàng Thêm sản phẩm 10 Thêm giá cho sản phẩm 11 Cập nhật đơn đặt hàng 12 Thêm loại sản phẩm 13 Xem tài khoản khách hàng 14 Nhập hàng 15 Cập nhật slton 16 Quản lý đơn hàng 17 Facebook Api, Google map Api 61 5.3 Hướng phát triển: - Ở trang người dùng, cần nên hoàn thiện bố cục trang web, trang trí thiết kế cho trang web mang tính thân thiện cho người dùng nữa, cần nên sửa lại độ tương thích trang web để hoạt động khơng máy tính để bàn mà cịn tương thích trình duyệt di động - Ngồi ra, theo xu hướng hầu hết người dùng sử dụng tài khoản Facebook Google, lẽ nên ta cần xây dựng thêm chức đăng nhập tài khoản Facebook Google cho người dùng để họ đăng nhập thay đăng ký tài khoản trang web mà ta làm - Cần thêm chức tương tự trang liên hệ thay phải ghi thơng tin trang web, ta sử dụng chức gửi mail phản hồi cho người dùng họ có tài khoản Yahoo gmail, họ sử dụng tài khoản gửi mail nhanh chóng - Phương thức tốn trực tuyến cách thêm sản phẩm tốn nhiều thời gian sở liệu nhiều sản phẩm (từ 30 sản phẩm trở lên) nên ta cần phải thay đổi hình thức tốn khác cần phải khắc phục lại để cải tiến tiến độ nhanh chóng ta muốn lấy mã nhúng sản phẩm - Cần phải làm thêm việc lỗi 404, 500, … - Thêm công nghệ Web Service 5.4 Tài liệu tham khảo: https://www.youtube.com/watch? v=M0jdFS4ZyEk&list=PLRhlTlpDUWsyK1TIsewrQ7WwC7QkCSCPD 62 Trung tâm Đào tạo mạng máy tính Nhất Nghệ Giáo trình ASP.NET http://cukimngoc.com/mo-hinh-mvc-la-gi.html http://support.microsoft.com/kb/2645095/vi-vn https://huynhminhkhoa.wordpress.com/c-cshap-vb-net/model-view controller - mvc-la-gi/ http://lmt.com.vn/home/php/tim-hieu-php/360 - tim - hieu –mo – hinh – mvc – la - gi.html http://laptrinhvien.net/blog/tim-hieu-mo-hinh-mvc-la-gi/ https://www.youtube.com/watch?v=MAPKjN8mxfU http://cliphot24h.com/3/12938/Cong-nghe/Lap-trinh/AspnetCsharp/ Phan-1-Tong-quan-ve-MVC-va-ASPNET-MVC.aspx https://www.youtube.com/watch?v=VX56rqLwZxo https://www.youtube.com/watch?v=XxcAxPIt7SQ https://www.youtube.com/watch? v=M0jdFS4ZyEk&list=PLRhlT1pDUWsyK1TIsewrQ7WwC7QkCS CPD https://www.youtube.com/watch?v=x-7y_ewtUcs https://www.youtube.com/watch?v=_yxxwZB2CgE http://stackoverflow.com/ http://www.w3schools.com/ 63 ... ngữ lập trình mà người lập trình cần có kiến thức HTML học Một lập trình viên sử dụng jquery để lập trình tiết kiệm nhiều thời gian người lập trình web 2.11.2 Jquery giúp ích cho người lập trình. .. thực đồ án lập trình web đáp ứng theo chương trình đào tạo Trường, đồng thời mong muốn góp phần đẩy đưa ứng dụng CNTT vào Website việc bán hàng cơng nghệ hồn thiện thân thiện giúp cho khách hàng. .. CNTT quản lý web phát triển mạnh mẽ, giúp cho cửa hàng kiếm lợi nhuận nhiều nhờ vào trang website bán hàng nhanh Nên nhóm chúng em định chọn đề tài xây dựng trang website bán hàng công nghệ Với