팀 프로젝트에서 서버 측과 연동하기 위해 스프링부트와 낮부터 씨름하고 있는데 계속 에러가 났다. 문제 상황 빌드 과정 전체가 에러의 연속이었는데, 어찌어찌 헤쳐나가다 mysql을 깔래서 깔고 서버를 실행시켰더니 에러 발생. [Spring Boot] Access denied for user 'root'@'localhost' (using password: YES)위 에러메시지를 중심으로 찾아보니 mysql 로그인 오류라고 한다. 그러나 해당 메시지로 구글링을 하면 mysql 자체에서의 해결법이 나오고, 나처럼 스프링부트 환경에서 이런 에러를 해결한 경우가 없어서 조금 헤맸다. 해결법 gradle 사용 시 스프링 부트에서 mysql 연동을 하기 위해서는 src/main/resour..

react app gets 404 when fetching url parameter 이 글을 쓰게 만든 문제 상황 자체는 위 키워드와 같았다. 빌드한 리액트 프로젝트에 url 파라미터를 붙여서 접속하면 자꾸 404가 뜨는 것. 아래에서 자세히 쓸 거지만... 주요 원인이 클라이언트 사이트 라우팅 등과 관련된 것 때문이라는 걸 몰라서 더 헤맸다. 때문에 나와 같은 상황에 처한 누군가가 비슷한 키워드로 서치했을 때 원인을 바로 파악했으면 하는 마음에 내가 서치했던 키워드를 글 상단에 추가해 보았다. 문제 상황 나의 토이프로젝트인 사이퍼즈 성향 테스트는 카카오톡으로 테스트 결과를 공유하는 기능이 있었다. 즉 해당 버튼을 누르면 카카오톡으로 결과 페이지 url을 전송해서 다른 사람들로 하여금 접속할 수 있게 하..

브라우저 창에 꽉꽉 차는 화면.Height를 full로 하기 위한 여정을 기록한다.먼저 간단하게 전체 화면을 구성하는 컨테이너 div태그의 height를 100vh로 주었다.vh란, 뷰포트 높이에 따라 달라지는 단위이다. 1vh는 뷰포트 높이의 1%이므로, 100vh는 뷰포트의 100%, 즉 full 높이를 말한다고 볼 수 있다.이렇게 하니 정말 화면이 꽉꽉 차 보인다.하지만 모바일 화면으로 접속해 보니 이상했다.간격이 적용되지 않는 문제는 둘째치고, 화면이 묘하게 아래로 처져 있었다.찾아보니 모바일에서는 vh 계산을 할 때 상단에 위치한 url바와 하단의 네비게이션바의 높이까지 포함하여 계산한다고 한다. 그래서 조금씩 어긋나게 되는 것.구글링을 통해 해결방안을 구했다.먼저 url바와 네비게이션바의 높이..

프로젝트를 빌드하기로 했다. 구글에 치니, netlify를 이용하면 간단하게 깃허브 프로젝트를 빌드할 수 있다는 말이 굉장히 많았기에 netlify 이용! 회원가입하고 깃허브에서 빌드할 프로젝트 레포지토리를 선택 후, 빌드한다. 빌드 세팅은 이렇게 해 주었다. 사실 여러 에러를 겪은 결과인데, 처음엔 Build command에 npm run build만 저장하고 빌드했다. 그랬더니 에러 발생. 각 버튼을 클릭하면 에러 이유를 알 수 있는 Deploy log를 볼 수 있다. 쭉쭉 내려 보니 Treating warnings as errors because process.env.CI = true.라는 문구와 함께 컴파일 실패 문구가 떠 있었다. 구글링해보니 빌드 명령어를 npm run build에서 CI=fa..