-
Notifications
You must be signed in to change notification settings - Fork 1
TIL 2월 16일
daeun heo edited this page Feb 16, 2023
·
12 revisions
- somthing..
- somthing..
- somthing..
- somthing..
- somthing..
- somthing..
- somthing..
- somthing..
- somthing..
- somthing..
- somthing..
- somthing..
- 18:00 ~ 19:00 스마게 티타임
- 14:00 ~ 23:00 모각코 (with 김현우, 박규현, 백종인)
-
현우님과 함께 API 연결
- 친구 조회
- 친구 요청
- 친구 취소
- 비밀번호 변경
- 서버 생성
-
모달의 background 누르면 모달 꺼지기 구현
-
[피드백 반영] public에 있던 이미지들을 assets폴더로 전부 옮기고, styled-components에서 절대 경로로 이미지 불러오기 → 해결 못해서 결국 상대 경로로 불러오도록 설정했음 (아래는 폴더구조)
assets `-- fonts `-- icons `-- images `-- mask
-
[피드백 반영] 정규표현식 코드 수정 (match → test)
const validateEmail = (email: string) => { return /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i.test( email ); }; export default validateEmail;
-
[피드백 반영] Register.tsx에서 step 코드 변경하기 → Array Lookup table 이용하였음
const Register = () => { const { step, resetStep } = useRegisterStore(({ step, resetStep }) => ({ step, resetStep, })); useEffect(() => { resetStep(); }, []); const getRegisterComponent = [RegisterStep1, RegisterStep2, RegisterStep3]; const Component = getRegisterComponent[step - 1]; return ( <LoginContainer> <HeaderHelmet title="회원가입 | Discord" /> <AuthModal width={480}> <Component /> </AuthModal> </LoginContainer> ); };
-
- styled-components 내에서 상대경로로 불러오는 방법이 없을까? 분명 있을 것 같은데.. 좀 더 찾아봐야겠다.
- 오늘 페어 프로그래밍(?)했는지는 애매모호하지만, 음 어쨌든 혼자 하는 것보다는 역시 같이 코딩하는 것이 배울 것도 있고 재밌는 것 같다.
- hook은 component function내에서만 사용할 수 있다!
피드백을 주셨을 때 api를 보낼 때 공통적으로 header를 주는 부분을 axios의 interceptor를 사용하면 자동으로 header를 줄 수 있다고 하여 적용해보았는데, header에서 넣어주는 accessToken이 zustand의 useUserStore에서 가져오는 값이라서 에러가 발생했다.
clientApi.interceptors.request.use( (config) => { const { userInfo } = useUserStore(); config.headers["Authorization"] = "Bearer " + userInfo.accessToken; return config; }, (err) => { console.log(err); return Promise.reject(err); } );
그래서 구글링을 해보니 hook은 component function 외에서는 사용할 수 없다고 했다. 다른 해결 방법이 없을까 구글링을 해보았지만 찾지 못해서 우선은 이전 코드로 모두 변경해놓았다.
- 토요일에 채팅 맞출 준비해놓자!