search

duoctvd / duoctv-trainning

duoctv-trainning.vercel.app
0 stars 0 forks source link

Cấu trúc lại template theo Layered Architecture #33

Open bit-thuynt opened 3 years ago

bit-thuynt commented 3 years ago

Nội dung cần làm

  1. Cấu trúc lại template theo Layered Architecture: https://martinfowler.com/bliki/PresentationDomainDataLayering.html https://blog.cleancoder.com/uncle-bob/2012/08/13/the-clean-architecture.html

  2. Sử dụng path aliases để tránh sử dụng ../../ ở import path https://github.com/duoctvd/duoctv-trainning/blob/82050625ebf8ffd70bde870a21cbeb6b3cb1107b/src/components/templates/admin/news/list.tsx#L10-L12 Tài liệu tham khảo: https://nextjs.org/docs/advanced-features/module-path-aliases

duoctvd commented 3 years ago

Cấu trúc lại template theo Layered Architecture: https://martinfowler.com/bliki/PresentationDomainDataLayering.html https://blog.cleancoder.com/uncle-bob/2012/08/13/the-clean-architecture.html Em đã đọc tài liệu của nó, hiểu tinh thần là mình sẽ phân chưa ra lớp giống như MVC (Presentation Domain Data)

hiện tại thì code của mình, em thấy nó cũng chia ra đc theo cấu trúc xử lý riêng nhất định https://gyazo.com/4dd4e823052f8cea8a852f6fbb5957f7

Nhưng cái mình cần làm trong task này có phải là cấu trúc lại hết tất cả theo dạng kiểu này k chị? https://gyazo.com/9c6eb7fefcc3eb159463df8b3ccfc69f https://dev.to/joaosczip/clean-architecture-a-little-introduction-4ag6

hay chỉ cấu trúc lại 1 số phần nào đó?

Vì em đang tìm 1 cái sample nào đó để refer và cấu trúc theo cho đỡ sai, 2 links tài liệu trên họ chỉ nói về tư tưởng lý thuyết chứ k đề cập 1 sample cho mình dễ hình dung nhỉ

bit-thuynt commented 3 years ago

@duoctvd vậy em làm số 2 trước đi.

bit-thuynt commented 3 years ago

@duoctvd https://github.com/duoctvd/duoctv-trainning/issues/33#issuecomment-908210662

Phần M trong MVC thì cũng đã chia ra ok rồi, còn phần VC thì còn hơn lung tung xíu Ví dụ như ở new list https://github.com/duoctvd/duoctv-trainning/blob/main/src/components/templates/admin/news/list.tsx Mấy cái xử lý như này sẽ thuộc C (controller or container): https://github.com/duoctvd/duoctv-trainning/blob/e1d8115ca770a69fc5b9b5dec8843e0a39896270/src/components/templates/admin/news/list.tsx#L23 https://github.com/duoctvd/duoctv-trainning/blob/e1d8115ca770a69fc5b9b5dec8843e0a39896270/src/components/templates/admin/news/list.tsx#L31 https://github.com/duoctvd/duoctv-trainning/blob/e1d8115ca770a69fc5b9b5dec8843e0a39896270/src/components/templates/admin/news/list.tsx#L60

Còn mấy cái này thì thuộc V (view or presenter): https://github.com/duoctvd/duoctv-trainning/blob/e1d8115ca770a69fc5b9b5dec8843e0a39896270/src/components/templates/admin/news/list.tsx#L69-L80

Đối với presenter thì chỉ nhận props truyền vào rồi hiển thị ra view chứ không có mấy bước xử lý tạo hàm này nọ, mấy cái nào phức tạp sẽ thuộc xử lý của container.

Cách làm là em sẽ tách list.ts ra như sau