Tổng quan về kiến trúc mô hình
Khái niệm
Mô hình MVC (Model – View – Controller) là một trong những mô hình kiến trúc ứng dụng phổ biến nhất. Ban đầu mô hình này được áp dụng chủ yếu ở các ứng dụng desktop, nhưng sau này ý tưởng về mô hình MVC được ứng dụng cho các nền tảng khác như Web.
Hình 2.1.1-1 Mô hình MVC
Cấu trúc mô hình MVC Tầng xử lý – Controller
Xử lí logic của ứng dụng, là cầu nối giữa tầng View và Model. Hay nói một cách cụ thể, Controller sẽ nhận yêu cầu được gửi từ View và thực hiện xử lí yêu cầu, truy vấn hoặc thao tác dữ liệu lên tầng Model. Sau khi xử lý xong, kết quả sẽ được trả về lại cho tầng View.
6 Tầng logic dữ liệu – Model
Tầng Model là trung gian giữa ứng dụng và hệ quản trị cơ sở dữ liệu để cung cấp và quản lí mô hình và các thao tác lên dữ liệu. Thông thường, tầng Model sẽ kết nối với một hoặc nhiều cơ sở dữ liệu để thực hiện các thao tác lên dữ liệu.
Tầng giao diện – View
Thể hiện giao diện người dùng, là thành phần giao tiếp giữa người dùng (user) và ứng dụng (application).
Mô hình MVC trong ứng dụng Web
Với sự phát triển của các công nghệ xây dựng web ở cả Frontend và Backend, các nhà phát triển có thể xây dựng và phát triển ứng dụng web một cách độc lập nhưng vẫn đảm bảo được tính kiến trúc của ứng dụng.
− Tầng giao diện người dùng (View) sẽ được phát triển độc lập ở phía client sử dụng các công nghệ Frontend như VueJS, ReactJS, … Nói cách khác, client sẽ được chạy trên 1 server độc lập và có thể tương tác với phía server của backend.
Hình 2.1.3-1 Mô hình MVC trong lập trình Web
7
− Tầng xử lí (Controller) và logic dữ liệu (Model) sẽ được phát triển độc lập ở phía server sử dụng các công nghệ Backend như ExpressJS, DotNetCore, Flank, …
− Sau khi hoàn thành việc phát triển, client sẽ cung cấp 1 bản build hoàn chỉnh để thêm vào phía Server. Người dùng sẽ yêu cầu thành phần giao diện thông qua request gửi đến Server.
MERN Stack Giới thiệu
Hình 2.2.1-1 Thành phần của MERN Stack
MERN Stack bao gồm MongoDB, Express, React và Node.js. Kết hợp các công nghệ này, người ta có thể xây dựng một ứng dụng web đầy đủ với các hoạt động CRUD. Mọi người chắc hẳn đã nghe nói về MERN Stack, về cơ bản là một JavaScript Stack để triển khai phát triển web full-stack và chứa 4 công nghệ, đó là: MongoDB, Express, React và Node.js.
8 Tổng quan về Nodejs [1]
Giới thiệu
Hình 2.3.1-1 Kiến trúc của NodeJS
NodeJS là một mã nguồn được xây dựng dựa trên nền tảng Javascript V8 Engine.
Nó được xây dựng để chạy trên server.
Javascript là một ngôn ngữ hướng sự kiện, do đó bất cứ điều gì xảy ra trên server đều tạo ra một sự kiện non-blocking, do vậy nên 1 website sử dụng NodeJS có thể đáp ứng được việc truy cập cùng lúc một lượng user cực kì lớn.
Vậy NodeJS thích hợp để làm gì. Với các đặc trưng của mình thì NodeJS thích hợp để xây dựng các ứng dụng thời gian thực, ví dụ như hệ thống chat online hoặc hệ thông thông báo…
Và cũng như nhiều ngôn ngữ chạy phía server khác, NodeJS cũng bắt đầu có một cộng đồng phát triển rất lớn, nhiều framework sử dụng core NodeJS ra đời, một trong số các framework phổ biến nhất hiện nay là Express. Chúng ta sẽ cùng tìm hiểu về framework này phía dưới đây.
Những ứng dụng nên viết bằng Nodejs
Rõ ràng, không phải cứ hot và mới là Nodejs làm gì cũng tốt, ví dụ như một ứng dụng cần tính ổn định cao, logic phức tạp thì các ngôn ngữ PHP hay Ruby… vẫn là sự lựa chọn tốt hơn. Còn dưới đây là những ứng dụng có thể và nên viết bằng Nodejs:
9
• Websocket server: Các máy chủ web socket như là Online Chat, Game Server…
• Fast File Upload Client: là các chương trình upload file tốc độ cao.
• Ad Server: Các máy chủ quảng cáo.
• Cloud Services: Các dịch vụ đám mây.
• RESTful API: đây là những ứng dụng mà được sử dụng cho các ứng dụng khác thông qua API.
• Any Real-time Data Application: bất kỳ một ứng dụng nào có yêu cầu về tốc độ thời gian thực.
• Micro Services: Ý tưởng của micro services là chia nhỏ một ứng dụng lớn thành các dịch vụ nhỏ và kết nối chúng lại với nhau. Nodejs có thể làm tốt điều này.
Lý do sử dụng
• Các ứng dụng Nodejs được viết bằng javascript, ngôn ngữ này là một ngôn ngữ khá thông dụng. Theo tác giả của ngôn ngữ Javascript, Brendan Eich: “Javascript có những đặc tính mà làm cho nó rất khác biệt so với các ngôn ngữ lập trình động còn lại, cụ thể là nó không có khái niệm về đa luồng, tất cả là đơn luồng và hướng sự kiện.“
• Nodejs chạy đa nền tảng phía Server, sử dụng kiến trúc hướng sự kiện Event- driven, cơ chế non-blocking I/O làm cho nó nhẹ và hiệu quả.
• Có thể chạy ứng dụng Nodejs ở bất kỳ đâu trên máy Mac – Window – Linux, hơn nữa cộng đồng Nodejs rất lớn và hoàn toàn miễn phí. Các bạn có thể thấy cộng đồng Nodejs lớn như thế nào tại đây, các package đều hoàn toàn free:
• Các ứng dụng NodeJS đáp ứng tốt thời gian thực và chạy đa nền tảng, đa thiết bị.
ExpressJS
Hình 2.3.3-1 ExpressJS
10 Giới thiệu
• Express js là một Framework nhỏ, nhưng linh hoạt đượ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.
• Về các package hỗ trợ: Expressjs có vô số các package hỗ trợ nên các bạn không phải lo lắng khi làm việc với Framework này.
• Về performance: Express cung cấp thêm về các tính năng (feature) để dev lập trình tốt hơn. Chứ không làm giảm tốc độ của NodeJS.
• Và hơn hết, các Framework nổi tiếng của NodeJS hiện nay đều sử dụng ExpressJS Lợi ích
• Framework giúp cho việc phát triển ứng dụng được rút ngắn đi rất nhiều.
Express được xây dựng dựa trên NodeJs. Vậy nó có ưu điểm gì để ta lựa chọn cho việc phát triển ứng dụng.
• Express hỗ trợ việc phát triển ứng dụng theo mô hình MVC, mô hình phổ biến cho việc lập trình web hiện nay.
• Cho phép định nghĩa Middleware hỗ trợ cho việc tổ chức và tái sử dụng code.
• Định nghĩa routes và các request method đến server một cách dễ dàng.
• Hỗ trợ REST API.
• Và còn rất nhiều thứ mà framework này hỗ trợ, còn bây giờ hãy thử cài đặt và xây dựng một ứng dụng đơn giản nhé.
11 Hệ quản trị cơ sở dữ liệu MongoDB [2, 3, 4]
Giới thiệu
Hình 2.5.1-1 So sánh mức độ phổ biến của MongoDB
Hệ quản trị cơ sở dữ liệu MongoDB là một mã nguồn mở NoSQL. Thay vì sử dụng các bảng và hàng như trong các cơ sở dữ liệu truyển thống, MongoDB sử dụng collection và document.
Đặc điểm của MongoDB:
− Khác với SQL, MongoDB không cần định nghĩa sẵn các schema, các trường có thể được thêm vào trực tiếp.
− Document:
+ Mỗi document sẽ có dạng là các cặp key-value (tương tự như JSON). Các document có thể có các key-value, kích thước, và nội dung khác nhau (Không cố định như SQL)
+ Mỗi trường có thể lưu trữ nhiều loại kiểu dữ liệu từ đơn giản (như number, string) đến phức tạp (Object, Array, …)
− Collection: Mỗi collection sẽ chứa nhiều Document và các phương thức hỗ trợ thao tác lên dữ liệu.
12 Ưu điểm của MongoDB
− MongoDB lưu trữ dữ liệu dễ dàng, linh hoạt và dễ dàng mở rộng vì dữ liệu trong MongoDB không có sự ràng buộc lẫn nhau.
− MongoDB có tốc độ truy vấn nhanh hơn so với các cơ sở dữ liệu quan hệ
− MongoDB có khả năng mở rộng tốt thông qua các cluster.
13 ReactJS
Giới thiệu
Hình 2.6.1-1 ReactJS
React là thư viện JavaScript phổ biến nhất để xây dựng giao diện người dùng (UI).
Nó cho tốc độ phản hồi tuyệt vời khi user nhập liệu bằng cách sử dụng phương pháp mới để render trang web.
Components của công cụ này được phát triển bởi Facebook. Nó được ra mắt như một công cụ JavaScript mã nguồn mở vào năm 2013. Hiện tại, nó đã đi trước các đối thủ chính như Angular và Bootstrap, hai thư viện JavaScript bán chạy nhất thời bấy giờ.
Ưu điểm
• Dễ sử dụng
• Hỗ trợ Reusable Component
• Viết component dễ dàng hơn với jsx( bên trong bao gồm html,js,css)
• Thân thiện với seo.
React Hook
Hooks là tính năng mới được giới thiệu trong phiên bản React 16.8. Nó cho phép bạn sử dụng trạng thái và các tính năng khác của React mà không cần viết một lớp. Hooks là các chức năng "móc vào" trạng thái React và các tính năng vòng đời từ các thành phần chức năng. Nó không hoạt động bên trong các lớp.
Các móc có khả năng tương thích ngược, có nghĩa là nó không chứa bất kỳ thay đổi phá vỡ nào. Ngoài ra, nó không thay thế kiến thức của bạn về các khái niệm React.
Một số react hook thông dụng :
• useState
• useEffect
14
• useSelector
• useDispatch
Hình 2.6.3-1 React Hook Flow Diagram
15