SBA301 - Chương 1: Kiến trúc SPA và tích hợp với Spring Boot

Trong một ứng dụng React điển hình, vai trò chính của một máy chủ backend là xử lý và lưu trữ dữ liệu, cũng như quản lý các yêu cầu API. Máy chủ backend thường được sử dụng để lưu trữ và xử lý dữ liệu lớn, chẳng hạn như cơ sở dữ liệu, và để xử lý các yêu cầu API từ máy khách. Điều này giúp phân tách logic kinh doanh và logic giao diện người dùng, làm cho ứng dụng dễ dàng bảo trì và mở rộng hơn. Máy chủ backend cũng có thể được sử dụng để thực hiện các tác vụ phức tạp, chẳng hạn như tính toán và phân tích dữ liệu.

HTTP (Hypertext Transfer Protocol) là một giao thức được sử dụng để truyền tải dữ liệu qua internet, đặc biệt là giữa trình duyệt web và máy chủ. Mục đích chính của HTTP là cung cấp một cách thức để các ứng dụng web giao tiếp với nhau, cho phép truyền tải dữ liệu như văn bản, hình ảnh, âm thanh và các loại dữ liệu khác. HTTP sử dụng các phương thức như GET, POST, PUT và DELETE để thực hiện các hành động như đọc, tạo, cập nhật và xóa dữ liệu. Ngoài ra, HTTP cũng cung cấp các tiêu chuẩn về giao tiếp và truyền tải dữ liệu, giúp đảm bảo rằng dữ liệu được truyền tải một cách an toàn và chính xác.

Trong kiến trúc ứng dụng Spring Boot + React SPA, vai trò chính của ReactJS là tạo ra giao diện người dùng và xử lý các tương tác trên client-side. ReactJS là một thư viện JavaScript được sử dụng để xây dựng các ứng dụng web đơn hướng (Single Page Application - SPA) bằng cách tạo ra các thành phần UI động và tương tác. Nó giúp tạo ra các ứng dụng web nhanh chóng và hiệu quả, đồng thời cung cấp cho người dùng trải nghiệm sử dụng tốt hơn. Trong khi đó, Spring Boot sẽ xử lý các logic server-side và tương tác với cơ sở dữ liệu.

Các ứng dụng một trang (SPAs) có thể ảnh hưởng đến công cụ phân tích và theo dõi như Google Analytics. Khi sử dụng SPAs, người dùng không phải chuyển trang mà thay vào đó, nội dung sẽ được tải về và hiển thị trên cùng một trang. Điều này có thể gây khó khăn cho công cụ phân tích vì chúng không thể tự động theo dõi các trang khác nhau mà người dùng đã truy cập. Thay vào đó, người dùng phải thực hiện theo dõi thủ công cho các thay đổi đường dẫn. Điều này có nghĩa là người dùng phải tự động hóa việc theo dõi và phân tích dữ liệu để có được thông tin chính xác về hành vi người dùng.

Ở các ứng dụng một trang (Single Page Applications - SPAs), người dùng không cần phải tải lại toàn bộ trang khi chuyển đổi giữa các trang khác nhau. Điều này giúp giảm thiểu thời gian tải trang và cải thiện trải nghiệm người dùng. Sau khi tải trang lần đầu tiên, các trang khác sẽ được tải nhanh chóng và mượt mà, không cần phải chờ đợi quá lâu. Điều này là nhờ vào việc sử dụng JavaScript để tải và cập nhật nội dung trang mà không cần phải tải lại toàn bộ trang.

SPAs (Single-Page Applications) cung cấp trải nghiệm người dùng tốt hơn vì chúng cho phép người dùng di chuyển qua các trang web mà không cần tải lại toàn bộ trang. Điều này được thực hiện thông qua việc sử dụng JavaScript để tải nội dung mới vào trang web mà không cần phải tải lại toàn bộ trang. Điều này giúp cải thiện tốc độ và hiệu suất của trang web, đồng thời cũng giúp người dùng có trải nghiệm mượt mà hơn. Ngoài ra, SPAs cũng cho phép người dùng tương tác với trang web mà không cần phải chờ đợi trang web tải lại. Điều này giúp người dùng có thể tương tác với trang web một cách nhanh chóng và dễ dàng hơn.

Các ứng dụng một trang (SPAs) thường thực hiện nhiều xử lý trên phía client, điều này làm tăng nguy cơ tấn công Cross-Site Scripting (XSS). XSS là một loại tấn công web mà kẻ tấn công có thể thực hiện mã độc trên trang web của nạn nhân, khiến nạn nhân thực hiện các hành động không mong muốn. Các ứng dụng một trang thường sử dụng JavaScript để thực hiện các hành động trên phía client, và nếu mã JavaScript bị tấn công, kẻ tấn công có thể thực hiện các hành động độc hại như sao chép dữ liệu, thực hiện các giao dịch không mong muốn, v.v. Vì vậy, các nhà phát triển cần phải chú ý đến việc bảo mật mã JavaScript của mình để tránh các tấn công XSS.

Các ứng dụng đơn trang (SPAs) có một nhược điểm quan trọng liên quan đến lịch sử và điều hướng của trình duyệt. Khi bạn sử dụng một SPA, trình duyệt không thể lưu lại lịch sử trang web như một trang web truyền thống. Điều này có nghĩa là nếu bạn muốn quay lại trang trước đó, bạn không thể sử dụng tính năng quay lại (back) của trình duyệt. Thay vào đó, bạn phải sử dụng các tính năng riêng của ứng dụng để điều hướng. Một nhược điểm khác là bạn cần cấu hình thủ công để quản lý lịch sử trình duyệt một cách chính xác. Điều này có thể gây khó khăn cho người dùng khi họ muốn quay lại trang trước đó.

Các ứng dụng một trang (SPAs) được coi là lý tưởng để xây dựng các ứng dụng web phản hồi vì chúng cung cấp nội dung cập nhật nhanh chóng và động. Điều này đạt được thông qua việc sử dụng JavaScript để tải dữ liệu từ máy chủ và cập nhật nội dung trên trang web mà không cần tải lại trang. Điều này giúp cải thiện trải nghiệm người dùng và tăng tốc độ tải trang. Ngoài ra, các ứng dụng một trang thường được xây dựng trên cơ sở dữ liệu và có thể được truy cập từ bất kỳ thiết bị nào có kết nối internet, bao gồm cả máy tính để bàn và thiết bị di động. Điều này giúp tạo ra một ứng dụng web phản hồi linh hoạt và dễ sử dụng.

Các ứng dụng một trang (SPAs) thường giảm tải cho máy chủ bằng cách chuyển giao các chức năng định tuyến và hiển thị sang máy khách. Điều này có nghĩa là máy khách sẽ xử lý các yêu cầu của người dùng và không cần phải gửi yêu cầu đến máy chủ. Điều này giúp giảm tải cho máy chủ và cải thiện hiệu suất của ứng dụng. Ngoài ra, các SPAs cũng thường sử dụng các kỹ thuật như lưu trữ dữ liệu trong bộ nhớ đệm của máy khách để giảm thiểu số lần truy cập máy chủ. Điều này giúp giảm tải cho máy chủ và cải thiện hiệu suất của ứng dụng.

Để xử lý các yêu cầu có nguồn gốc khác nhau (CORS) giữa React và Spring Boot, có một số cách tiếp cận phổ biến. Một trong số đó là cấu hình CORS trong Spring Boot. Điều này cho phép Spring Boot xác định các nguồn gốc được phép thực hiện các yêu cầu đến ứng dụng của nó, giúp ngăn chặn các yêu cầu không mong muốn. Điều này được thực hiện thông qua việc thêm các tiêu đề HTTP đặc biệt vào các phản hồi của ứng dụng, chẳng hạn như Access-Control-Allow-Origin. Bằng cách cấu hình CORS trong Spring Boot, bạn có thể kiểm soát các yêu cầu có nguồn gốc khác nhau đến ứng dụng của mình và đảm bảo rằng chúng được xử lý một cách an toàn và hiệu quả.

Node.js là một nền tảng phát triển ứng dụng dựa trên JavaScript, và một trong những tính năng quan trọng giúp nó xử lý hiệu quả các yêu cầu đồng thời là cơ chế I/O không chặn (non-blocking I/O). Điều này cho phép Node.js xử lý nhiều yêu cầu đồng thời mà không cần tạo ra nhiều luồng (thread) như các ngôn ngữ lập trình khác. Thay vào đó, Node.js sử dụng một cơ chế sự kiện (event-driven) để quản lý các yêu cầu và xử lý chúng một cách hiệu quả. Khi một yêu cầu được gửi đến, Node.js sẽ thêm nó vào một danh sách các sự kiện cần được xử lý, và sau đó xử lý các sự kiện khác trong khi chờ đợi kết quả của yêu cầu đó. Điều này giúp Node.js xử lý nhiều yêu cầu đồng thời mà không cần tốn nhiều tài nguyên hệ thống.

Để tạo một nhánh mới trong Git, bạn cần sử dụng lệnh 'git branch'. Lệnh này được sử dụng để tạo một nhánh mới từ một điểm cụ thể trong lịch sử commit của dự án. Trong câu hỏi này, bạn cần tạo một nhánh mới có tên là 'feature-login'. Lệnh đúng để tạo nhánh mới là 'git branch feature-login'. Lệnh này sẽ tạo một nhánh mới có tên là 'feature-login' và nó sẽ được tạo từ điểm hiện tại của nhánh hiện tại. Nếu bạn muốn chuyển sang nhánh mới ngay lập tức, bạn cần sử dụng lệnh 'git checkout' sau khi tạo nhánh mới.