tìm hiểu ngôn ngữ asp net mvc4 và xây dựng website bán hàng shoploop

MỤC LỤC Xây dựng website bán hàng ShopLoop DANH MỤC HÌNH VẼ Chương : MỞ ĐẦU 1.1 Giới thiệu đề tài ASP.NET MVC biết đến lựa chọn thông minh cho việc thiết kế Website, xây dựng với lớp chính, lớp giao diện ( Views ) , lớp điều khiển ( Controller ) lớp liệu ( Models ) Việc chia trang web thành nhiều lớp giúp giúp cho lập trình viên xây dựng website với cấu trúc chặt chẽ, rõ rang Với cấu trúc lớp, việc nâng cấp thay chức trở nên dễ dàng, việc kiểm thử đơn giản Với ưu điểm trên, chọn môn học đề tài, nhóm chúng em định chọn đề tài “Xây dựng Website bán hàng trực tuyến SNEAKERSHOP” công nghệ ASP NET MVC 1.2 Đối tượng mục tiêu nghiên cứu 1.2.1 Đối tượng Mọi người toàn quốc có nhu cầu đặt mua hàng qua mạng 1.2.2 Mục tiêu nghiên cứu  Học kiến thức  Tìm hiểu kĩ thuật lập trình, cách tổ chức đối tượng trọng MVC  Tìm hiểu công nghệ hỗ trợ HTML5, CSS3, Ajax, Jquery, Web Sevice…  Tìm hiểu cách hoạt động Client – Server Xây dựng website bán hàng ShopLoop  Tìm hiểu cách lưu trữ liệu hệ quản trị sở liệu SQL Server  Xây dựng trang web “chuẩn Seo”  Áp dụng 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  Áp dụng 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.2.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  Khách hàng  Tham quan trang web  Tìm kiếm lựa chọn sản phẩm cần mua  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  Nhà quản lý  Quản lý trang web thơng qua tài khoản Admin rõ ràng, dễ sử dụng  Quản lý tất sản phẩm cách dễ dàng  Thêm, xóa, sửa thơng tin sở liệu nhanh chóng  Kiểm tra xử lý đơn đặt hàng  Theo dõi phản hồi ý kiến khách hàng  Phân quyền cho nhân viên để quản lý trang web Xây dựng website bán hàng ShopLoop Xây dựng website bán hàng ShopLoop Chương : CƠ SỞ LÝ THUYẾT 2.1 Giới thiệu MVC 4.0 (Model – View – Controller) ASP.NET MVC framework cho phép xây dựng ứng dụng web chuẩn, có khả mở rộng, sử dụng mẫu thiết kế tốt sức mạnh ASP.NET NET Framwork Nguồn gốc ASP.NET MVC 2.1.1 ASP.NET MVC lần xuất dự án mã nguồn mở MonoRail Đầu năm 2009 phiên ASP.NET MVC 1.0 đời Hiện phiên ASP.NET MVC 4.0 mắt vào 15/08/2012 MVC phần Visual 2012, Visual 2013 cài đặt thêm MVC cho Visual 2010 Kiến trúc MVC 2.1.2 MVC viết tắt chữ đầu Models, Views, Controllers MVC chia giao diện UI thành phần tương ứng: đầu vào controller điều khiển thông qua HTTP request, model chứa miền logic, view thứ sinh trả cho trình duyệt  Model: Model chứa thể đặc tính logic ứng dụng Theo cách hiểu khác, Model đại diện cho liệu logic cốt lõi Nó lớp (class) chứa thông tin đối tượng mà ta cần phải thao tác, làm việc VD: “Giày Nam” chứa thông tin “Tên”, “Size”, “Giá”…  View: View làm nhiệm vụ thể Model hay nhiều Model cách trực quan Nói cách khác nhận thơng tin (1 Model hay nhiều Model) sau biểu diễn lên trang web Xây dựng website bán hàng ShopLoop  Controller: Controller nằm tầng View Model, làm nhiệm vụ tiềm kiếm, xử lý nhiều Model, sau gửi Model tới View để View hiển thị Sự khác biệt với WebForm 2.1.3 Tính Kiến trúc chương trình ASP.NET 2.0 Kiến trúc mơ hình WebForm -> Business -> Database ASP.NET MVC Kiến trúc sử dụng việc phân chia chương trình thành Controllers, Models, Views Các kiện điều khiển Controllers, controls không server quản lý Phần lớn dung LinQ to SQL class để tạo mơ hình truy cập đối tượng Sử dụng cú pháp Cú pháp chương trình webform, tất kiện control server quản lý Sử dụng hầu hết công nghệ Truy cập liệu truy cập liệu ứng dụng Debug chương trình phải thực Debug có sử dụng unit test tất bao gồm lớp truy cập Debug kiểm tra phương thức liệu, hiển thị, điều khiển controller controls Tốc độ phân tải chậm Phân tải nhanh khơng phải Tốc độ phân tải trang có q nhiều controls quản lý ViewState để quản lý ViewState lớn control trang Tương tác với Javacrip khó khăn Tương tác với Javacrip dễ dàng Tương tác với controls điều khiển đối tượng không server Javacrip server quản lý Cấu trúc URL có dạng Cấu trúc địa rành mạch theo URL address .aspx?& dạng Controllers/Action/Id Bảng 2.1 :Sự khác biệt ASP.NET MVC ASP.NET 2.0 Ưu điểm nhược điểm 2.1.4 Ưu điểm   Lợi ích việc dùng phương pháp MVC phân đoạn rõ ràng models, views, controllers bên ứng dụng Cấu trúc giúp cho việc kiểm tra lỗi ứng dụng dễ dàng  ASP.NET MVC thiết kế cách gọn nhẹ giảm thiểu phức tạp việc xây dựng ứng dụng web cách chia ứng dụng thành tầng (layer): Model, View Controller Sự chia nhỏ giúp lập trình viên dễ Xây dựng website bán hàng ShopLoop dàng kiểm soát thành phần phát triển, lợi ích lâu dài việc kiểm tra, bảo trì nâng cấp  Hệ thống định tuyến mạnh mẽ  Hỗ trợ kết hợp tốt người lập trình người thiết kế giao diện Nhược điểm   Tốn thời gian trung chuyển tầng  Đối với dự án nhỏ, áp dụng mơ hình MVC gây cồng kềnh, tốn thời gian trình xây dựng phát triển 2.2 Thương mại điện tử (TMĐT) 2.2.1 Khái niệm Thương mại điện tử hình thức quan trọng hoạt động thương mại xã hội thơng tin hóa kỷ XXI, bao gồm loạt hoạt động thương mại thực qua mạng, từ tìm nguồn nguyên liệu, thu mua, trưng bày sản phẩm, đặt hàng đến việc giao hàng, vận chuyển toán điện tử… Căn vào đối tượng giao dịch, người ta chia giao dịch thương mại điện tử thành nhóm: • Giao dịch bn bán hàng hóa vật chất dịch vụ thơng thường • Giao dịch trao đổi trực tuyến thông tin, hàng hóa, dịch vụ số hóa phần mềm, âm nhạc, chương trình video theo yêu cầu…  Đối với doanh nghiệp • Tiết kiệm chi phí • Tạo thuận lợi cho bên giao dịch • Góp phần thúc đẩy cạnh tranh doanh nghiệp  Đối với người tiêu dùng • Mở rộng khả lựa chọn hàng hóa, dịch vụ nhà cung cấp • Với thiết bị cá nhân điện thoại di động, máy tính cá nhân…việc mua sắm thực hiênj đâu, lúc Xây dựng website bán hàng ShopLoop  Đối với xã hội TMĐT tạo phong cách kinh doanh phù hợp với sống cơng • nghiệp, mở rộng trao đổi thương mại khu vực phát triển TMĐT công cụ giúp doanh nghiệp vừa nhỏ khắc phục khuyết điểm • để cạnh tranh với doanh nghiệp lớn TMĐT tạo động lực cải cách mạnh mẽ cho quan quản lý nhà • nước 2.2.2 Thách thức TMĐT loại hình hoạt động xã hội mới, gắn với hạ tầng cơng nghệ, cần  có khung pháp lý điều chỉnh thích hợp  Chưa thực tạo độ tin cậy với khách hàng  Điều kiện nối mạng số địa phương khó khăn, gây bất cập việc tham gia mua sắm trực tuyến  Việc toán qua mạng chưa phải dễ dàng, thuận lợi  Đòi hỏi doanh nghiệp phải thay đổi cấu, nhân sự, quy trình làm việc Bên cạnh tiềm ẩn phức tạp, rủi ro cần xử lý nhanh nhạy Khách hàng chưa thực có thói quen mua sắm trực tuyến thay cho mua  sắm trực tuyến cửa hàng 2.2.3 Các loại hình ứng dụng thương mại điện tử Dựa vào chủ thể tham gia giao dịch TMĐT, người ta phân thành loại hình ứng dụng TMĐT gồm:  Giao dịch doanh nghiệp với doanh nghiệp –B2B  Giao dịch doanh nghiệp với khách hàng – B2C  Giao dịch doanh nghiệp với quan nhà nước –B2G  Giao dịch trực tiếp cá nhân với – C2C  Giao dịch quan nhà nước với cá nhân – G2C Xây dựng website bán hàng ShopLoop 2.3 Website thương mại điện tử 2.3.1 Khái niệm Website thương mại điện tử web site động với tính mở rộng cao cấp cho phép giao dịch qua mạng như: giỏ hàng, đặt hàng, toán qua mạng, quản lý khách hàng, quản lý đơn đặt hàng 2.3.2 Tiêu chí đánh giá Các yếu tố kỹ thuật   Thời gian tải website modem thông thường  Cấu trúc website  Bố trí liên kết website  Cơng cụ tìm kiếm nội website  Thống kê Traffic Rank www.alexa.com Những nội dung cần công bố   Thông tin liên hệ giới thiệu chủ website  Các điều kiện điều khoản quy định cách thức kinh doanh trước tiến hành giao dịch  Thông tin giới thiệu, mô tả hàng hóa, dịch vụ  Thơng tin chi phí, giá cả, lệ phí Phương thức kinh doanh   Cho phép khách hàng xem xét, điều chỉnh đơn đặt hàng  Xác nhận đơn đặt hàng Xây dựng website bán hàng ShopLoop  Hệ thống toán an tồn, dễ sử dụng  Giao hàng hóa dịch vụ theo thời gian điều kiện thỏa thuận 2.3.3 2.4 Lợi ích Website TMĐT  Tăng doanh thu  Cắt giảm chi phí  Maketing tồn cầu với chi phí cực thấp  Dịch vụ tốt cho khách hàng  Lợi cạnh tranh Các công nghệ sử dụng 2.4.1 HTML5 Hình 2.1: HTML ~= HTML + CSS + JS HTML5 ngôn ngữ sửa đổi thứ HTML, phát triển nhóm Web Hypertext Application Technology Working Group (WHATWG) từ 10/2009, dự án Web Application 1.0, hoàn thiện năm 2002  Khái niệm Về bản, HTML phiên HTML / XHTML đặc biệt tập trung vào mong muốn nhu cầu nhà phát triển 10 Xây dựng website bán hàng ShopLoop 3.4.5 Giao diện “Đăng nhập” Hình 3.8 Giao diện đăng nhập  Chức năng: dành cho người dùng đăng nhập vào hệ thống  Công nghệ: HTML5, CSS3(Menu), JQUERY, RESPONSIVE, 27 Xây dựng website bán hàng ShopLoop 3.4.6 Giao diện “Giới thiệu” Hình 3.9: Giao diện giới thiệu  Chức năng: giới thiệu với người dùng thông tin shop  Công nghệ: HTML5, CSS3(Menu), JQUERY, RESPONSIVE, GOOGLE MAP API, 28 Xây dựng website bán hàng ShopLoop 3.4.7 Giao diện “Giỏ hàng” Hình 3.10 Giao diện giỏ hàng  Chức năng: giới thiệu với người dùng thông tin shop  Công nghệ: HTML5, CSS3(Menu), JQUERY, RESPONSIVE, AJAX, JAVASCRIPT 29 Xây dựng website bán hàng ShopLoop B Công nghệ chung giao diện ( Giao diện quản lý hệ thống – Admin)  HTML5  CSS3(Menu)  RESPONSIVE  BOOTSTRAP  JQUERY  JAVASCRIPT 3.4.8 Giao diện “Đăng nhập admin” Hình 3.11 Giao diện đăng nhập admin  Chức năng: Giao diện đăng nhập dành cho Administrator  Công nghệ: HTML5, CSS3(Menu), RESPONSIVE, BOOTSTRAP 30 Xây dựng website bán hàng ShopLoop 3.4.9 Giao diện “Trang chủ Admin” Hình 3.12 Giao diện trang chủ administrator  Chức năng: Giao diện quản lí chính, thống kê tình trạng website  Công nghệ: HTML5, CSS3(Menu), JQUERY, RESPONSIVE, BOOTSTRAP 3.4.10 Giao diện “Quản lý sản phẩm” Hình 3.13 Giao diện quản lý sản phẩm  Chức năng: Giao diện quản lý sản phẩm  Công nghệ: CSS3(Menu), JQUERY, RESPONSIVE, BOOTSTRAP 31 Xây dựng website bán hàng ShopLoop 3.4.11 Giao diện “Quản lý danh mục loại” Hình 3.14 Giao diện quản lý danh mục loại  Chức năng: Quản lý loại sản phẩm  Công nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP 3.4.12 Giao diện “Quản lý danh mục nhà sản xuất” Hình 3.15 Giao diện quản lý danh mục nhà sản xuất  Chức năng: Quản lý danh mục nhà sản xuất  Công nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP 3.4.13 Giao diện “Quản lý danh mục kích cỡ” 32 Xây dựng website bán hàng ShopLoop Hình 3.16 Giao diện quản lý danh mục kích cỡ  Chức : quản lý danh mục kích cỡ  Cơng nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP 33 Xây dựng website bán hàng ShopLoop 3.4.14   Giao diện “Quản lý đơn hàng” Hình 3.17 Giao diện quản lý đơn hàng Chức năng: quản lý đơn hàng Công nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP 3.4.15 Giao diện “Quản lý người dùng” Hình 3.19 Giao diện quản lý người dùng  Chức năng: quản lý người dùng  Công nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP 3.4.16 34 Giao diện “Quản lý Slide” Xây dựng website bán hàng ShopLoop   Hình 3.18 Giao diện quản lý ảnh Chức năng: quản lý ảnh Công nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP 35 Xây dựng website bán hàng ShopLoop 3.4.17 Giao diện “Quản lý thành viên” Hình 3.20 Giao diện quản lý thành viên  Chức năng: Quản lý thành viên  Công nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP 36 Xây dựng website bán hàng ShopLoop 3.4.18   Giao diện “Quản lý bình luận” Hình 3.21 Giao diện quản lý bình luận Chức năng: quản lý bình luận Cơng nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP 37 Xây dựng website bán hàng ShopLoop 3.4.19 Giao diện “Thêm mới” Hình 3.22 Giao diện thêm Chức năng: thêm sản phẩm Công nghệ: CSS3(Menu), JQUERY, JAVASCRIPT, RESPONSIVE, BOOTSTRAP   3.4.20 38 Xây dựng website bán hàng ShopLoop Chương : KẾT LUẬN 4.1 Kết thực 4.1.1 Những chức xây dựng hoàn thành Giao diện người dùng Giao diện quản trị hệ thống Xây dựng Website theo mơ hình MVC Trang chủ Sản phẩm theo danh mục Chi tiết sản phẩm Đăng ký tài khoản Đăng nhập Trang thơng tin người dùng Tìm kiếm sản phẩm Giỏ hàng Kết thúc mua hàng Xây dựng Website theo mô hình MVC Trang chủ Trang chủ Đăng nhập ( cho admin) Danh mục sản phẩm Đơn đặt hàng Nhà sản xuất Quản lý chi tiết đơn đặt hàng Quản lý hình ảnh sản phẩm Quản lý sản phẩm Thành viên Thông tin thành viên 39 Xây dựng website bán hàng ShopLoop 4.1.2 Những chức chưa xây dựng hoàn chỉnh Giao diện người dùng Sản phẩm bán chạy Đa ngôn ngữ Thanh toán điện tử Quảng cáo Người dùng đăng ký nhận tin Email 4.2 Đánh giá 4.2.1 Ưu điểm Nhóm nghiên cứu sử dụng tích hợp công nghệ để thiết kế tạo Website bán hàng online qua mạng với giao diện ưa dùng dễ sử dụng như: ASP.NET MVC CSS3 HTML5 JQuery JavaCript Webservice   4.3 Giao diện quản trị hệ thống Quảng cáo Người dùng đăng ký nhận tin Email Bootstrap Ajax Seo Optimized Facebook Tối ưu hóa giao diện 4.2.2 K huyết điểm Bảo mật chưa cao Phân quyền chưa đầy đủ Hướng phát triển  40 Tìm hiểu sâu ngơn ngữ ASP.NET MVC SQL Sever để đáp ứng nhiều nhu cầu người sử dụng, phát triển tối ưu hóa hệ thống Xây dựng website bán hàng ShopLoop Tìm hiểu thêm số ngơn ngữ, phần mềm ứng dụng để nâng cao giao diện đồ họa đẹp mắt, thân thiện hơn…  Xây dựng trang Web quy mô lớn với nhiều ứng dụng, chức năng…  Đăng nhập tài khoản Facebook, Google, Twitter…  Thanh toán sản phẩm qua Paypal  4.4 Tài liệu tham khảo  http://www.thayphet.net  http://www.tinhte.vn/threads/thi-infographic-lich-su-hinhthanh-va-phat-trien-cua-html5.1381894/ http://www.w3schools.com/ http://slides.html5rocks.com/ http://www.slideshare.net/tieu_it88/slide1-co-bn-html5 http://hocwebchuan.com/reference/tag/html5/     41 ... Kiểm tra xử lý đơn đặt hàng  Theo dõi phản hồi ý kiến khách hàng  Phân quyền cho nhân viên để quản lý trang web Xây dựng website bán hàng ShopLoop Xây dựng website bán hàng ShopLoop Chương : CƠ.. .Xây dựng website bán hàng ShopLoop DANH MỤC HÌNH VẼ Chương : MỞ ĐẦU 1.1 Giới thiệu đề tài ASP. NET MVC biết đến lựa chọn thông minh cho việc thiết kế Website, xây dựng với lớp chính,... – Controller) ASP. NET MVC framework cho phép xây dựng ứng dụng web chuẩn, có khả mở rộng, sử dụng mẫu thiết kế tốt sức mạnh ASP. NET NET Framwork Nguồn gốc ASP. NET MVC 2.1.1 ASP. NET MVC lần xuất