CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 1. Giới thiệu về ASP.NET Core ASP.NET Core là một framework đa nền tảng, hiệu suất cao và mã nguồn mở để xây dựng các ứng dụng hiện đại, có khả năng kết nối đám mây, kết nối internet.NET Core, chúng ta có thể xây dựng các ứng dụng và dịch vụ web, ứng dụng internet vạn vật và phía máy chủ cho ứng dụng di động. [1] Hàng triệu lập trình viên đang hoặc đã sử dụng ASP.x để tạo ứng dụng web.NET Core là bản thiết kế lại của ASP.x, bao gồm những thay đổi về kiến trúc dẫn đến một khung mô-đun gọn gàng hơn. Các tính năng Các tính năng chính của ASP.NET Core: - Quá trình biên dịch diễn ra liên tục, lập trình viên không cần phải gọi lệnh biên dịch lại.
- Các module được phân phối dưới dạng các Nuget packages. - Xây dựng và chạy các ứng dụng ASP.NET Core đa nền tảng trên các hệ điều hành: Windows, Mac, Linux - Mã nguồn mở. - Các hỗ trợ cho dependency injection được xây dựng sẵn. Xây dựng web api với ASP.NET Core API là viết tắt của Application Programming Interface.
Nó là một tác nhân phần mềm trung gian cho phép hai hoặc nhiều ứng dụng tương tác với nhau.NET Core hỗ trợ tạo các dịch vụ RESTful, còn được gọi là API web. Để xử lý các request, web API sử dụng các controllers. Controller trong API web là các lớp bắt nguồn từ ControllerBase. Ưu điểm 16 Các ưu điểm nổi bật của ASP.NET Core: - ASP.NET Core là một web framework nhẹ và nhanh.
- Tích hợp dễ dàng với các framework ở phía client như react, angular - Là một framework mã nguồn mở và tập trung vào cộng đồng. Giới thiệu về React JS React JS là một thư viện JavaScript mã nguồn mở và miễn phí để xây dựng giao diện người dùng nhanh và có tính tương tác dựa trên các components. Nó được duy trì bởi Meta (trước đây là Facebook) và cộng đồng các lập trình viên. React hiện tại là thư viện Javascript phổ biến nhất dùng để xây dựng giao diện người dùng.
React có thể được sử dụng để phát triển các ứng dụng trang đơn (single page application) hoặc di động. Tuy nhiên, React chỉ quan tâm đến việc quản lý trạng thái (state) và hiển thị trạng thái đó lên DOM, vì vậy việc tạo ứng dụng React thường yêu cầu sử dụng các thư viện bổ sung. Các tính năng Component: Mã nguồn React được tạo thành từ nhiều thành phần được gọi là component, component được hiển thị cho một phần tử cụ thể ở trên DOM bằng cách sử dụng thư viện React DOM. Có 2 cách để khởi tạo một component trong react: Thông qua class-component hoặc functional-component.
DOM ảo: React tạo ra một bộ dữ liệu có cấu trúc trong bộ nhớ, tính toán sự khác biệt giữa các DOM ảo và sau đó cập nhật một phần DOM thật dựa trên sự khác biệt đó. Nó như thể cho phép biểu diễn lại cả trang mỗi khi có thay đổi dữ liệu nhưng thực tế React chỉ cập nhật lại các component có sự thay đổi. Điều này làm cho ứng dụng React có hiệu suất cao Lifecycle methods: Cho phép thực thi các lệnh tại các thời điểm nhất định trong vòng đời của một component. ComponentDidMount được gọi khi component đã "gắn kết" (component đã được chèn vào DOM).
ComponentDidUpdate được gọi khi dữ liệu 17 của một component thay đổi. ComponentWillUnmount được gọi khi component bị xóa khỏi DOM. JSX: JavaScript XML, là một phần mở rộng cho cú pháp ngôn ngữ JavaScript. Có bề ngoài tương tự như HTML.
Các component thường được viết bằng JSX, mặc dù chúng không nhất thiết phải như vậy (các component cũng có thể được viết bằng JavaScript thuần). Hooks: Hooks là một tính năng mới ra đời trong bản cập nhật React 16. Hooks giúp xây dựng functional-component với tất cả những tính năng của class-component như sử dụng state, lifecycle methods. Hooks không thể sử dụng trong class-component.
Cách hoạt động Mọi ứng dụng React đều chứa ít nhất một component, được gọi là component gốc, đại diện cho toàn bộ ứng dụng và chứa các component con. Mỗi component thường chứa một số state - là dữ liệu của component và hàm render để sinh ra giao diện của component. Đầu ra của hàm render là một React element – một đối tượng javascript thuần – tương ứng với một DOM element, nó giống như một đại diện của DOM được lưu trong bộ nhớ. React lưu giữ những đại diện như vậy trong bộ nhớ, gọi là DOM ảo.
Mỗi khi có sự thay đổi ở dữ liệu trong một component (thay đổi state, props), một React element mới được tạo ra, React sẽ so sánh sự thay đổi của element mới này so với phiên bản cũ của nó, phát hiện được những gì thay đổi, tiếp đó cập nhật một phần của DOM thật dựa trên sự thay đổi đó để đồng bộ với DOM ảo. Ưu điểm Các ưu điểm chính của React JS: - Dễ bảo trì và quản lý: Việc phân chia ra thành các component giúp cho code react trở nên gọn gàng, có cấu trúc nên dễ dàng quản lý. - Hiệu suất cao: Việc sử dụng DOM ảo giúp react tiết kiệm được tài nguyên và đạt hiệu suất cao. - Dễ kiểm thử: React có tiện ích trên chrome dev tool giúp việc debug ứng dụng trở nên dễ dàng hơn.
18 - React chỉ là một thư viện, nên khi thiết kế giao diện, ta có thể tự do sử dụng các thư viện hỗ trợ gọi http service, routing khác tự do theo ý thích mà không bị bó buộc. ENTITY FRAMEWORK CORE 3. Giới thiệu Entity Framework Core Entity framework core là một phiên bản nhẹ, có tính mở rộng, có mã nguồn mở và hỗ trợ đa nền tảng, kế thừa từ công nghệ Entity framework khá phổ biến. Entity framework core là một trình ánh xạ đối tượng quan hệ, cho phép truy xuất tới cơ sở dữ liệu thông qua các đối tượng trong .NET, nó cũng cung cấp hầu như tất cả các câu truy vấn dữ liệu thường được viết.
Các tính năng Entity framework core cung cấp các tính năng chính sau: - Ánh xạ các lớp .NET sang các bảng dữ liệu dưới cơ sở dữ liệu thông qua cách tiếp cận code-first. - Hỗ trợ các câu truy vấn, sửa đổi dữ liệu dưới cơ sở dữ liệu theo dạng các hàm mở rộng. - Theo dõi dự thay đổi cấu trúc của cơ sở dữ liệu. - Hỗ trợ đa nền tảng.
Ưu điểm Entity framework core sở hữu những ưu điểm nổi bật sau: - Giúp tiết kiệm thời gian và nguồn lực phát triển ứng dụng. - Làm cho việc kết nối với cơ sở dữ liệu và viết câu truy vấn dễ dàng hơn. - Hiệu suất cao. Giới thiệu Redux 19 Redux là một thư viện quản lý trạng thái phục vụ cho ứng dụng javascript.
Chúng ta có thể sử dụng redux với các thư viện, framework giao diện như react, angular, vue hoặc javascript thuần. Redux có kích thước nhỏ gọn (chỉ khoảng 2Kb) nhưng chứa một hệ sinh thái bổ trợ rất lớn. Các nguyên tắc Redux có 3 nguyên tắc chính, bao gồm: - Nguồn duy nhất: Các trạng thái của ứng dụng sẽ được lưu trữ trong một đối tượng duy nhất, điều này giúp cho trạng thái ở các phần khác nhau của ứng dụng sẽ được đồng bộ với nhau, giúp ứng dụng dễ dàng được kiểm thử. - Trạng thái chỉ được đọc: Các trạng thái sẽ không thể bị chính sửa trực tiếp, cách duy nhất để thay đổi trạng thái là gửi đi một hành động cụ thể, vì vậy mà các thay đổi của trạng thái sẽ được diễn ra theo một trình tự nghiêm ngặt, vì vậy mà các thay đổi đó có thể được ghi nhận, lưu trữ và phát lại.
- Những thay đổi về trạng thái được thực hiện bởi những hàm thuần tùy: Các reducer là những hàm thuần túy chỉ nhận vào trạng thái cũ và hành động và trả ra trạng thái mới. Bởi vì các reducer chỉ là hàm nên ta dễ dàng kiểm soát thứ tự được gọi của chúng. Ưu điểm Redux sở hữu những ưu điểm: - Các trạng thái giữa các thành phần được chuyển đổi ổn định và dễ dàng. - Tích hợp dễ dàng với React do có cùng cấu trúc Flux.
- Dễ dàng bảo trì: Cách tổ chức cấu trúc mã của redux khiến cho ứng dụng viết bằng redux dễ bảo trì - Dễ kiểm thử: Ứng dụng viết bằng redux được hỗ trợ công cụ Redux dev tool rất mạnh mẽ, có thể xem các hành động được thực hiện, trình chiếu lại các hành động đó tại một thời điểm bất kỳ. 20 CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 1. KHẢO SÁT HIỆN TRẠNG Qua tìm hiểu về nhu cầu sử dụng các trang web thương mại điện tử để mua sắm, nhóm đã lựa chọn ra 5 trang web thương mại điện tử mà theo nhóm là phổ biến nhất ở Việt Nam để khảo sát bao gồm các trang web: shopee.vn Hình 1: Trang Chủ Shopee [6] Thành lập vào năm 2015, tuy ra đời muộn nhưng Shopee lại nhanh chóng giành được ưu thế và tầm ảnh hưởng, vươn lên trở thành Sàn thương mại điện tử HOT nhất chỉ sau 3 năm hoạt động. Theo công bố của Shopee, số lượng shop đã đạt 800.000 shop và hơn 158,8 triệu đơn đặt hàng trong quý 3/2018.
Ưu điểm: - Số lượng khách hàng tiềm năng lớn, chủ yếu ở lứa tuổi trẻ, dễ dàng thích hợp với xu hướng mới. - Mở gian hàng cực nhanh bằng số điện thoại và email. Miễn phí mở gian hàng và phí hoa hồng kinh doanh hiện tại là 2.2% với shop thông thường. - Nhiều chính sách khuyến mãi, ưu đãi dành cho chủ shop và khách mua hàng.
21 Nhược điểm: - Khó bán hàng vì mức độ cạnh tranh cao hơn các sàn TMĐT khác. - Tình trạng hàng kém chất lượng vẫn tràn lan, hạ thấp uy tín của shop bán hàng chính hãng.vn Hình 2: Trang chủ tiki [7] Thành lập 2010, từ một website bán sách, Tiki đã phát triển trở thành một trong những website thương mại điện tử đa ngành được yêu thích tại Việt Nam. Ưu điểm: - Niềm tin mua sắm của khách hàng đặt ở sàn rất cao. Do chính sách kiểm duyệt nhà bán hàng khắt khe, hàng hóa Tiki chất lượng đảm bảo hơn.
Cam kết 100% hàng chính hãng nên không lo bị “xếp chung” với các shop bán hàng kém chất lượng giá rẻ khác. - Tỉ lệ hàng hoàn, hàng đổi trả rất thấp (theo báo cáo của Tiki là 1%). Nhược điểm: - Yêu cầu khắt khe khi mở shop: Phải có giấy tờ chứng minh là doanh nghiệp được nhà nước cấp phép hoạt động. 22 - Ngành hàng còn ít và chưa có sự đa dạng như Shopee, Lazada.
- Tốn phí cố định và phí hoa hồng khi kinh doanh online.