저희팀은 만료되었을 때, 재발급을 받는 방식을 시간상 구현하지 못했어서, 추가적으로 리팩토링을 진행하였습니다. import axios, { AxiosRequestConfig } from 'axios'; import { postTokenRefesh } from '@/api/queryfn'; import { RefreshToken } from '@/types/tokenApiType'; export const EXPIRED_TIME = 1000 * 60 * 60 * 23; export const refreshInterceptor = async ( config: AxiosRequestConfig, ): Promise => { const expiresIn = window.localStorage.getItem('e..
CodeStates BootCamp
포트폴리오를 만들면서 지금까지 참여했던 프로젝트에 대한 내용을 소개하는 페이지를 만들었는데 각자 좀 구성이 달라서 페이지별로 파일을 만들었는데, 스터디를 하면서 여러 사람들이 재사용성을 고려해서, 본문에 대한 내용 파일과 디자인 틀만 만들어 놓고 불러오면 되지 않냐는 말을 들었습니다. ● dynamic import를 해야했던 과정 말로 설명하기 애매한데, 수정하기 이전에 저는 코드에 직접적으로 텍스트를 주입하면서 렌더하고 있었습니다. import { ReactComponent as Github } from '../../../public/icon/github.svg'; import { ReactComponent as Web } from '../../../public/icon/link.svg'; import..
코드 분할이나, 리팩토링을 마친 이후에 오늘은 앞으로 최적화를 어떻게 할건지에 대해서 회의를 마쳤습니다. 앞으로 최적화할 부분 예시 이미지 요소에 [alt] 속성 없음 사진 webp로 변환 시맨틱 태그도 수정 오늘 포스팅은 이전에 준석님께서 리팩토링해주셨던 부분이 잘 이해가 가지 않았어서 오늘 설명을 듣고 올리는 포스팅입니다. ● React-Router Loader 설정 이전에 저희팀은 accessToken이 없으면 다른 페이지 이동 되게 설정했었는데요. 코드는 아래와 같습니다. useEffect(() => { if (!accessToken) { navigate(Path.Login); } }, [accessToken, navigate]); useEffect를 사용해서, 렌더 이후에 없는지 판단하고 다시 ..
오랫동안 포스팅을 하지 못했었는데,, 준석님의 예비군과 + 저의 알바 근무 때문에 시간이 잘 안맞았던 관계로 포스팅을 길게 하지 못했었습니다. 그래도 각자 작업을 했었고, 또 대체로 3차 목표로 잡았던 리팩토링은 대부분 로직분리가 많았으므로, 딱히 포스팅할 내용도 없었네요. ● 3차 목표 ❍ Page CopyPopUp 페이지 삭제하기 query 관련 함수 useQuery, useMutation 모두 훅으로 처리하기 ESC 버튼 누를시 이전 페이지로 이동 함수 util로 빼기 중복으로 사용되고 있습니다. 추가로 다른 PopUP 페이지 혹은 PopUp Component에도 적용하면 좋지 않을까요? ❍ FeedPopUP(다은) isSucess와 getGuestFeed.isSucess 일 때 컴포넌트 구성이 완..
● 2차 목표 그간,, 2차목표를 진행했었는데 포스팅하는걸 잊었으빈다.. ㅠ 오늘은 3차목표를 진행중이어서 오늘 리팩토링했던 부분을 정리해 올립니다. 아래는 그간 진행했던 2차 목표입니다. 대체로 로직분리가 절반이상이었습니다. ❍ PetInfo.tsx (다은) query mutaion 훅으로 분리 handle부분 로직 분리 처리 ❍ PetProfile.tsx (준석) 뭔가 cropper함수와 이미지 처리 다 함수로 뺐으면 좋겠어요 로직분리 ❍ Spin(준석) styled로 처리 ❍ PetContainer (다은) popup 로직 state로 하나로 만 구분해서 쓰자.. 입니다.. 이거 제가 할게요 50줄이 들어드는 매직 여기도 mutation 처리필요합니다 ● 3차 목표 ❍ Info(다은) Error M..
● 3~4일차 작업 분배 ❍ FeedWriteCard(준석) + 스로틀 구현 query mutation 함수 hook으로 처리 ESC 뒤로가기 함수분리 필요해보임 여러번 게시물 버튼 눌렀을 시, 스로틀 적용하면 좋을 것 같음 + 수정도 handleSubmit 부분의 코드 같은 조건문으로 반복 처리 되는 부분 정리할 수 있지 않을까? ❍ useMutation hook 처리(다은) ❍ Popup (다은) 버튼이 1개인 Popup, 버튼이 2개인 Popup으로 컴포넌트를 분히래서 관리하는 것은 어떨까? -> 분리하지 않기로 결정 팝업 메시지를 관리하는게 좋을 것 같다. Prop으로 넘겨주는 값들을 넘겨주지 않으면 기본값이 설정됐으면 좋겠다. ● useMutation hook 처리하기 mutation.fn으로 ..
