지금 블로그는 올해 5월부터 작성하기 시작했습니다. 2023년 5월 이전 : velog - dacircle.log 이전 블로그에 있는 게시물은 조금씩 현재 블로그로 옮길 예정입니다. 감사합니다.

프로젝트 리팩토링을 진행하면서 보니 react-router-dom v6.4 이상에서 권장하는 방법이 아닌 다른 방법으로 router를 관리하고 있었다. 이번에 리팩토링 하면서 새로 알게 된 방법을 정리해보려 한다. createBrowserRouter 모든 React Router 웹 프로젝트에 권장되는 방법이다. 인자로 routing...

생활코딩의 redux toolkit - thunk 를 이용해서 비동기 작업을 처리하는 방법을 듣고 정리한 내용입니다. 서버와 통신하는 경우처럼 redux로 비동기 작업을 어떻게 처리해야 할까? createAsynkThunk 비동기 작업을 처리하는 action을 만들어준다. 인자로 타입(string)과 promise를 반환하는 함수...

노마드코더 - 초보자를 위한 리덕스 101을 듣고 정리한 내용입니다. Redux Toolkit이란 Redux를 더 간단하게 사용할 수 있게 하는 라이브러리 기존 Redux의 단점들을 보완하였다. store를 설정하는데 너무 복잡하다! 보일러 플레이트 코드(boilerplate code)가 많...

노마드코더 - 초보자를 위한 리덕스 101을 듣고 정리한 내용입니다. 공식문서에서 connect()보다 useSelector()와 useDispatch()를 사용하는 것을 권장하고 있다. 참고 ) React Redux - connect() React Redux로 ToDo 앱 만들어보기 0. 개발 환경 세팅 react-redu...

최근 본 면접에서 axios의 interceptors에 대해 질문을 받았다. 이 질문을 받고 대답을 잘 하지 못한 나를 떠올리며 정리해보려 한다. Interceptors란 Intercept 뜻 : 가로채다, 빼앗다 axios의 Interceptors는 요청과 응답의 then이나 catch가 실행되기 전에 가로챌 수 있게 한다. ...

노마드코더 - 초보자를 위한 리덕스 101을 듣고 정리한 내용입니다. state Mutation Redux에서는 state를 직접 변경하면 안된다. 참고) redux 공식문서 - do not mutate state (공식 문서에 다르면 state를 직접 변경하게 되면 컴포넌트가 제대로 렌더링되지 않을 수도 있고, 디버깅을 중단시킬 수 ...

노마드코더 - 초보자를 위한 리덕스 101을 듣고 정리한 내용입니다. Redux 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너(공식페이지에 나온 문구) React에서만 사용할 수 있는게 아니라, 자바스크립트의 상태 관리를 위한 라이브러리이다. 상태(state) : 내 application에서 변경되는 데이터 ...

회원가입이나 로그인 등 여러 input이 있을 때, 각각 state로 값을 저장하면 코드가 길어지고 중복되는 코드도 많이 생기기 때문에 불편한 점이 많았다. // 예전 내 코드 const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); const [...

React에서 tsx 파일에 module.css 파일을 import하려고 했더니 에러가 발생했다. 에러 분석하기 import styles from "./index.module.css"; “message”: “Cannot find module ‘./Button.module.css’ or its corresponding type declar...