IT 초보코딩의 세계74 Go 언어 Front End 제작해보기(모달 윈도) 2장 ◆ 상품 주문 모달 윈도 ◆ 모달을 위한 패키지 설치: npm install -–save reactstrap ◆ 상품 주문 모달 윈도 – modalwindow.js 파일을 src 디렉토리에 생성하고 작성 export function BuyModalWindow(props) { return ( Buy Item ); } ◆ 신용카드 결제 처리 ▶ 신용카드 정보 입력 폼 구현은 간단해 보일 수 있지만 텍스트 입력 창이 전부가 아니며 실제 운영 중인 서비스라면 신용카드 유효성을 검사하고 입력받은 정보를 안전하게 처리해야 하는데 신용카드 정보는 매우 민감한 정보이기 때문에 일반 데이터처럼 취급할 수 없음 ▶ 프론트 엔드에서 사용할 수 있는 다양한 신용카드 결제 서비스가 있는데 그 중 가장 많이 쓰이는 스트라이프 (.. 2023. 5. 10. Go 언어 Front End 제작해보기 1장 ◆ node 설치 ◆ react 설치 : npm install -g create-react-app ◆ 참고할 내용 ▶ 리액트 라우터 패키지: https://reacttraining.com/react-router/ ▶ 스트라이프: https://stripe.com/ ▶ 리액트 폼 제어: https://reactjs.org/docs/forms.html ◆ 프로젝트 생성: create-react-app music_frontend ◆ src 디렉토리에서 다음 파일 삭제 ▶ App.css ▶ index.css ▶ logo.svg ◆ public 디렉토리에 다운로드 받은 파일을 복사 ◆ Main 페이지를 위한 3개의 자바스크립트 파일을 src 디렉토리에 생성 ▶ Navigation.js: 탐색 메뉴 컴포넌트 ▶ P.. 2023. 5. 5. [Micro Service] Micro Service 상세 설계(도메인 모델링, 헥사고날 구조, 엔티티, Value object, 표준타입, 애그리거트, 도메인 서비스 및 이벤트) 2장 ◆ 도메인 모델링 ▶ 마이크로서비스의 내부 구조는 폴리글랏하게 접근할 수 있는데 폴리글랏하다 라는 의미는 애플리케이션을 구현하는 언어나 데이터를 저장하는 저장소를 서비스마다 다양하게 활용할 수 있다는 의미인 동시에 내부 아키텍처 구조를 서비스 특성에 맞게 다양하게 수립할 수 있다는 의미이기도 하므로 서비스의 내부 영역의 구조를 도메인 모델 중심으로 만들 수도 있고 트랜잭션 스크립트 형태로 만들 수도 있음 ▶ 도메인 모델 형태의 헥사고날 구조 ▶ 단순한 로직인 경우에는 트랜잭션 스크립트 구조로 만들어도 무방하지만 비즈니스가 복잡해질수록 비즈니스 개념들을 잘 구조화할 수 있는 도메인 모델 구조가 효과적 ▶ 도메인 모델 구조는 복잡함을 다루어 쉽게 표현할 수 있는 구조를 제공하기 때문인데 이러한 내부 구조를 .. 2023. 5. 4. [Micro Service] Micro Service 설계(이벤트 스토밍 워크숍 진행, 엑터 도출, 애그리거트 정의, 바운디드 컨텍스트, 컨텍스트 매핑) 2장 ◆ 이벤트 스토밍을 통한 마이크로서비스 도출 ▶ 이벤트 스토밍 워크숍 진행 ● 워크숍 진행 ⊙ 액터 도출 → 커맨드까지 찾고 나면 커맨드를 실행하는 액터(Actor)를 도출하는데 액터는 사용자 또는 조직, 역할자를 의미 → 액터는 추상적으로 식별하지 않고 비즈니스를 수행하는 구체적인 역할을 고려해서 도출 → 단순히 모든 업무에서 보편적으로 사용되는 회원이나 관리자로 정의하지 않고 특정 비즈니스를 실제로 수행하는 판매자, 구매자, 상품 관리자, 배송 관리자, 시스템 관리자와 같이 명확한 역할자를 도출하려고 노력해야 함 → 액터를 도출하면서 이전에 식별하지 못했던 커맨드와 도메인 이벤트가 추가로 도출될 수 있는데 이 경우에도 추가로 식별되는 사항들을 모델링 공간에 붙이면 됨 → 액터는 노란색의 작은 포스트잇.. 2023. 5. 2. 이전 1 ··· 7 8 9 10 11 12 13 ··· 19 다음
