비동기6 [React] useEffect로 api 받아와서 렌더링하기 useEffect를 사용하면 입맛에 맞게 렌더링을 할 수 있다고 해서 사용했다. 그런데 api 비동기 요청 후 state 변경하는 과정에서 오류가 난다😥 대충 이런 식으로 코드를 작성했다. App = () => { var [data, setData] = useState({}); async function fetch1() { data["1"] = await fetchApi1(); } async function fetch2() { // fetch1 과 동일 } async function fetch3() { // fetch1 과 동일 } function getData() { fetch1(); fetch2(); fetch3(); } useEffect( ()=> { getData(); },[]); return (.. 2023. 7. 2. [서평 23년-21] 스프링 부트 실전 활용 마스터 독서기간_2023년 2월 26일 ~ 2023년 3월 저자_그렉 턴키스트 출간일_2021년 5월 28일 들어는 보았나 리액티브 스트림 개발. 입문자에겐 절대 비추천하는 책이다. "실전 활용"이 제목인만큼 일반적인 Spring Boot를 공부하지 않는다. WebFlux라는 라이브러리를 이용해 스트림 통신 개발을 다룬 책이다. 마치 Spring Boot가 리액티브 패러다임이 기본인 것처럼 알려준다. 친절한 설명과 따라 치기 쉬운 예제 덕분에 많은 공부가 되었다. 현직의 ㅎ도 시작 못한 백수지만 현직자가 공부하기 좋은 책같다. 음 그냥 읽어보세요! 자신이 얼마나 무지한지를 깨닫게 됩니다. 개발에 발을 담굴수록 느끼는 거지만 끝이 없다. 취업해서도 꾸준히 책 읽고 공부하는 개발자가 되어야지. 하고 싶은 건 많은데.. 2023. 5. 15. R Socket이란 무엇일까? 리액티브 스트림의 근간을 다루는 개념은 바로 배압(backpressure)이다. 하지만 HTTP는 리액티브하지 않다. HTTP는 요청-응답 패러다임에 뿌리를 두고 있다. 과거의 개발자들은 HTTP를 사용하는 단순 요청-응답을 넘어서 터널로 서로 연결하는 방법을 고민해왔다. > 첫 번째, 롱 폴링 클라이언트가 서버에 요청을 보낸 후 즉각적인 대답을 기대하지 않고, 오래 기다리더라도 서버의 응답을 기다린다. 응답을 받으면 처리하고 바로 새로운 요청을 서버에 보내 기다리는 식으로 연결 지속성을 확보한다. 하지만 자원을 점유한다는 한계가 있다. > 두 번째, 웹소켓 웹소켓은 HTTP와는 다르게 양방향이다. 가볍고 양방향 비동기 통신을 지원하지만 배압 개념이 없으므로 리액티브하지 않다. RSocket 리액티브 프.. 2023. 3. 20. [Flutter] Future와 async/await Future 클래스란 크게 두 가지 상태를 갖고 있다. 완료와 미완료 상태. 완료됐을 때 두 가지 결과를 기대한다. 바로 'data'와 'error' 이다. Future future = futureNumber(); future.then((val) { // int가 나오면 해당 값을 출력 print('val: $val'); }).catchError((error) { // error가 해당 에러를 출력 print('error: $error'); }); 위처럼 then과 catchError 메서드를 이용해 결과의 분기를 구분한다. async, await는 대표적인 비동기 관련 키워드이다. async는 함수를 비동기 함수로 만들어 준다. await를 사용하면 비동기 함수가 끝날 때까지 기다리고, 사용하지 않으면.. 2023. 3. 19. 동기(Synchronous)와 비동기(Asynchronous), 블로킹(Blocking)과 논블로킹(Non-Blocking) 스프링부트 웹 플럭스를 공부하기에 앞서 "동기가 블로킹이고 비동기가 논블로킹 비슷한 거 아냐?" 라고 생각해 정리한다. 앞으로 헷갈리는 CS, 안 외워지는 개념들 모조리 정리하여 포스팅 할 계획이다. 동기와 비동기 A스레드가 B스레드를 호출한 후 결과를 A가 처리하느냐 B가 처리하느냐 작업 완료 여부를 무엇이 신경쓰는지가 관건이다. 동기 A스레드가 B스레드를 호출한 후 결과를 받아 A스레드에서 결과를 처리한다. 결과를 대기하는 동안 A스레드는 다른 작업을 처리하지 못하고 대기하여 블로킹처럼 보일 수 있다. 비동기 A스레드가 B스레드를 호출한 후 결과는 B스레드에서 처리(Callback)한다. A스레드는 작업에 제약이 없다. 블로킹과 논블로킹 A스레드가 B스레드를 호출한 후 작업이 종료될 때까지 A스레드에.. 2023. 3. 9. [Spring Reactive] WebFlux를 사용해 Reactive Spring Boot 구성해보기 Spring Boot WebFlux를 사용해 리액티브 스프링을 사용할 것입니다. maven으로 빌드를 해야 해서 골치가 조금 아픕니다. (^..^) 리액티브 스트림이란? 발행자(publisher)와 구독자(subscriber) 사이의 간단한 계약을 정의하는 명세다. 트래픽을 가능한 한 빨리 발행하는 대신에 구독자가 '난 10개만 더 받을 수 있어.'라고 발행자에게 알리는 방식으로 트래픽을 제어할 수 있다. 리액터란? 리액티브 스트림은 수요 조절에 기반하고 있다. 프로젝트 리액터는 핵심 타입인 Flux를 사용해 수요 조절을 구현한다. Flux는 일련의 T 객체를 담고 있는 컨테이너다. 예시를 들자면 레스토랑에서 서빙 점원과 비슷하다고 할 수 있다. 주방에서 요리가 완성되면, 점원이 요리를 받아서 손님에게 .. 2023. 3. 8. 이전 1 다음