ice rabbit programming

웹 개발을 하다 보면 에러를 상당히 자주 접하게 된다. 에러 코드를 보면 500, 400, 404, 401 등 자주 접하는 코드들은 의미를 바로바로 알게 되지만, 가끔 생소한 경우도 있다. 본인도 개발하다가 411 에러는 처음 봐서 포스팅으로 작성한다. 411 에러는 Length Required로, HTTP 1.1부터 발생하는 에러인데 웬만해서는 기본 헤더에 length가 지정되어 있으므로 나올 일이 많지 않다. 이번에 본인은 curl 요청을 보내는 중에 발생하였다. 해결법은 쉽다. Content-Length를 헤더에 추가해주면 된다. curn -H "Content-Length: 0" http://myurl.com

https://kr.vuejs.org/v2/guide/typescript.html#%ED%94%8C%EB%9F%AC%EA%B7%B8%EC%9D%B8%EA%B3%BC-%ED%95%A8%EA%BB%98-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0-%EC%9C%84%ED%95%9C-%ED%83%80%EC%9E%85-%ED%99%95%EC%9E%A5 TypeScript 지원 — Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 kr.vuejs.org Vue 3.0부터는 아예 TypeScript를 지원하지만, Vue 2.0도 공식 가이드 등에서 TypeScript 사용을 지원하고 있다. Vue를 사용하다 보면, 플러그인을 Vue.use로 포함하고, 전역적으로 Vue.plugin..

vue 앱의 npm 패키지들을 업데이트 하다가, TypeError: this.getOptions is not a function 라는 에러가 발생하는 것을 확인하였다. 찾아보니, sass-loader의 최신 버전이 11인데, 이것은 vue 3.0 이상에서만 동작하는 것이 원인이었다. 일전의 글에서도 언급했듯이, 아직 vuetify 등 UI 프레임워크들이 vue 3.0를 지원하지 않기 때문에(공식 사이트 목표 배포는 2021 3Q이다) 본인은 2.6.12를 아직 사용하고 있다. 그래서 sass-loader를 10 버전을 이용해야 한다. package.json 혹은 yarn.lock에 씌어 있는 버전을 ^10.0.2로 수정한 후에 npm install / yarn install을 실행하거나, 아예 npm u..

Git에서 취소하고 싶은 경우는 생각보다 자주 있다. 이 때 사용하는 것이 reset 명령어이다. add 취소하기 기본적으로 git에서 파일들은 unstaged 상태에 있고, git add 명령어를 통해 stage에 올린다. 이는 commit 이전에 임시로 올리는 공간이라고 생각하면 된다. add를 취소하기 위해서는 다음 명령어를 입력하면 된다. git reset HEAD \[optional : 파일명\] 만약 파일명을 입력하지 않으면 올라갔던 파일 전체가 내려온다. (주의 : rm 명령어는 add의 반대가 아니다! git에서 이 파일을 제거한다는 의미이다.) commit 취소하기 add로 추가한 파일들은 git commit 명령어로 commit한다. commit을 되돌리고 싶은 경우는 commit 자체..

본인은 Vue에서 UI 프레임워크로 Vuetify를 애용하고 있다. 물론 본질적으로는 Vue의 컴포넌트, 이벤트 등을 이용하여 구현된 것이기 때문에 타 프레임워크를 사용하거나, 직접 만들어도 원리는 같다. 입력을 위해서 v-text-field 등을 사용하는 경우가 많은데, 유효성 검사를 위해서 rules 속성을 사용하는 경우가 많다. 가장 많이 사용하는 비었는지 여부부터 해서, 정규식을 사용하기도 한다. 흔히 회원 가입 창에서 보는, 맞지 않는 규격일 경우에는 빨간 테두리가 쳐지면서 에러 문구가 아래에 출력되는 것이 디폴트 동작이다. (참고로 rules 속성에는 boolean 함수/변수들을 넣을 수 있으나, async-await(Promise)는 넣을 수 없다. 우회하는 방법이 있으나 이는 추후에 시간이..

로드 밸런싱은 서버에 가해지는 부하를 분산해주는 컴퓨터 네트워크 기술로, 서버 풀(pool) 앞에 위치한다. 본인은 학부 때 클라우드 VM을 사용하면서 처음 접해보았다. Scale Up vs Scale Out 서비스 초창기, 혹은 개발 단계에서는 서버를 한 대만 구축할 수 있다. 이 때는 트래픽이 많지도 않고, 한 대 뿐이므로 분산할 수도 없다. 하지만 점점 커지면서, 이러한 요청들을 처리(수행)하기에 빡빡해지는데, 보통 두 가지의 선택지가 있다. Scale Up : 서버 자체의 성능을 확장하는 것으로, 쉽게 말하면 서버의 사양을 높이는 것. RAM 메모리 용량을 키운다거나, CPU 성능을 높이는 등이다. Scale Out : 여러 서버를 증설하여 운영하는 것이다. 즉, 같거나 비슷한 수준의 서버를 여러..

docker run을 할 때 -v 옵션을 주어 volume을 줄 수 있다. 그런데 자꾸 이런 에러가 발생할 때가 있다. Are you trying to mount a directory onto a file (or vice-versa)? check if the specified host path exists and is the expected type. 근본적으로는 이것은 -v로 넘겨주는 것이 파일이 아니라 디렉토리라 발생하는 에러이다. 아마 이 에러를 검색해서 들어오신 분은 volume으로 넘겨주는 파일명을 잘못(오타를 냈거나 잘못 지정했거나) 적었을 확률이 크다. 만약 넘겨주는 파일명이 존재하지 않으면, 자동으로 mkdir이 된 후에 docker run이 실행되기 때문에.. 엉뚱한 위와 같은 에러가 발..

CSS, SCSS를 사용할 때 color 값 지정은 굉장히 많이 발생한다. 자주 쓰이는 색깔들은 표준적으로 정해져 있기도 하지만, 투명도를 조절하거나 정해져 있지 않는 경우에는 아래와 같이 hex값(#ffffff 등)이나 RGBA(rgba(255,255,255,0.5) 등)를 사용하여 지정한다. .element { color: #ffffff; } 예시로 든 것은 그냥 흰색이지만, 만약 키워드가 없는 색상을 굉장히 많이 지정해야 한다면? 프로그래밍을 맨 처음 배울 때의 변수의 필요성과 같이, 반복 및 유지보수 용이성을 위해서는 색상을 키워드로 하는 것이 좋을 것이다. vuetify와 같은 UI 프레임워크를 사용한다면, 이전에 vuetify에서 색상 지정하는 글에서 썼던 것처럼 color를 지정하고, cla..