반응형 분류 전체보기253 [React/axios] 토큰 관리(refreshToken, accessToken) interceptors 프로젝트 도중에 refreshToken과 accessToken을 어떻게 관리하면 좋을지에 대해서 계속 생각을 해보았다. 다양한 방법을 찾았었는데 우선 내가 시간을 정해서 setTimeout으로 정해진 시간이 끝나면 다시 서버에 요청해서 accesstoken을 발급 받는 방법을 봤었는데 처음엔 그렇게 할까? 생각하다가 조금 더 찾아보자는 마음으로 찾기 시작했다. 우선 나는 편하게 쓰기위해서 공통 api를 따로 빼놓는 편인데 그 부분에서 같이 헤더를 보낼 생각을 하다가 더 찾아보니 interceptors라는게 있어서 이용해보기로 했다. const Apis = axios.create({ baseURL: "http://URL", }); 이런식으로 기본적으로 베이스가 될 url을 잡아주고 토큰을 매번 주소로 연결.. 2022. 5. 29. [RTK] Redux Toolkit 사용할 때 state값 proxy로 나올 때 해결법 RTK를 사용할 때 state값이 proxy로 나온다면 import { createSlice, current } from "@reduxjs/toolkit"; ... console.log(current(state.data)); current를 붙여서 확인하면 데이터가 제대로 나온다. https://stackoverflow.com/questions/64586207/redux-toolkit-state-showing-as-proxy-undefined-within-reducer Redux Toolkit: state showing as Proxy / undefined within reducer Solved it, thanks! - For anyone interested, I was trying to access s.. 2022. 5. 29. [TIL] 220519 흠 잘하고 있는가? 에 대해서 물어본다면 아니 라고 말하고 싶다. 분명 정리하고 싶었던 것이 많았던 것 같은데 시간이 없다. 클린코딩 대체 어떻게 하는거냐고 ... 뭔가 계속 리팩토링을 하고 있지만 이게 최선인가????? 흠.. 2022. 5. 20. [React] input의 useState를 하나로 통합해서 관리할 때 에러 const [inputs, setInputs] = useState({ title: "하나둘", subTitle: "", }); const { title, subTitle } = inputs; const onChange = (e) => { const { value, title } = e.target; setInputs({ ...inputs, [title]: value, }); }; 이렇게 해서 여러가지 input을 통합으로 관리하고 아래 onChange로 수정을 하려고 했는데 이런식으로 오류가 나는 것이었다!! 이부분은 원래 이렇게 쓰던 부분에서 value를 defaultValue로 바꿔주면 에러가 뜨지 않고 사용가능하다. 처음에 당황했는데 생각보다 쉬운문제라서 다행이다 ! 2022. 5. 6. [TIL] 220504 요즘 이것저것 찾아보고 정신이 없어서 TIL을 못쓰고 있었다. 드디어 해결책을 찾은 것 같긴 한데.. 완벽한가에 대해서 묻는다면 그건 흠............... 아직 잘 모르겠다. 이게 더이상 아 나도 모르겠닿ㅎㅎㅎㅎㅎ로 포기하려다가 또 생각해보면 내가 안하면 누가 하나 왔다갔다 하더니 결국에 포기하지 않으면 해결은 되더라 새벽에는 쉬고 싶었는데 덕분에 쉬지못하고 어느날은 mock데이터로 어느날은 drag로 불타는 날을 보내고 있다. 물론 재미는 있다. 예전에는 복붙만 하던 시절이 있었는데 지금은 알때까지 다 찾아서 훑어보면서 내꺼에 적용했을 때 되면 너무 짜릿해 2022. 5. 5. [React] Mock data 활용법 2 저번에는 json-server를 이용한 mock data였다면 이번엔 엄청나게 간단하게 js로 만들어서 불러와서 사용해주는 방법이다. 차이가 있다면 json-server를 이용해서 데이터를 만들어주게 되면 fetch나 axios를 사용해서 직접 불러서 뿌려줄 수가 있겠지만 다른 작업을 하기 위해 필요한 데이터만 부르기에는 이 방법이 더 간단한 것 같아서 시작해보았다. 예를들어 initailData를 만들어 준 후에 const initailData = { tasks:{ 'task-1': {id: 'task-1', content: "하나둘"}, 'task-2': {id: 'task-2', content: "셋넷"}, 'task-3': {id: 'task-3', content: "다섯"}, 'task-4': .. 2022. 5. 4. 이전 1 2 3 4 5 ··· 43 다음
