CHƯƠNG 1: GIỚI THIỆU ĐỀ TÀI 1. Hiện tại, Online là một thị trường lớn và đầy tiềm năng đối với kinh doanh bán lẻ. Trong khi đó, người tiêu dùng đang có xu hướng “online hóa” việc mua sắm để tiết kiệm thời gian, công sức, do đó, các doanh nghiệp bán lẻ cũng đang dần tiến sâu vào thị trường kinh doanh trực tuyến này với mong muốn tăng hiệu suất và doanh thu bán hàng. Được biết, khi bán hàng theo phương pháp truyền thống rất bất cập trong vấn đề quảng cáo sản phẩm cũng như thống kê doanh thu.
Việc thống kê báo cáo doanh thu hoàn toàn dựa trên phần mềm excel, việc này đẫn đến một số vấn đề khá khó khăn như thời gian xuất một báo cáo rất lâu, tốn nhiều thời gian và nhân lực, nhập liệu nếu có nhầm lẫn sẽ không được cảnh báo và xử lý, chẳng hạn như nếu xuất một sản phẩm mà trong kho số lượng tồn của sản phẩm đó không đủ để xuất hay sản phẩm đã hết hàng nhưng khách hàng không được thông báo về tình trạng này, nhân viên cũng không được nhắc để nhập thêm loại hàng ấy. Ngoài ra, khách hàng không chủ động được trong việc đặt trước và mua hàng của shop, mọi việc bán và mua phải diễn ra đồng thời giữa cả bên mua và bên bán. Do đó, vấn đề xây dựng một shop bán hàng online rất cần thiết. Việc này giúp shop bán hàng quản lý hàng hóa tốt hơn, thống kê báo cáo doanh thu nhanh chóng, chính xác, giảm nhân lực, giảm chi phí và thời gian.
Việc quảng cáo sản phẩm và thương hiệu cũng dễ dàng hơn. Về mặt khách hàng, một shop online sẽ giúp họ tiết kiệm thời gian mua sắm cũng như giúp “đặt chỗ” trước những sản phẩm mà họ yêu thích, không sợ bị mua trước hay hết hàng khi họ không đến shop, chủ động trong việc xem và đặt hàng. Vì các vấn đề đã nêu, em chọn đề tài “Xây dựng website bán hàng máy tính và linh kiện máy tính” nhằm giúp cửa hàng thời trang cải thiện được vấn đề quản lý, quảng cáo hàng hóa của mình. Đồng thời phù hợp với xu hướng phát triển của thế giới hiện nay.
Chương trình này xây dựng trên nền tảng ngôn ngữ Javascript. Với kiến thức còn hạn chế, chắc chắn không thể tránh khỏi những sai sót. Vì vậy, em rất mong nhận được mọi sự góp ý của quý thầy cô để em có thể hoàn thiện đề tài tốt hơn 1 1.2 Tìm hiểu “Xây dựng website bán hàng máy tính và linh kiện máy tính”. Tìm hiểu về : • Tìm hiểu nghiệp vụ liên quan đến website bán hàng (Giỏ hàng, đặt hàng, review.) • Tìm hiểu mô hình Restfull API.
• Front end: Html, css, ReactJs, Redux • Backend : Nodejs, ExpressJs • Tìm hiểu thanh toán online với Paypal Sandbox, VNPAY • Tìm hiểu xác thực OTP với firebase • Tìm hiểu xác thực API với JWT (Json web token) • Tìm hiểu nhắn tin trực tuyến (Socket io) • Tìm hiểu đăng nhập google facebook (auth firebase) • Tìm hiểu gửi mail và soạn thảo văn bản (markdown) 1. Chức năng chung: - Đăng ký, đăng nhập, đăng xuất, quên mật khẩu, xem và thay đổi thông tin cá nhân, tìm kiếm, nhắn tin. Chức năng quyền Admin - Quản lý user, danh mục, sản phẩm, đặt hàng, nhãn hàng, băng rôn, chủ đề, bài đăng, loại ship, khuyễn mãi, đơn hàng, nhà cung cấp, nhập hàng, tin nhắn, thống kê. Chức năng user - Xem chi tiết sản phẩm,Thêm/Bớt sản phẩm trong giỏ hàng - Đặt hàng, Thanh toán online, Xem chi tiết đơn hàng, bài đăng tin tức, lịch sử mua hàng, Bình luận, đánh giá sản phẩm.
Chức năng shipper - Xem chi tiết các đơn hàng, xác nhận và chuyển trạng thái đơn hàng 5. Chức năng saler - Quản lý đơn hàng, nhà cung cấp, nhập hàng, tin nhắn 1.3 Công cụ sử dụng. - Visual studio code.4 Mục tiêu đề tài. Đảm bảo việc mua bán giữa cửa hàng và khách hàng diễn ra nhanh chóng, chính xác: - Giúp nhân viên quản lý tình hình hoạt động của cửa hàng, quản lý các danh mục, xem báo cáo, thống kê.
- Đảm bảo khách hàng có thông tin chính xác về sản phẩm, đặt mua và thanh toán diễn ra đơn giản. 3 CHƯƠNG 2: CƠ SỞ LÝ THUYẾT ĐỀ TÀI 2.1 Xây dựng hệ thống.1 Giới thiệu Visual Studio Code.2 Tổng quan về Visual Studio Code. - Là một trình biên tập lập trình code miễn phí dành cho Windows, Linux và macOS, Visual Studio Code được phát triển bởi Microsoft. Nó được xem là một sự kết hợp hoàn hảo giữa IDE và Code Editor.
Hỗ trợ lập trình trên nhiều ngôn ngữ khác nhau C/C++, F#, C#,… - Visual Studio Code hỗ trợ chức năng debug, đi kèm với Git, có syntax highlighting, tự hoàn thành mã thông minh, snippets, và cải tiến mã nguồn. Nhờ tính năng tùy chỉnh, Visual Studio Code cũng cho phép người dùng thay đổi theme, phím tắt, và các tùy chọn khá - Visual Studio Code hỗ trợ nhiều ứng dụng web. Ngoài ra, nó cũng có một trình soạn thảo và thiết kế website.2 Giới thiệu về Xampp. - Phần mềm Xampp là một trong những phần mềm được nhiều lập trình viên sử dụng để thiết lập website theo ngôn ngữ PHP.
XAMPP có công dụng thiết lập web server có cài đặt sẵn các công cụ như PHP, Apache, MySQL… Xampp sở hữu thiết kế giao diện thân thiện với người dùng, cho phép các lập trình viên có thể đóng mở hoặc reboot các tính năng của server mọi lúc. Ngoài ra, Xampp cũng được xây dựng theo source code mở. - Đánh giá một cách tổng thể, Xampp được đánh giá là một trong những phần mềm trọng yếu trong việc xây dựng website dành cho các lập trình viên PHP. Xampp cài đặt các thành tố trọng yếu, hỗ trợ lẫn nhau bao gồm: ▪ Apache ▪ PHP (thiết lập nền tảng để các tập tin script *.php hoạt động); ▪ MySql (hệ quản trị dữ liệu) ▪ Perl 4 2.3 Giới thiệu về ExpressJs Framework (Back End API).1 Tổng quan về ExpressJs.
- Expressjs là một framework được xây dựng trên nền tảng của Nodejs. Nó cung cấp các tính năng mạnh mẽ để phát triển web hoặc mobile. Expressjs hỗ trợ các method HTTP và midleware tạo ra API vô cùng mạnh mẽ và dễ sử dụng. - Cấu trúc của Express Js Hình 2.
1 Cấu trúc expressjs Root: - app.js chứa các thông tin về cấu hình, khai báo, các định nghĩa,. để ứng dụng của chúng ta chạy ok.json chứa các package cho ứng dụng chạy. Nếu bạn nào làm với PHP hoặc RoR rồi thì file này có chức năng tương tự như composer.json hoặc Gemfile - Folder routes: chứa các route có trong ứng dụng - Folder view: chứa view/template cho ứng dụng - Folder public chứa các file css, js, images,.cho ứng dụng 2.2 Lợi ích khi dùng ExpressJs. ▪ Rất dễ học, chỉ cần bạn biết JavaScript, bạn sẽ không cần phải học một ngôn ngữ mới để học ExpressJS ▪ Giúp cho việc phát triển back-end dễ dàng hơn nhiều khi sử dụng ExpressJS ▪ Mã JavaScript được diễn giải thông qua Google V8 JavaScript Engine của Node.
Do đó, mã sẽ được thực hiện một cách nhanh chóng và dễ dàng. ▪ ExpressJS rất đơn giản để tùy chỉnh và sử dụng theo nhu cầu. ▪ Cung cấp một module phần mềm trung gian linh hoạt và rất hữu ích để thực hiện các tác vụ bổ sung theo phản hồi và yêu cầu. 5 ▪ Hỗ trợ phát triển ứng dụng theo mô hình MVC, đây là mô hình phổ biến cho việc lập trình web hiện nay.4 Giới thiệu về ReactJs Framework (Front End).1 Tổng quan về ReactJs Framework - React Js là một thư viện viết bằng javascript, dùng để xây dựng giao diện người dùng (UI).
React được sử dụng rộng rãi và có hệ sinh thái đa dạng phong phú. UI tất nhiên là quan trọng, nhưng không phải là tất cả. Để phát triển ứng dụng hoàn chỉnh, một mình React Js là không làm được tất cả, bạn sẽ cần thêm: ▪ Server side language: để xử lý logic và lưu trữ dữ liệu trên server. ▪ HTML/CSS nếu bạn làm ứng dụng web.
▪ Flux/Redux?: là một kiến trúc giúp bạn tổ chức code rõ ràng và sạch sẽ. ▪ Objective C: nếu bạn sử dụng React để xây dựng app cho iOS 2.2 Lợi ích khi sử dụng ReactJs Framework - Làm gì cũng phải có nguyên nhân, người dùng sử dụng Reactjs ngày càng nhiều thì Reactjs phải mang lại những lợi ích tốt. • ReactJS giúp cho việc viết các đoạn code Javascript sẽ trở nên dễ dàng hơn vì nó sử dụng một cú pháp đặc biệt đó chính là cú pháp JSX. Thông qua JSX cho phép nhúng code HTML và Javascript.
• ReactJS cho phép Developer phá vỡ những cấu tạo UI phức tạp thành những component độc lập. Dev sẽ không phải lo lắng về tổng thể ứng dụng web, giờ đây Developer dễ dàng chia nhỏ các cấu trúc UI/UX phức tạp thành từng component đơn giản hơn. • Đi kèm với ReactJS là rất nhiều các công cụ phát triển giúp cho việc debug code một cách dễ dàng hơn. • Một trong những ưu điểm nữa của ReactJS đó là sự thân thiện với SEO.
Hầu như các JS Frameworks không thân thiện với các tìm kiếm mặc dù đã được cải thiện nhiều nhưng dưới sự hỗ trợ của các render dữ liệu trả về dưới dạng web page giúp cho SEO chuẩn hơn.5 Tổng quan về cơ sở dữ liệu My SQL. - MySQL là hệ quản trị cơ sở dữ liệu tự do nguồn mở phổ biến nhất thế giới và được các nhà phát triển rất ưa chuộng trong quá trình phát triển ứng dụng. 6 - Vì MySQL là hệ quản trị cơ sở dữ liệu tốc độ cao, ổn định và dễ sử dụng, có tính khả chuyển, hoạt động trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh. - Với tốc độ và tính bảo mật cao, MySQL rất thích hợp cho các ứng dụng có truy cập CSDL trên internet.
Người dùng có thể tải về MySQL miễn phí từ trang chủ. MySQL có nhiều phiên bản cho các hệ điều hành khác nhau: phiên bản Win32 cho các hệ điều hành dòng Windows, Linux, Mac OS X, Unix, FreeBSD, NetBSD, Novell NetWare, SGI Irix, Solaris, SunOS,. - MySQL là một trong những ví dụ rất cơ bản về Hệ Quản trị Cơ sở dữ liệu quan hệ sử dụng Ngôn ngữ truy vấn có cấu trúc (SQL). - MySQL được sử dụng cho việc bổ trợ NodeJs, PHP, Perl, và nhiều ngôn ngữ khác, làm nơi lưu trữ những thông tin trên các trang web viết bằng NodeJs, PHP hay Perl,.6 Tổng quan về RESTful API.
REST là viết tắt của Representational State Transfer. RESTful API là một tiêu chuẩn dùng trong việc thiết kế các API cho các ứng dụng web để quản lý các resource.