도리쓰에러쓰

💡 2022년 이후 React 18.0ver batching 업데이트 나오면 async 몰라도 됩니다 ! 1. JavaScript의 sync / async 관련 상식 JavaScript는 일반적인 코드를 작성하면 동기(Synchronous) 처리가 됩니다. 동기(Synchronous) 처리는 코드 윗줄부터 차례대로 코드가 실행된다는 뜻입니다. 아래 코드는 콘솔창에 2, 3, 4 순으로 출력되고 있습니다. console.log(1+1);// 2 console.log(1+2);// 3 console.log(1+3);// 4 하지만 JavaScript는 비동기(Asynchronous) 하게 코드 실행이 가능한 함수들이 있습니다. ajax, 이벤트리스너, setTimeout 이런 함수들을 쓸 때 비동기 처리가 ..

저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] Redux3 :: state와 reducer가 더 필요하다면? 저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] Redux2 :: reducer / dispatch로 데이터 수정하기 저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] Redux1 :: props 대신 사용하기 저번 게. dori-coding.tistory.com 1. dispatch()로 데이터 수정 요청할 때 데이터 보내기 1️⃣ Cart.js에서 버튼에 dispatch()에 payload 추가하기 dispatch({ type : 'type명', payload : '보낼데이터' }) { props.dispatch({ type : '수량증가'..

저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] Redux2 :: reducer / dispatch로 데이터 수정하기 저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] Redux1 :: props 대신 사용하기 저번 게시물에 이어서 작성하겠습니다. (코드 참고) [React] Tab 만들기와 리액트에서의 등장 애니메이션 저번 dori-coding.tistory.com 1. redux를 통해 Alert창 닫기 기능 만들기 1️⃣ Cart..js에 alert 창을 하나 생성합니다. * div class는 bootstrap에 정의되어 있는 것을 사용하였습니다. 지금 구매하시면 신규할인 20% 닫기 2️⃣ alert 창의 상태를 저장하는 state와 reducer를 만듭니다. ..