금백조의 개발 블로그

서론 Docker 웹서버 환경에서 클라이언트 ip를 얻으려는 중에 이슈가 발생했습니다. Docker 내부에서 클라이언트 ip를 얻으려해도 도커 내부에 설정된 ip가 반환이 되었습니다. 이를 해결하기 위해 리버스 프록시를 구성하여 프록시를 통해 클라이언트 ip를 가져와서 해결했습니다. 실제로 저는 웹서버에서 프록시 ip를 얻는 업무만 수행했지만 리버스 프록시를 예제로 구성하여 해보고 싶은 마음에 해당 포스팅을 준비하게 되었습니다. 아래 예제는 다음과 같은 상황을 가정합니다. 가정 nginx 를 이용해 리버스 프록시 구성 windows wsl linux (윈도우 리눅스 서브 시스템)에 nginx 설치 https 인증서는 있다고 가정 (예제 설명엔 abcde.pfx 로 되어있음.) 웹서버는 .NET Core라..

문제 DeleteModal.vue에서 Modal.vue을 import 하려고 하는데 다음과 같은 에러가 발생했습니다. 분명 {경로} 에 나타나는 부분에 Modal.vue 파일이 있었는데도 에러가 발생했습니다. 오늘은 이에 대한 해결책에 대해 포스팅하겠습니다. Module not found: Error: Can't resolve ~ Module not found: Error: Can't resolve '@components/Modal.vue' in '{경로}' ERROR in ./src/components/DeleteModal.vue?vue&type=script&lang=js (./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node..

현상 Vue 강의를 보며 프로젝트를 진행하던 중 아래와 같은 에러메세지가 크롬 콘솔 창에 나타나면서 자식 컴포넌트가 화면에 나타나지 않았다. [Vue warn]: Property "type" was accessed during render but is not defined on instance. 원인 부모 컴포넌트에서 type 객체를 자식 컴포넌트한테 전달해주려 하는데 자식 컴포넌트에 type이 props 내부에 선언되지 않은게 원인이었다. parentComponent.vue (부모 컴포넌트) childComponent.vue (자식 컴포넌트) 해결 자식 컴포넌트 props 내부에 type을 선언해준다. childComponent.vue (자식 컴포넌트)

현상 vue router를 설치하여 router별 .vue 페이지를 만드는데 index.vue라는 이름으로 파일을 만들고 코드를 작성하니 태그 부분에서 아래와 같은 에러 메세지가 발생했다. "Component name “index” should always be mutli-word" [에러 화면] 원인 eslint의 기본 규칙이 컴포넌트 이름을 정할 땐 두 개 이상의 단어를 사용하는 규칙이어서 컴파일 에러가 났다. 해결 방법 1) .vue 파일 이름을 한 단어가 아닌 두 개 이상의 단어로 지정한다. (예 : myIndex.vue) 방법 2) eslint 규칙 중 vue/multi-word-component-names 규칙을 off로 변경하기 위해 .eslintrc.js 파일의 rule 부분에 아래 규칙을..

서론 input 태그들을 querySelectorAll로 가져와 value를 초기화해주려고 했는데 radio type이 아닌 input만 가져와서 초기화를 해야했습니다. 이 과정에서 알게된 not 연산자를 이용한 querySelectorAll 필터링 방법에 대해 소개하겠습니다. 본론 AND 조건 해석 : input 태그 중 radio type이 아니고 class가 test가 아닌 input 전부 가져오기 const inputs = document.querySelectorAll("input:not([type='radio']):not([class='test'])") OR 조건 해석 : input 태그 중 radio type이 아니거나 class가 test가 아닌 input 전부 가져오기 const input..

현상 다음과 같은 에러 메세지 발생 ~ is declared but its value is never read.Vetur(6133) 원인 선언한 메서드를 return에 적지 않아서 발생하는 문제 선언한 메서드를 이벤트에 연결했는데도 원하는대로 동작하지 않을 때 return에 빼먹었는지 확인하자! 해결 return 에 선언한 메서드 추가 [문제 코드] [해결 코드]

[문제 발생] 평화롭게 Vue를 학습하려고 프로젝트를 생성함과 동시에 App.vue 파일에서 다음과 같은 에러를 만났다. Parsing error: No Babel config file detected for [프로젝트 경로]\src\App.vue. Either disable config file checking with requireConfigFile: false, or configure Babel so that it can find the config files. 개발 환경 - VS Code (Extension : ESLint, Vetur, Vue 3 Snippets) - Vue3 느낌이 쌔하지만 해결해보자!!! [원인] vue-eslint-parser 파서에 의해 발생. App.vue가 Babel에..

현상 Visual Studio 2019 환경에서 어제까지만 해도 잘되던 .NET Core Docker 디버깅이 오늘부터 안되는 현상 발생 문제 해결 과정 1.아래의 스택오버플로우에 나오는 다양한 해결책을 시도해보았으나 모두 실패… https://stackoverflow.com/questions/70374907/the-visual-studio-2022-error-failed-to-launch-debug-adapter-additional-informa 2.오늘 설치된 윈도우 업데이트에 문제가 있는가 해서 업데이트를 전부 삭제하여 원복했지만 동일한 에러 발생 3.더욱 정확한 원인을 파악하기 위해 디버그 어댑터 호스트 로그를 확인했더니 아래와 같은 에러 로그를 확인 (이때 부터 뭔가 해결할 수 있을 거 같은 희..