Buffer와 Cache의 차이와 GIT SUBMODULE 사용, 도커 트러블슈팅 err_name_not_resolved

만약 이런 질문을 면접에서 받는다면 어떨까?

 

Buffer와 Cache의 차이가 뭔가요?

Cache는 대답한다해도 Buffer는 느낌은 알겠는데 조리있게 답변을 뭐라 말해야할지 모르겠다.

 

Cache는 toRead, Buffer는 toWrite 즉, 목적이 다르다.

지역성과 L1, L2, L3 등 계층적 구조에 대해 설명하면 BEST!

 

Buffer는 영상 스트리밍 버퍼 예시를 들면, 끊김 없는 재생을 위해 미리 일부 데이터를 버퍼링

디스크 버퍼 : HDD/SSD에서 데이터를 블록 단위로 읽고 쓰는 과정에서 임시 저장

 

도커 테스트를 해보며 여러 이미지를 빌드하고, 컨테이너를 만들게 되었는데 궁금한게 

WORKDIR 로 설정한 (예시) /app 이 여러 파일에서 쓰여도 겹치지 않느냐였다.

물론 애초에 격리성이 큰 특징인 서비스이기에 되겠지만 궁금했다. 

 

+ 우리팀은 vue프로젝트인 프론트를 dev/fe라는 브랜치에, spring 프로젝트인 백을 dev/fe라는 브랜치로 관리하는데 이를 pull하고 docker-compose up만 쳐도 실행되게 하려면 문제가 발생한다.

 

내가 프런트, 백 이미지를 빌드하고, 컨테이너 이름을 정하고 그걸 실행하는건 문제없지만 문제는 팀원이 받았을 때 발생.

# 메인 저장소 (예: S12A208)에서 실행
git submodule add -b dev/be <repo-url> backend
git submodule add -b dev/fe <repo-url> frontend

 

git submodule을 활용해 backend/와 frontend/가 각각 dev/be, dev/fe 브랜치에서 가져와지게 할 수 있다고 한다.

 

https://git-scm.com/book/ko/v2/Git-%EB%8F%84%EA%B5%AC-%EC%84%9C%EB%B8%8C%EB%AA%A8%EB%93%88

Git - 서브모듈

 

테스트 해보기

 

새 폴더를 파고 clone 받은 후 서브 모듈을 등록해보았다. 

 

원하는 대로 backend폴더와 frontend 폴더는 잘 생성은 되었는데, 문제는 default 브랜치가 백엔드 파일들이 있던 dev/be 브랜치에서 생성되어서 파일이 중복되는 문제가 발생했다. (폴더 구조 하단에 보이는 gradle 등 파일이 backend에 또있음)

 

실수를 막기 위해 protected로 막고, default를 master -> dev/be 였던 것을 통합 환경 구성을 위해 master 브랜치에서 submodule을 불러올 수 있게 해야한다.

 

 

Gitlab 설정에서 default branch를 master로 변경 후 서브모듈을 추가했다.

잘 적용된 모습을 볼 수 있다. 이제 이를 활용해 Docker-compose.yml 파일을 작성하면 될 것 같다.

 

docker-compose.yml 파일까지 작성하고 

docker-compose up --build로 테스트  성공하고 localhost:5173으로 접속해보았다.

 

컨테이너 환경에서 front-back을 연결하다보니 추가 또는 변경해야하는 수정사항이 많았다.

컨테이너 환경 변수 설정

가장 가능성 높은 원인과 해결 방법부터 순서대로 하는게 좋아보입니다.

1️⃣ 백엔드 컨테이너가 실행 중인지 확인 (docker ps)
2️⃣ Axios의 baseURL이 올바른지 확인 (http://backend:8080 or http://localhost:8080)
3️⃣ Spring Boot에서 CORS 설정이 올바르게 적용되었는지 확인
4️⃣ Vite의 proxy 설정을 추가하여 CORS 문제 해결
5️⃣ MySQL에 로그인할 사용자 데이터가 있는지 확인

 

CORS 설정 추가

 

현재 frontend, backend, mysql 이라는 컨테이너이름으로 구성되어있다. 서버측 WebConfig에 CORS 설정에 frontend:3000 설정이 없어서 추가했다.

 

컨테이너 실행 중인지 확인

 

.env 설정 변경

vue 프로젝트에서 서버로 보내는 axios 요청 경로를 설정한 .env를 기존 http://localhost:8080에서 

 

요청을 보내는 컨테이너 이름인 backend로 변경했다. 

 

Mysql 컨테이너에 로그인할 유저가 있는지 확인

docker exec -it mysql-container-5 mysql -u root -p

 

명령어로 생성한 mysql 컨테이너에 접속하고 설정한 password를 입력하여 접속한다.

 

SHOW DATABASES;

 

주의 database 뒤에 s 붙여야함

 

 

 

확인결과 user 테이블에 아무것도 생성되지 않았다.

 

실수

근데 생각해보니 backend는 컨테이너 이름이지 브라우저에서는 localhost로 접속가능하니 .env에 localhost로 변경해주었다. 

 

name_not_resolved 문제는 해결되었다. mysql 컨테이너에는 잘 넘어가는가 체크할 차례다.

위에 처럼

 

localhost:5173에서 회원가입 후 mysql 컨테이너에 접근해보니 잘 저장된 것을 확인할 수 있다.