Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Clean Architecture-in Banksalad

SoYoung210
October 07, 2019

Clean Architecture-in Banksalad

2019 2nd Event XXIT TECH TALK에서 발표한 내용을 공유합니다.

스크립트가 필요한 부분은 회색박스에 내용을 추가했습니다.

SoYoung210

October 07, 2019
Tweet

More Decks by SoYoung210

Other Decks in Programming

Transcript

  1. react-router webpack & loader redux & redux- middleware babel react

    프로젝트를 셋팅하기 위해서는 정말 많은 것들이 필요합니다.
  2. : 어찌저찌.. 필요한 것들을 다 갖추었다.. : Routing 규칙은 어떻게할까요?

    데이터를 받아와서 View에서 사용하는건 어떻게 연결할까요? 비즈니스 로직 처리는 어디서 할까요? 세부 서비스가 있는데 이런건 어떻게 구분해서 규칙을 세울까요? 최초에 token처리를 해야하는데 이건 어디서 이루어 지나요? 구조를 어떻게 가져갈까요? 하지만, 이런 셋팅들을 다 했다고 하더라도, 비즈니스 로직 처리는 어떻게 할것인지, 폴더 구조는 어떻게 잡을 것인지 등 정말 프로젝트 관점에서 중요한 요소에 대한 고민이 필요합니다.
  3. : 어찌저찌.. 필요한 것들을 다 갖추었다.. : 음, 그… Clean

    Architecture 어떨까요 : Routing 규칙은 어떻게할까요? 데이터를 받아와서 View에서 사용하는건 어떻게 연결할까요? 비즈니스 로직 처리는 어디서 할까요? 세부 서비스가 있는데 이런건 어떻게 구분해서 규칙을 세울까요? 최초에 token처리를 해야하는데 이건 어디서 이루어 지나요? 구조를 어떻게 가져갈까요?
  4. 클라이언트는 제품의 정보가 수렴하는 곳. 프로젝트는 관리하기 어려워집니다. 이 모든

    카테고리가 수렴하는 곳이 바로 클라이언트, 즉 웹 프론트엔드 입니다. 여러가지 서비스를 제공하는 하나의 프로젝트를 어떻게 구성해 나가는의 관점에서 이 발표를 들어보시면 좋을것 같습니다.
  5. Q. 협업 과정에서 생기는 문제는? A. 소영님..코드를 읽을수 없어요 무슨

    소리인지 도당췌… ;; A. 서버한테 받아오는 데이터 형식 어디있어요 ?? A. api 명세가 수정되었습니다! 우리는 무엇을 해야할까요… A. 새로 비즈니스 로직 짜고 싶은데 뭘 어디서부터 어떻게해야..;; A. 아니 이분은 무슨 기준으로 이렇게 짰는지 
 (새로 입사해서 레거시 인계받은 사람) ഈসҙ੼
  6. ٜযоӝ੹ী 이런것들을 이야기 합니다. 이런 내용을 포함하지 않습니다. 1. 자세하게,

    Clean Architecture는 어떤 것인가? : ⚠ 재해석한 구조이기 때문에, Clean Architecture에서 말하고 있는 부분과 일부 다른점이 존재. 2. Domain 주도 개발에 대한 A to Z 1. 간단하게, Clean Architecture는 어떤 것인가? 2. BankSalad에서 바라봤었던 Clean Architecture의 구현체
  7. useCase ઺बਵ۽ ҙबࢎ੄ ܻ࠙, ੄ઓࢿ ઱ੑ੉ ੉ܖযઉঠ ೠ׮. entity৬ useCaseח

    ࠺ૉפझ object۽ ߄ۄࠁҊ, ui١ ৻ࠗࣁ҅ח gatewayܳ ా೧ usecase৬ ࣗా೤פ׮. ҙबࢎܳ ܻ࠙ೞҊ ࠺ૉפझ ۽૒ਸ/ ߄Չࣻ ੓ח ݽٚ ਃࣗ۽ࠗఠ ܻ࠙ೞח Ѫ੉ ௿ܽইఃఫ୊੄ ೨बੑפ׮.
  8. *-BZFST 1SFTFOUBUJPO %BUB %PNBJO &OUJUZ 사용자에게 보여지는 로직과 관련된 Layer

    네트워크를 포함한 데이터를 가져오는 Layer 사용자의 use case로 분리되는 Layer 개념을 정의하는 Layer ⚠ Uncle Bob didn't say this.⚠ ੹୓੸ੋ ҳઑܳ 4ѐ੄ ۨ੉য۽ ա־য ࠁওणפ׮.
  9. *-BZFST 1SFTFOUBUJPO %BUB %PNBJO &OUJUZ 사용자에게 보여지는 로직과 관련된 Layer

    네트워크를 포함한 데이터를 가져오는 Layer 사용자의 use case로 분리되는 Layer 개념을 정의하는 Layer ⚠ Uncle Bob didn't say this.⚠ -BZFSܻ࠙৬੄ઓࢿ઱ੑী'PDVT
  10. ੹୓੸ੋ ҳઑח ੉ۧѱ ؾפ׮. Contextח ੄ઓࢿ ઱ੑ੉ ੉ܖয૑ח Ҕ, Domain

    Layer৬ Entity Layerܳ ನೣೞҊ ੓ח core, Data Layerܳ ׸׼ೞח Dataಫ؊, ӒܻҊ Presentationਵ۽ ҳࢿؾפ׮.
  11. Service는 repository 를 주입받습니다.
 뒤에서 더 자세히.. Context - 대운동장

    모든 것을 줄세우는 Services Interface 가 정의되어 있다. 원칙☝: 종속성 주입. VIEW
  12. 1SFTFOUBUJPO ನ௄ހ ೙٘ۄח viewח য়૒ serviceܳ ଵઑೞҊ ੓Ҋ, Ӓ উী

    ੿੄ػ ೯زਸ ഐ୹ೞҊ ੓ח ഋకੑפ׮. ৈӝࢲח ࣻ૘ࢲ࠺झܳ ഐ୹ೞҊ ੓णפ׮.
  13. src/@context/repositories/센터.tsx ৘ٜܳয, context੄ ನ௄ހ ࣃఠ ۨ౵૑ షܻח 3о૑ ۨನ૑షܻܳ о૘פ׮.

    पઁ ҳ୓੸ੋ ೯ز਷ ੉ 3о૑ ۨನ૑షܻী ੿੄غয ੓ח ഋకੑפ׮. serviceח RepositoryDepnedencyܳ ઱ੑ߉Ҋ, п RepositoryDependencyח ೙ਃೠ ׮ܲ Repositoryܳ о૕ ࣻ੓णפ׮.ҳ୓੸ੋ ೯ز਷ ৈӝী ੿੄غয ੓חѪ੉ભ.
  14. !DPOUFYUIUUQQSPWJEFST apiо ৈ۞ serverীࢲ ҙܻؼ ٸ, server nameਸ ӝળਵ۽ ޘযفח

    ࠗ࠙ੑפ׮. ex: Serviceח Server, ח api serverܳ ଵઑೠ׮ݶ ੉ܳ ա־য فӝ ਤೣ.
  15. VIEW Services Interface 가 정의되어 있다. Context - 대운동장 모든

    것을 줄세우는 여기서 무슨 규칙으로 커뮤니케이션 하죠?
  16. DPSFTFSWJDF DPSFSFQPTJUPSZ : Domain Layer - 사용자의 use case로 분리되는

    Layer interface로 정의된 Repository를 주입받는다. catch৬ call਷ ࢎਊ੗੄ use case۽ ࠅ ࣻ ੓णפ׮. ೙ਃೠ ૒੽੸ੋ ৻ࠗ ܻࣗझח Ӓ ޖ঺ب աఋա੓૑ ঋणפ׮. ੉ ࠗ࠙਷ ,߸ೡ ࣻ ੓ח ਃࣗ۽ࠗఠ ܻ࠙दఃӝ ਤೣੑפ׮.
  17. TSDEBUB : Data Layer - 네트워크를 포함한 데이터를 가져오는 Layer

    ߸ೡࣻ ੓ח ਃࣗח DataLayerী ੿੄ೞѱ ؾפ׮. Data Layerо ߄۽ ֎౟ਕ௼ܳ ನೣ೧ࢲ ؘ੉ఠܳ оઉয়ח Layer੉ӝ ٸޙੑפ׮
  18. 1SFTFOUBUJPO ੉ܳ ইө ࢓ಝࠄ ௿ܽইఃఫ୊ Ӓܿҗ োҙ૑য ࢤп೧ࠁݶ, ನ௄ހ ೙٘

    ஹನք౟ח uiۨ੉যী ೧׼೤פ׮. ࣻ૘ࢲ࠺झী catchо ੿੄ػ ࠗ࠙਷ gateWay ۨ੉যী ೧׼ೞҊ, catchೣࣻ ղࠗীࢲח repositoryܳ ా೧ ؘ੉ఠܳ ഐ୹ೞ޲۽ ই݃ب use caseۨ੉য۽ ࠅࣻ ੓ਸѪ эणפ׮. catchী ನೣغח بхݽন੄ ‘ನ௄ހ ੿ࠁ’ח entity۽ ߄ۄࠅ ࣻ ੓णפ׮.
  19. Context - 대운동장 모든 것을 줄세우는 Presentation services View -

    Presentation Layer - router, component 등 WJFX TFSWJDF
  20. Context - 대운동장 모든 것을 줄세우는 Presentation services repositories View

    - Presentation Layer - router, component 등 WJFX TFSWJDF
  21. Context - 대운동장 모든 것을 줄세우는 Presentation services repositories View

    - Presentation Layer - router, component 등 WJFX TFSWJDF core Entity - Entity Layer
  22. Context - 대운동장 모든 것을 줄세우는 Presentation services repositories View

    - Presentation Layer - router, component 등 WJFX TFSWJDF core Entity - Entity Layer Service - Domain Layer Repository - Domain Layer DPOUFYUTFSWJDFTחDPSF੄TFSWJDFܳݽইم Interface
  23. Context - 대운동장 모든 것을 줄세우는 Presentation services repositories View

    - Presentation Layer - router, component 등 WJFX TFSWJDF core Service - Domain Layer http - Data Layer data Repository - Data Layer EBUBSFQPDPSFSFQPܳ*NQMFNFOUT Entity - Entity Layer Repository - Domain Layer Interface
  24. Context - 대운동장 모든 것을 줄세우는 Presentation services repositories View

    - Presentation Layer - router, component 등 WJFX TFSWJDF core Service - Domain Layer http - Data Layer data Repository - Data Layer EBUBSFQPDPSFSFQPܳ*NQMFNFOUT DPOUFYUTFSWJDFTחDPSF੄TFSWJDFܳݽইم Entity - Entity Layer Repository - Domain Layer Interface
  25. View 는 Service 만 알았고, $MFBO"SDIJUFDUVSF Service 안에 행동이 정의되어

    있으며 그 행동은 주입받은 repository에 의존합니다. JO#BOL4BMBE
  26. View 는 Service 만 알았고, $MFBO"SDIJUFDUVSF Service 안에 행동이 정의되어

    있으며 그 행동은 주입받은 repository에 의존합니다. if ( 이 규칙을 이해한다 ) { JO#BOL4BMBE
  27. View 는 Service 만 알았고, $MFBO"SDIJUFDUVSF Service 안에 행동이 정의되어

    있으며 그 행동은 주입받은 repository에 의존합니다. if ( 이 규칙을 이해한다 ) { return 빠른 개발 } JO#BOL4BMBE
  28. View 는 Service 만 알았고, $MFBO"SDIJUFDUVSF Service 안에 행동이 정의되어

    있으며 그 행동은 주입받은 repository에 의존합니다. if ( 이 규칙을 이해한다 ) { return [빠른 개발 , 규칙적인 개발] } JO#BOL4BMBE