미니프로젝트4

프론트엔드
백엔드 요청 ( 회원가입,중복확인 기능 붙이기)
id 중복확인 제이슨 리턴 요청형식 전달
{
"available": true,
"message": "사용 가능한 아이디입니다."
}
{
"available": false,
"message": "이미 사용 중인 아이디입니다."
}

로그인 시 이메일이 아니라 id입력식으로 변경 ( @없어도 입력하능하게)

인풋타입 text로 변경

파비콘 변경

백엔드랑 프엔 리다이렉트 연결
방화벽해제
윈도우 방화벽 예시

제어판 → Windows Defender 방화벽 → 고급 설정 → 인바운드 규칙 → 새 규칙 → 포트(3000, 8080 등) 허용
백엔드가 리액트 5173포트 연결하는거니 5173포트 열어두기

다른컴퓨터니 CORS오리진 허용해달라고 하기

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
            .allowedOrigins("http://192.168.0.10:3000") // 리액트 서버 주소
            .allowedMethods("GET", "POST", "PUT", "DELETE");
    }
}

아이피 주소 ipconfig로 확인해고 엔드포인트 백엔드 전달

리다이렉트할때, 서버 올릴때 오류안나게하려면 리액트서버키고, 디비서버키고 백엔드 서버켜져야함 이제.

//
로그인하면 메인페이지로 가게 하기
navigate("/");

아이디 최소 입력하는 문자 길이 지정
비밀번호도 최소길이지정

로그인하면 배너에 로그아웃뜨게하고 로그아웃 누르면 로그아웃되게하기

네비바 컴포넌트 따로 만들어서 관리하기 (로컬스토리지로 토큰활용)