• 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 외에서는 사용할 수 없다고 했다. 다른 해결 방법이 없을까 구글링을 해보았지만 찾지 못해서 우선은 이전 코드로 모두 변경해놓았다.

• 토요일에 채팅 맞출 준비해놓자!