Thiết kế và cấu trúc frontend:

Những thành phần chính:

* src/app/@core/data: Là nơi khai báo các kiểu dữ liệu như product, import, stock, …
* src/app/@core/service: Chứ các service dùng để gọi api của backend
* src/app/@share: Chứa các component dùng chung
* src/app/pages: Là nơi chứa code của các màn hình: khi ta bấm vào sản phẩm ở menu sidebar
thì sẽ ra màn hình sản phẩm (pages/products)

.html:

Định dạng: Tệp HTML (HyperText Markup Language).

Chức năng: HTML là ngôn ngữ đánh dấu được sử dụng để định hình cấu trúc và nội dung của
trang web. Trong một dự án phát triển giao diện web, các tệp HTML thường được sử dụng để
xây dựng khung giao diện, định nghĩa các thành phần như các thẻ, form, button, và các kết
cấu cơ bản của trang web.

.scss:

Định dạng: Tệp SCSS (Sassy CSS).

Chức năng: SCSS là một ngôn ngữ được dùng để viết CSS một cách có cấu trúc hơn và dễ
bảo trì hơn. Trong một dự án phát triển giao diện web, các tệp SCSS thường được sử dụng để
tạo ra các quy tắc kiểu cho các thành phần giao diện, bao gồm việc tô màu, thiết lập vị trí và
kích thước, tạo hiệu ứng và định dạng khác nhau để làm cho giao diện trở nên đẹp hơn và dễ
đọc hơn.

.ts:

Định dạng: Tệp TypeScript.

Chức năng: TypeScript là một ngôn ngữ lập trình phổ biến được sử dụng để phát triển các ứng
dụng web. Trong một dự án phát triển giao diện web, các tệp TypeScript thường được sử
dụng để xử lý logic của giao diện, bao gồm việc tương tác với dữ liệu, xử lý sự kiện từ người
dùng, và cập nhật giao diện tương ứng. TypeScript cung cấp tính năng kiểm tra kiểu và các
tính năng lập trình hướng đối tượng giúp giảm thiểu lỗi và tăng cường tính bảo trì của mã
nguồn.

Kết hợp giữa các tệp HTML, SCSS và TypeScript giúp xây dựng giao diện web một cách
hiệu quả và dễ dàng bảo trì, với cấu trúc, kiểu dáng và logic rõ ràng.

Thiết kế và cấu trúc Backend

Thiết kế backend dựa trên mô hình 3 lớp mang lại nhiều lợi ích quan trọng, bao gồm:

Tách biệt trách nhiệm và chức năng: Mô hình 3 lớp tách biệt rõ ràng các trách nhiệm và
chức năng của từng lớp, giúp cho việc quản lý dự án và bảo trì mã nguồn dễ dàng hơn. Mỗi
lớp chỉ chịu trách nhiệm về một khía cạnh cụ thể của ứng dụng, giúp tăng tính rõ ràng và tổ
chức của mã nguồn.

Dễ mở rộng và tái sử dụng: Bằng cách tách biệt logic kinh doanh (Service) và truy cập dữ
liệu (Repository), mô hình 3 lớp tạo ra một cơ sở linh hoạt cho việc mở rộng ứng dụng và tái
sử dụng mã nguồn. Khi cần mở rộng hoặc thay đổi logic kinh doanh hoặc cơ sở dữ liệu, chỉ
cần thay đổi ở lớp tương ứng mà không ảnh hưởng đến các phần khác của hệ thống.

Kiểm thử dễ dàng: Với mô hình 3 lớp, việc kiểm thử trở nên dễ dàng hơn vì mỗi lớp có thể
được kiểm thử một cách độc lập. Điều này giúp tăng cường tính đáng tin cậy và chất lượng
của ứng dụng, vì mỗi lớp được kiểm thử riêng biệt và có thể được thay đổi mà không ảnh
hưởng đến các lớp khác.

Bảo mật và quản lý quyền truy cập: Mô hình 3 lớp cho phép triển khai các biện pháp bảo
mật ở mỗi lớp, giúp kiểm soát quyền truy cập và bảo vệ dữ liệu. Điều này rất quan trọng trong
các ứng dụng yêu cầu bảo mật cao, nơi mà việc quản lý quyền truy cập và bảo vệ dữ liệu là rất
cần thiết.
Dễ dàng quản lý dự án và phát triển song song: Với mô hình 3 lớp, các nhóm phát triển có
thể làm việc song song trên các phần khác nhau của ứng dụng mà không ảnh hưởng đến nhau
quá nhiều. Điều này giúp tăng cường hiệu suất làm việc và giảm thời gian phát triển tổng thể
của dự án.

Mô hình 3 lớp là một kiến trúc phần mềm phổ biến trong phát triển ứng dụng, được tổ chức
thành ba lớp chính:

Giao diện người dùng (Presentation Layer):

Lớp này là điểm vào của người dùng, nơi họ tương tác với ứng dụng.
Nó chịu trách nhiệm hiển thị thông tin cho người dùng và thu thập dữ liệu từ họ thông qua các
giao diện người dùng như trang web, ứng dụng di động, hoặc giao diện đồ họa.
Giao diện người dùng không nên chứa logic kinh doanh hay truy cập dữ liệu trực tiếp từ cơ sở
dữ liệu. Thay vào đó, nó gọi các phương thức từ lớp Logic (Business Logic Layer) để xử lý
logic kinh doanh và lấy hoặc gửi dữ liệu từ hoặc đến cơ sở dữ liệu.
Logic (Business Logic Layer):
Lớp này chứa logic kinh doanh của ứng dụng, nơi các quy tắc kinh doanh được thực hiện.
Nó xử lý dữ liệu nhận được từ giao diện người dùng, thực hiện các tính toán, kiểm tra và xác
thực dữ liệu, và gửi hoặc nhận dữ liệu từ lớp dữ liệu (Data Layer).
Lớp Logic không nên trực tiếp giao tiếp với cơ sở dữ liệu; thay vào đó, nó sử dụng các
phương thức từ lớp Dữ liệu để truy xuất hoặc cập nhật dữ liệu.
Dữ liệu (Data Layer):
Lớp này chứa dữ liệu của ứng dụng, bao gồm cơ sở dữ liệu và các dịch vụ hoặc API để truy
cập dữ liệu.
Nó cung cấp các phương thức để thực hiện các thao tác cơ bản như truy vấn, thêm, sửa, xóa
dữ liệu từ hoặc đến cơ sở dữ liệu.
Lớp Dữ liệu không nên chứa logic kinh doanh; thay vào đó, nó chỉ nên cung cấp các phương
thức cần thiết để truy cập và quản lý dữ liệu.
Mô hình này giúp tách biệt các trách nhiệm và chức năng của từng lớp, làm cho mã nguồn dễ
bảo trì, mở rộng và tái sử dụng.

Cấu trúc của Backend dựa trên mô hình 3 lớp:

Controller: Được sử dụng để xử lý các yêu cầu được gửi từ phía frontend. Nó là điểm vào
của ứng dụng từ phía người dùng và điều hướng các yêu cầu đó đến các phương thức xử lý
tương ứng trong lớp Service. Trong lớp Controller, các dữ liệu từ frontend có thể được truy
xuất và chuyển đổi thành các yêu cầu gọi đến các phương thức của Service. Sau khi Service
hoàn thành xử lý, Controller có thể trả về kết quả cho frontend hoặc chuyển hướng đến các
trang khác (nếu cần).

Service: Là nơi chứa logic chính của ứng dụng. Nó thực hiện các hoạt động xử lý logic, xử lý
dữ liệu từ lớp Controller và giao tiếp với lớp Repository để thực hiện các thao tác tương tác
với cơ sở dữ liệu. Service có thể chứa các phương thức để thực hiện các nhiệm vụ như xử lý
logic kinh doanh, kiểm tra quyền truy cập, xác thực, và thao tác với dữ liệu.

Repository: Là lớp liên kết giữa ứng dụng backend và cơ sở dữ liệu. Nó cung cấp các
phương thức để thực hiện các thao tác cơ bản như truy vấn, thêm, sửa, xóa dữ liệu từ hoặc đến
cơ sở dữ liệu. Thông thường, các phương thức trong Repository được sử dụng bởi lớp Service
để tương tác với cơ sở dữ liệu.

Dto (Data Transfer Object): Là các đối tượng dùng để chuyển dữ liệu giữa các lớp trong
ứng dụng, đặc biệt giữa Controller và Service hoặc giữa Service và Repository. Các đối tượng
này thường chứa các trường dữ liệu cần thiết cho việc truyền thông tin giữa các thành phần
của hệ thống.

Entity: Đại diện cho cấu trúc dữ liệu của cơ sở dữ liệu. Entity thường ánh xạ trực tiếp với các
bảng trong cơ sở dữ liệu, mỗi trường trong Entity tương ứng với một cột trong bảng. Khi chạy
ứng dụng lần đầu tiên, Entity được sử dụng để tạo các bảng trong cơ sở dữ liệu và thiết lập
các quan hệ giữa chúng.

Cấu trúc này giúp tách biệt các trách nhiệm và chức năng của từng thành phần trong ứng
dụng, giúp cho mã nguồn dễ bảo trì, mở rộng và tái sử dụng.

Luồng của 1 request: