본문 바로가기

전체 글26

[Docker] 볼륨과 바인드마운트 개요 컨테이너가 생성된 파일들은 쓰기 가능한 컨테이너 레이어에 저장됩니다. 하지만 컨테이너가 존재하지 않으면 데이터가 유지되지 않습니다. 볼륨을 사용하면 호스트에 파일이 저장되기 때문에 컨테이너가 제거되어도 파일이 유지되게 할 수 있습니다. 볼륨은 무엇일까요? 볼륨은 도커 컨테이너가 생성하고 사용하는 데이터를 영구적으로 유지하기 위한 방법으로 Docker에 의해 관리됩니다. 컨테이너가 제거되어도 삭제되면 안되는 파일들을 저장할 때 사용합니다. 볼륨은 익명 볼륨과 명명된 볼륨으로 나누어집니다. 볼륨 사용 도커를 실행할 때 -v 옵션을 이용하여 사용할 수 있습니다. -v 옵션은 콜론으로 구분된 3개의 필드로 구성됩니다. 예) docker run -d -v my-volume:/temp:ro --rm my-im.. 2022. 8. 23.
[Docker] 기본 명령어 정리 HELP docker --help 빌드 docker build . 이름과 태그 추가 -t NAME:TAG 확인 이미지 확인 docker images 컨테이너 확인 docker ps 실행 종료된 컨테이너 까지 확인 docker ps -a 이미지 실행 docker run IMAGE_NAME 컨테이너에 이름 명시(명시하지 않으면 자동 생성) --name NAME detached mode로 실행 옵션 -d interactive mode로 실행 옵션 -it 종료시 자동으로 컨테이너 제거 옵션 --rm 컨테이너 종료와 재시작 컨테이너 종료 docker stop NAME 종료한 기존 컨테이너 재시작 docker start 제거 이미지 제거 docker rmi IMAGE 컨테이너 제거 docker rm CONTAINE.. 2022. 8. 18.
[Spring] Swagger 설정 중 Failed to start bean 'documentationPluginsBootstrapper’ 오류 발생 개요 Swagger 설정 중 Failed to start bean 'documentationPluginsBootstrapper’ 오류가 발생했습니다. 사용하는 Swagger 버전은 2.9.2 버전입니다. 현재 스프링 버전 2.7.2를 사용하고 있는데 2.6버전부터 matching strategy의 기본값이 PathPatternParser로 변경되었다고 합니다. PathPattern Based Path Matching Strategy for Spring MVC The default strategy for matching request paths against registered Spring MVC handler mappings has changed from AntPathMatcher to PathP.. 2022. 8. 13.
[Nuxt] Nuxt3 TypeError: Cannot read properties of null (reading 'parentNode') 문제 해결하기 개요 Nuxt3로 프론트엔드를 개발하던 중 다음과 같은 에러가 발생했습니다. TypeError: Cannot read properties of null (reading 'parentNode') 루트 페이지가 아닌 다른 페이지에서 새로고침을 한 다음에 vue-router를 사용(to 이용)할 때 해당 오류가 발생했습니다. 오류에 대한 자세한 내용은 nuxt3 issue에 있습니다. Nuxt3를 정적 웹 페이지 생성기로 사용하고 있습니다. SSR을 사용할 때는 아직 해당 이슈가 해결되지 않은 것으로 보입니다. 해결 방법 Nuxt3에는 정적 호스팅을 하는 2가지 방법이 있습니다. Prerendering client-side only rendering client-side only renderin.. 2022. 8. 11.
[Nuxt] Nuxt3 + Vuetify 환경에서 vee-validate + yup으로 입력값 검증하기 개요 프론트에서도 입력값에 대한 검증을 하기 위해 vee-validate와 yup을 사용했습니다. vee-validate는 vue.js에서 form validation을 편하게 해주는 도구입니다. yup은 유효성 검사를 위한 스키마 빌더입니다. vuetify가 기본으로 제공하는 rules로도 유효성 검사를 할 수 있지만 일일히 rules를 만들기 복잡하고 관리하기 어렵기 때문에 vee-validate와 yup을 통해 유효성 검사를 간편하게 해보겠습니다. 기본적인 사용법과 vuetify랑 같이 사용하는 방법을 알아보겠습니다. 환경 "devDependencies": { "nuxt": "^3.0.0-rc.6" }, "dependencies": { "@mdi/font": "^6.9.96", "axios": "^.. 2022. 8. 10.
[Nginx] CORS 설정 개요 CORS 설정을 하지 않아서 배포한 웹 사이트에서 백엔드 API로 접근을 못하는 문제가 발생했습니다. 프론트 개발시에는 Vite를 이용하여 프록시를 설정하였고, 모든 요청이 프록시를 경유하도록 설정하였습니다. 서버와 서버 사이의 요청에는 CORS가 걸리지 않습니다. 프론트는 Cloudflare Pages를 사용하여 정적 웹 페이지 형태로 배포를 했고 Cloudflare Pages에서 _redirects 파일을 통한 프록시를 아직 지원하지 않기에 서버쪽에서 설정을 하였습니다. 현재 백엔드는 Nginx에 리버스 프록시를 설정해두었기 때문에 Nginx에 CORS 관련 내용을 설정하였습니다. 교차 출처 리소스 공유(Cross-Origin Resource Sharing, CORS) 추가 HTTP 헤더를 사용.. 2022. 8. 9.