Xây dựng và phát triển website thương mại điện tử tại cửa hàng thời trang bích lụa,khoá luận tốt nghiệp

HỌC VIỆN NGÂN HÀNG KHOA HỆ THỐNG THÔNG TIN QUẢN LÝ KHÓA LUẬN TỐT NGHIỆP ĐẠI HỌC XÂY DỰNG VÀ PHÁT TRIỂN WEBSITE THƯƠNG MẠI ĐIỆN TỬ TẠI CỬA HÀNG THỜI TRANG BÍCH LỤA CAO THÀNH LUÂN HÀ NỘI, NĂM 2020 HỌC VIỆN NGÂN HÀNG KHOA HỆ THỐNG THÔNG TIN QUẢN LÝ KHĨA LUẬN TỐT NGHIỆP ĐẠI HỌC •••• XÂY DỰNG VÀ PHÁT TRIỂN WEBSITE THƯƠNG MẠI ĐIỆN TỬ TẠI CỬA HÀNG THỜI TRANG BÍCH LỤA Giáo viên hướng dẫn: Ths.Triệu Thu Hương Sinh viên thực hiện: Cao Thành Luân Mã sinh viên: 19A4040092 Lớp: K19HTTTB Khóa: 19 Hệ: Chính quy Hà Nội, tháng /2020 Khóa luận tốt nghiệp Xây dựng phát triển website thương mại điện tử cửa hàng thời trang Bích Lụa LỜI CẢM ƠN Em xin gửi lời cảm ơn chân thành tới cô Triệu Thu Hương - Giảng viên khoa Hệ thống thông tin quản lý, Học viện Ngân hàng Cô tạo điều kiện hỗ trợ cho em nhiều q trình thực hồn thành khóa luận Em xin chân thành cảm ơn Ban giám đốc thành viên công ty FSS giúp cho em có kinh nghiệm thực tiễn q trình em thực tập cơng ty, đặc biệt anh chị hướng dẫn thực tập người có tâm huyết cởi mở, giúp cho em tiếp thu nhiều luồng kiến thức mẻ để phục vụ cho việc làm khóa luận làm Lời cuối em xin dành lời cảm ơn trân trọng cho quý thầy cô khoa Hệ thống thông tin quản lý dạy cho em nhiều học quý giá suốt năm học qua Em xin chân thành cảm ơn Cao Thành Luân - Lớp K19HTTTB i Khóa luận tốt nghiệp hàng thời trang Bích Lụa Xây dựng phát triển website thương mại điện tử cửa LỜI CAM KẾT Em xin cam đoan kết đạt đề tài khóa luận sản phẩm dựa nỗ lực tìm hiểu nghiên cứu riêng cá nhân em Những nội dung trình bày khóa luận từ cá nhân em tham khảo từ nguồn tài liệu khác Các tài liệu có phụ lục nêu xuất xứ rõ ràng, trích dẫn đầy đủ hợp pháp SINH VIÊN THỰC HIỆN CAO THÀNH LUÂN Cao Thành Luân - Lớp K19HTTTB ii Khóa luận tốt nghiệp Xây dựng phát triên website thương mại điện tử cửa hàng thời trang Bích Lụa NHẬN XÉT (Của giáo viên hướng dẫn) Kết luận Hà Nội, ngày tháng năm 2020 Giáo viên hướng dẫn (Ký tên) Cao Thành Luân - Lớp K19HTTTB iii Khóa luận tốt nghiệp Xây dựng phát triển website thương mại điện tử cửa hàng thời trang Bích Lụa 1.1 Biểu đồ ca sử dụng .28 MỤC LỤC MỞ ĐẦU GIỚI THIỆU VỀ CÔNG TY THỰC TẬP Sự hình thành phát triển 2 Các hoạt động nghiệp vụ tình hình ứng dụng tin học đơn vị thực tập CHƯƠNG 1: TỔNG QUAN VỀ BÀI TỐN VÀ CƠNG NGHỆ SỬ DỤNG 1.1 Tổng quan toán .3 1.1.1 Lý chọn toán 1.1.2 Đề xuất giải pháp thực 1.2 Giới thiệu công nghệ sử dụng 1.2.1 Front-end 1.2.2 Back-end 1.3 Ứng dụng cơng nghệ vào tốn 1.4 Bài toán đề xuất sản phẩm 1.4.1 Hệ thống đề xuất 1.4.2 Hướng tiếp cận hệ thống đề xuất .7 1.5 Bài toán hệ hỗ trợ định nhập hàng 10 1.5.1 Tổng quan hệ hỗ trợ định .10 1.5.2 Bài toán hệ hỗ trợ định đề tài .11 CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ HỆ THỐNG 12 2.1 Phân tích xác định yêu cầu hệ thống 12 2.1.1 Xác định yêu cầu người dùng 12 2.1.2 Mô tả trình hoạt động .20 2.2 Biểu đồ hoạt động 26 2.2.1 Biểu đồ hoạt động quy trình bán hàng 26 2.2.2 Biểu đồ hoạt động quy trình nhập hàng 26 2.2.3 Biểu đồ hoạt động quy trình trả hàng .27 1.1.1 Biểu đồ casử dụng quy trình tiếp nhận đơnhàng 28 Cao Thành Luân - Lớp K19HTTTB 1.1.2 Biểu đồ casử dụng trình bán hàng 29 iv 1.1.3 Biểu đồ casử dụng trình nhập hàng .30 1.1.4 Biểu đồ casử dụng trình tạo phiếu muahàng 32 1.1.5 Biểu đồ casử dụng quy trình xử lý trả hàng 33 1.1.6 Biểu đồ hoạt động quy trình lập báo cáo trả hàng 35 1.2 Biểu đồ .36 1.3 Biểu đồ lớp 40 1.4 Thiết kế sở liệu 40 1.4.1 Xác định thực thể 40 1.4.2 Xác định quan hệ thực thể 40 1.4.3 Xác định thuộc tính thực thể .41 2.6.3 Xây dựng ERD 41 1.5 Thiết kế mơ hình đề xuất sản phẩm 42 1.5.1 Bài toán đề xuất .42 1.5.2 Biểu đồ ca sử dụng quy trình gợiý sản phẩm .42 1.5.3 Biểu đồ quy trình gợi ýsảnphẩm 43 CHƯƠNG 3: XÂY DỰNG, TRIỂN KHAI VÀ ĐÁNH GIÁ 46 3.1 Xây dựng CSDL 46 3.1.1 Xây dựng CSDL mức logic 46 3.1.2 Xây dựng CSDL mức vật lý 46 3.2 Xây dựng giao diện .49 3.2.1 Sitemap 49 3.2.2 Xây dựng trang bán hàng .50 3.2.3 Xây dựng trang quản trị 53 3.3 Xây dựng tính quan trọng cho website 60 Cao Thành Luân - Lớp K19HTTTB v Khóa luận tốt nghiệp Xây dựng phát triên website thương mại điện tử cửa hàng thời trang Bích Lụa 1.3.1 Tính lọc CÁC sản phẩm 60 DANH MỤC CHỮ VIẾT TẮT 1.3.2 Chức gợi ý sản phẩm 63 1.3.3 Chức hỗ trợ định nhập hàng 68 1.3.4 Xây dựng chức báo cáo thống kê 68 1.3.5 Một số chức khác 70 1.4 Triên khai hệ thống 73 1.5 Đánh giá hệ thống 77 KẾT LUẬN 79 TÀI LIỆU THAM KHẢO 80 STT CHỮ VIẾT TẮT Ý NGHĨA NCC Nhà cung cấp CSDL Cơ sở liệu HĐ Hoạt động NVBH Nhân viên bán hàng CS Nhân viên chăm sóc khách hàng CSKH Chăm sóc khách hàng BPLQ Bộ phận liên quan CBQL Cán quản lý KH Khách hàng 10 NVK Nhân viên kho 11 NVGV Nhân viên giao vận Cao Thành Luân - Lớp K19HTTTB vi Hình 57 Hệ hỗ trợ định nhập hàng Quy trình chi tiết trình đưa định - Đầu vào: thông số chi tiết mặt hàng - Đầu ra: danh sách mặt hàng hết hạn Các bước thực trình đưa định: - Bước 1: Mở CSDL - Bước 2: Lấy danh sách hàng từ bảng hảng - Bước 3: Kiêm tra số lượng hàng, 10 đưa lên đầu - Bước 4: Dùng Jquery đê check elements - Bước 5: Thay đổi màu sắc mặt hàng 10 sản phẩm hiên thị lên giao diện 1.3.3 - Xây dựng chức báo cáo thống kê Chức báo cáo: Sử dụng Google Charts với thông số lấy từ sở liệu MySQL Cao Thành Luân - Lớp K19HTTTB 68 Khóa luận tốt nghiệp - Xây dựng phát triên website thương mại điện tử cửa hàng thời trang Bích Lụa Bước 6: Khai báo biến dataLine dataPie liệu bảng cách sử Hình 58 Biểu đồ biểu diễn số lượng hóa đơn doanh thu theo thời gian Hình 59 Biểu đồ thống kê số lượng bán theo sản phẩm Quy trình chi tiết: - Đầu vào: Dữ liệu từ sở liệu - Đầu ra: Các biêu đồ Các bước thực hiện: - Bước 1: Mở CSDL - Bước 2: Lấy liệu ngày tháng, tổng số lượng, tổng số hóa đơn từ bảng đơn hàng chi tiết đơn hàng - Bước 2: Cho liệu từ kết câu lệnh thực thi vào mảng sau thực gán kiêu liệu cho phần tử mảng - Bước 3: Tạo hàng cột cho biêu đồ nhờ liệu mảng - Bước 4: Sử dụng json_encode đê chuyên liệu sang dạng json dụng hàm DataTable Google Charts - Bước 6: Tạo điều kiện cho biêu đồ chiều dài, chiều rộng, tên biêu đồ Cao Thành Luân - Lớp K19HTTTB 69 - Bước 7: Kết nối liệu json với div html - Bước 8: Sử dụng hàm draw đê vẽ biêu đồ - Chức thống kê: THÕNG KÊ KINH DOANH Tháng Tổng số hóa đơn Tổng SO lượng bán Tổng doanh thu 06-2020 7 2771000 05-2020 7 3160001 02-2020 1 300001 06-2019 2150000 Tổng 17 18 8381002 Hình 60 Biểu đồ thống kê doanh thu theo thời gian Đầu vào: liệu hóa đơn, số lượng, ngày tháng Đầu ra: Bảng doanh thu Các bước thực bao gồm - Bước 1: Xây dựng bảng với hàng ngày/tháng/năm, tổng số hóa đơn, tổng số lượng, tổng doanh thu - Bước 2: Mở CSDL - Bước 3: Sử dụng câu lệnh đê lấy thời gian, đếm số hóa đơn, lấy tổng tích số lượng đơn giá đê thu doanh thu - Bước 4: Thực thi lệnh mysqli_fetch_array() đê hiên thị dòng liệu - Bước 6: Hiên thị bảng doanh thu lên trình duyệt 1.3.4 - Một số chức khác Plugin bình luận Facebook: tính sử dụng JavaScript SDK Facebook Nó cho phép người dùng có thê bình luận, thích trả lời nội dung bình Cao Thành Luân - Lớp K19HTTTB 70 Khóa luận tốt nghiệp Xây dựng phát triên website thương mại điện tử cửa hàng thời trang Bích Lụa Hình 61 Plugin bình luận Facebook - Tự động xác nhận đơn hàng qua tin nhắn: Khi người bán xác nhận đơn hàng xác nhận, tin nhắn tự động gửi cho người mua thơng qua API bên thứ Hình 62 Tự động xác nhận đơn hàng qua tin nhắn - Tải lên nhiều ảnh đồng thời: Sử dụng câu lệnh move_uploaded_file() đê upload ảnh từ local lên server, sau đổi tên thêm ảnh vào sở liệu Từ người dùng có thê lấy liệu ảnh thông qua sở liệu Cao Thành Luân - Lớp K19HTTTB 71 Khóa luận tốt nghiệp Xây dựng phát triển website thương mại điện tử cửa hàng thời trang Bích Lụa Hình 63 Tải lên nhiều ảnh đồng thời - Messenger plugin cho website: Sử dụng Messenger plugin kết hợp với JavaScript SDK Facebook để triển khai Messenger trang web, giúp cho việc tương tác người mua người bán trở nên thuận tiện Công cụ giúp giải cơng việc cách nhanh chóng người dùng có nhu cầu đặt hàng hay có vấn đề cần khiếu nại, giải thắc mắc Cao Thành Luân - Lớp K19HTTTB 72 Khóa Khóa luận luận tốt tốt nghiệp nghiệp Xây Xây dựng dựng và phát phát triển triển website website thương thương mại mại điện điện tử tử tại cửa cửa hàng hàng thời thời trang trang Bích Bích Lụa Lụa Lab Data Opportunities - These suggestions can help your page load faster They don't directly affect the Performance score Opportunity First Contentful Paint Estimated Savings 0.6 S Speed Index 2.0 Time to Interactive 2.5 S Total Blocking Time 50 ms Hình 64 Messenger plugin cho website s ■ Largest Contentful Painte 1.6 Cumulative Layout Shifte 0.191 ■ s ■ 1.4 Triển khai hệ thống B ⅜ Sau hoàn thiện dự án local em tải website lên hosting để tiến f ^j V, hiệu trang ∙ hiệu ∙ ? M tính tốn hành thựcnnghiệm sử■dụngrcácJ ɪtrang∙ -đo để web ■ Remove unused JavaScript ■ Serve images in next-gen formats ■ Efficiently encode images ■ Remove unused CSS À Reduce initial server response time Cao Thành Luân - Lớp K19HTTTB , *Ĩ∙ 0.72 s v — 0.48 s v — 0.28 s v — 0.16s v - 0.04 s v 73 Performance Scores Page Details Requ PageSpeed Score YSIow Score C(79%)∙ w (75%)φ Fully Loaded Time Total Page Size ests 3.3s^ 1.83MB^ 4- Hình 65 Hiệu website theo Googple Pagespeed Insight Latest Performance Report for: https∣√bichluastore.OOOwebhostapρ.com/ Report generated: Sunj Jun 7, 2020 10:11 PM -0700 dξ⅛ I3 yg⅛∕ Whvshouki I use a CDN? ⅞ , Test Server Region: H Vancouver, Canada Using: Chrome (Desktop) 75.03770.100, PageSpeed 1.15-gt13, YSIow 3.1.8 be usins a cdn Khóa luận tốt nghiệp Xây dựng phát triển website thương mại điện tử cửa hàng thời trang Bích Lụa + Tốc độ load trang ban đầu cao + Tối ưu hóa CSS JavaScript giúp trang web load nhanh + Hạn chế hidden element, giảm thiểu thời gian tải trang + Hạn chế chuyển hướng sang trang khác + Sử dụng video thay cho file gif nặng, giúp tăng hiệu trang web tiết kiệm liệu mạng + Tránh kích thước DOM lớn + Thời gian chạy JavaScript ngắn + Sử dụng hỗ trợ bên thứ cách hiệu quả, sử dụng trang load đầy đủ Passed audits (17) ʌ • Eliminate render-blocking resources — Potential savings of 100 ms V • Properlysizeimages V I • Defer offscreen images V Minify CSS - Potential savings of KB Minify JavaScript - Potential savings V of 47 KB Enabletextcompression V Preconnect to required origins V Avoid multiple page redirects V Preload key requests V V Use video formats for animated content V Avoids enormous network payloads — Total size was 1,901 KB V Avoids an excessive DOM size elements User Timing marks and measures • — Minimizes main-thread work — 1.5 S • Minimizethird-Partyusage -Third-PartycodebIockedthemainthreadforTOms V V JavaScript execution time — 0.5 S • 277 V V Hình 66 Hiệu website theo Gmetrix V Từ thông số ta thấy điểm mạnh điểm yếu website triển khai: - Điểm mạnh: + Tránh request xấu có khả công vào website * Avoidsdocument-WriteO Cao Thành Luân - Lớp K19HTTTB v 74 Hình 67 Điểm mạnh website Khóa luận tốt nghiệp Xây dựng phát triên website thương mại điện tử cửa hàng thời trang Bích Lụa - Điêm yếu: + Tốc độ di chuyên trang mức trung bình + Có nhiều file CSS JS dư thừa, không sử dụng + Có nhiều file có nội dung nặng gây ảnh hưởng tới tốc độ tải trang + Nhiều layout có kích thước q lớn chưa tách làm component nhỏ làm tăng độ trễ trang + Các file tĩnh chưa lưu trữ hợp lý làm tăng cache website Diagnostics - More information about the performance of your application These numbers don't directly affect the Performance score A Ensuretextremainsvisiblecluringwebfontload V A Doesnotusepassivelistenerstoimprovescrollingperformance V A Serve static assets with an efficient cache policy - 27 resources found V • Avoid chaining critical requests - 18 chains found • Keep request counts low and transfer sizes small - 76 requests ∙ V 1,901 KB V • Largest Contentful Paint element - element found V • Avoid large layout shifts - elements found V Hình 68 Điểm yếu website Cao Thành Luân - Lớp K19HTTTB 75 Cao Thành Luân - Lớp K19HTTTB 76 Khóa luận tốt nghiệp Xây dựng phát triên website thương mại điện tử cửa hàng thời trang Bích Lụa RECOMMENDATION TVPE PRIORITY Leverage browser caching SERVER HIGH v Defer parsing of Java Script JS HIGH v MinifyJavaScript JS HIGH v Avoid bad requests CONTENT HIGH v Optimize images IMAGES HIGH v Specify image dimensions IMAGES MEDIUM v MinifyCSS CSS HIGH v Specify a character set early CONTENT MEDIUM v Avoid landing page redirects SERVER HIGH v Enable compression SERVER HIGH v Enable Keep-Alive SERVER HIGH CSS HIGH τ ▼ GRADE Inline small CSS v Inline small JavaScript JS HIGH τ Minimize redirects CONTENT HIGH CONTENT HIGH CSS HIGH CONTENT HIGH IMAGES HIGH SERVER HIGH IMAGES HIGH CSS MEDIUM JS MEDIUM CONTENT LOW ▼ Minimize request size τ PutCSSinthedocumenthead v Serve resources from a consistent URL v Serve scaled images v Specify a cache validator v Combine images using CSS sprites v Avoid CSS ©import v Prefer asynchronous resources v Avoid a character set in the meta tag Hình 69 Chấm điểm khuyến nghị cho website Từ điêm mạnh điêm yếu, em có thê xác định điêm mà website nên cần cải thiện - Giảm thiêu file JS CSS không sử dụng - Sử dụng đuôi ảnh JPEG 2000 hay WebP thay cho PNG JPG, giúp cải thiện tốc độ tải trang tải ảnh - Tối ưu hóa hình ảnh cải thiện thời gian tải trang giảm lượng liệu cần sử dụng - Cải thiện host 1.5 Đánh giá hệ thống Sau hoàn thành chức chạy thử môi trường, hệ thống mặt đáp ứng yêu cầu đặt ra: Cao Thành Luân - Lớp K19HTTTB 77 Khóa luận tốt nghiệp hàng thời trang Bích Lụa Xây dựng phát triển website thương mại điện tử cửa - Trang quản trị đáp ứng phân quyền chức năng, người dùng sử dụng cơng việc mình, tránh tình trạng chồng chéo cơng việc sai sót xử lý - Các chức bán hàng, toán, quản lý hàng hoạt động tốt, xử lý lỗi trình vận hành, cải thiện tốc độ làm việc, thông báo lỗi đến người dùng xảy vấn đề - Giao diện dễ sử dụng, giúp khách hàng người quản trị dễ dàng thao tác website Bên cạnh ưu điểm, hệ thống tồn số nhược điểm tồn tại: - Giao diện chưa gây hút với người dùng - Hệ thống build từ host domain miễn phí, băng thơng Cao Thành Luân - Lớp K19HTTTB 78 Khóa luận tốt nghiệp hàng thời trang Bích Lụa Xây dựng phát triển website thương mại điện tử cửa hàng thời trang Bích Lụa KẾTTHAM LUẬNKHẢO TÀI LIỆU Tiếng Ket Việtđạt đề tài phátVăn từ yêu cầuPhạm xây dựng hệ Trần thốngQuốc bán hàng quảntrình lý hàng thời trang [1]Xuất Nguyễn Vinh, Hồngmột Thái, Long,vàGiáo lập trình tảngcao, website, đề tài trình mộtgia cách nâng Nhà xuất bảnđãĐại họcbày Quốc Hà tổng Nội, quan 2019.về tình hình thực tế cửa hàng, qua đưa phương hướng giải vấn đề Sau trình phân Tiếng Anh tích,[2]thiết kế xây dựng website, tài thu sản phẩm hoànCSS thiện, Robin Nixon, Learning PHP,đềMySQL & JavaScriptWith jQuery, & đầy đủ chức ,cần thiết website bán hàng cần có, đồng thời bổ sung HTML5 2018 chức thông minh nhằm cải thiện trải nghiệm người dùng với website [3] Matt Zandstra, PHP Objects, Patterns, and Practice, Apress, 2015 Những điểm yếu tồn [4] Stig Sæther Bakken, Alexander Aulbach, Egon Schmid, Jim Winstead, Lars Bên cạnhWilson, điểm tíchLerdorf, cực hệ thốngZmievski, điểm yếu nhiều yếu Torben Rasmus Andrei Jouni Ahto, PHPdoManual, tố 2003 kiến thức hay thời gian: - Netflix, Tính xử lý trả hàng Netflix’s phầnRecommendations tính nhập hàng Works, chưa xây [5] How System dựng https://help.netflix.com/en/node/100639 - Hệ thống toán trực tuyến chưa tối ưu https://towardsdatascience.com/deep-dive-into-netflixs-recommender-system- 341806ae3b48 Giao diện đơn giản, liệu , 2020 - Một số tính chạy không ổn định host Do host miễn phí nên băng thông, phiên dung lượng kém, dễ gây lỗi khơng đáng có Hướng phát triển đề tài - Xây dựng xong hoàn toàn hệ thống nhập hàng, xử lý trả hàng tốn trực tuyến - Thêm chức thơng minh cho trang web chatbot tự động bán hàng trả lời khách hàng - Hỗ trợ thêm giao diện cho thêm nhiều thiết bị - Tối ưu tốc độ trang web Cao Thành Luân - Lớp K19HTTTB 79 80 ... K19HTTTB x Khóa luận tốt nghiệp Xây dựng phát triển website thương mại điện tử cửa hàng hàng thời thời trang trang Bích Bích Lụa Lụa GIỚI THIỆU VỀ CƠNG TY THỰC TẬP MỞ ĐẦU Vào thời điểm tại, mà công... Thành Ln - Lớp K19HTTTB Khóa luận tốt nghiệp hàng thời trang Bích Lụa - Xây dựng phát triển website thương mại điện tử cửa Độ thưa: số sản phẩm bán trang thương mại điện tử lớn Ngay người dùng tích... hàng Cao Thành Luân - Lớp K19HTTTB 31 Cao Thành Luân - Lớp K19HTTTB 32 Khóa luận tốt nghiệp hàng thời trang Bích Lụa Xây Xây dựng dựng và phát phát triển triển website website thương thương mại