2022 04 27 - 메시지큐 사용사례 메시지큐를 적용할 수 있는 사례 * 작업에 대한 응답이 필요하지 않는경우 * 동시에 많은 요청이 들어오는 경우 -> 서버가 처리할 수 있는 요청을 넘어서는경우, 클라이언트는 서버의 응답을 타임아웃 시간동안 기다리다 연결을 종료하며, 이는 request유실로 이어진다. * 어플리케이션간 or 어플리케이션 내에서 통신하기 위한 방법 * 트래픽이 치고 들어올때 Scare up & Scare Down 하기 위해 * 오래걸리는 프로세스나, 백그라운드로 실행이 필요한경우 -> 예) 이미지 스케일링 시스템. 이미지 업로드 > 큐에저장 > 컨슈머가 썸네일을 만드는등 작업 -> 예) 큐에 일단 업로드. 컨슈머가 하나씩 꺼내와서 악성코드 검사. 후에 서버 업로드 * 마이크로 서비스 사이의 중개 역할 -> 각 마이크로 서비.. 2022. 4. 27. 2022 04 20 - RabbitMQ 송신자: 메시지를 전송한다. 큐: 대기열. 큰 메시지 버퍼라고 생각하자. 소비자: 메시지를 수신하기위해 대기한다.(그렇지만, 논블로킹이다.) 가장 간단한 구조 - 송신자와 수신자가 1:1 RabbitMQ는 메시지를 큐로 직접 보낼수 없다. 항상 exhange를 거쳐야 한다. routing_key 는 큐의 이름이다. 메시지를 비동기적으로 푸시하기 때문에, 큐는 리스너가 메시지를 팝하기 전까지 메시지를 버퍼링한다. 리스너는 큐를 리스닝하고 있다가 메시지가 도착하면 등록한 콜백을 동작시켜서 로직을 실행한다. 송신측 0)연결생성 1)큐 설정 (큐가 없으면 큐생성) 2)메시지 전송 수신측 0)연결생성 1)큐 설정 (큐가 없으면 큐생성) 2)메시지 처리할 콜백함수 선언 2)큐 리스닝 작업 대기열 생성 - 송신자 1.. 2022. 4. 20. 2022 03 20 하이오더 컴포넌트 예제 url과 컴포넌트를 받아서 데이터 로딩이 되기 전까지 로딩중이라는 메시지를 띄워주는 하이오더컴포넌트. import React, {useState, useEffect, Component, Fragment} from 'react'; const DataComponent = (ComposedComponent, url) => { return class DataComponent extends Component{ constructor(props) { super(props); this.state = { data: [], loading: false, loaded: false } } componentWillMount() { this.setState({loading: true}) fetch(url) .then(data =>.. 2022. 3. 20. 2022 03 20 react 함수형 컴포넌트 함수형 컴포넌트의 과거와 현재 함수형 컴포넌트는 함수를 기반으로 컴포넌트를 생성할 수 있는 문법이다. 과거에는 함수형 컴포넌트는 라이프 사이클과, state를 사용할 수 없다는 단점이 있었다. 이런 단점으로 인해 함수형 컴포넌트는 라이프사이클과, state를 사용하지 않는 간단한 컴포넌트를 만드는데 주로 사용되었으나, 16.8버전 부터 Hook이라는 개념이 도입된 후 클래스 컴포넌트와 동일하게 사용할 수 있게 됐다. 함수형 컴포넌트에서 state 어떻게 써요? -> useState Hook useState를 호출할때 초기값을 먼저 파라미터로 전달한다. 그리고 useState호출하면 배열을 반환하는데, 첫번째 반환값은 state값을, 두번째 반환값은 state를 변경할 수 있는 함수를 반환한다. const.. 2022. 3. 20. 2022 03 20 - 단축평가 오픈소스 보다보면 꽤 자주 만나는 문법 정리 &는 false일때까지 실행한다. ||는 true를 만날 때 까지 실행한다. - 기본값을 표현할 때 좋다. 예시 ) const getUserName = (UserData = {}) => { return UserData.name?.firstName || '익명의사용자' } // 실행 결과 `${getUserName()} 님 안녕하세요` // '익명의사용자 님 안녕하세요' // 실행 결과 (2) const UserData = { name : { firstName : 'sohee' } } `${getUserName(UserData)} 님 안녕하세요` 'sohee 님 안녕하세요' 2022. 3. 20. 2022 03 19 - Promise 체이닝과 / async await 리액트를 사용하면서 js를 사용할일이 잦아졌다. axios를 사용할때나, 화면을 지연없이 그릴일이 많아져서 그런것같다. 사용할때마다 헷갈리는 Promise 체이닝과 async await개념을 명확히 하여 클-린한 코드를 작성할 수 있도록 해보자. 1. 비동기 함수 작성 어느날 소희는 아래와 같은 비동기 함수를 작성했다. 입력받은 숫자에서 10을 더하는 함수이다. const sum10 = (number) => { let count = 0; let timerId = setInterval(() => { console.log(++number); if(++count === 10){clearInterval(timerId)} }, 1000) } 1-1. 콜백지옥 문제 인식하기. 하지만 언제나 그렇듯, 기획이 급하게 .. 2022. 3. 19. 이전 1 2 3 4 ··· 47 다음
