동고 팔자 상팔자

한동안 하루하루 먹고 살기 바빠서 책 읽을 여유가 없었는데 이제 좀 여유가 생겼다. 스스로 바쁘게 산탓도 있지만 오랜만에 주말내내 여유롭게 책도 읽고 드라마도 보고 낮잠도 즐기니 세상을 다 가진것 같다. 무코다 이발소는 한때 탄광산업으로 번성했지만 지금은 소멸위기에 놓인 도마자와 마을과 주민들의 이야기다. 무코다 이발소는 도마자와 마을에 있는 이발소이고 이발소에 대한 이야기는 아니다. 일본도 그렇고 한국도 그렇고 농촌 소멸위기는 공통된 사회문제이다. 책을 읽는 내내 고향 생각, 어릴적 생각이 많이 나고 소설속 모습과 많이 오버랩되었다. 동네 사람들은 한다리 건너면 아는 사이고, 주변 이웃집 문은 항상 열려있었고 마치 우리집인냥 마음껏 드나들며 거리낌없이 지내던 시절. 그게 당연한줄 알았던 시절이었는데 지..

Sentry는 로그 취합 및 분석 도구이자 모니터링 플랫폼이다. Front-End 로그 수집에도 많이 사용되는 플랫폼이다. 다양한 프레임워크를 지원하고, 로그 시각화 도구까지 지원한다. Saas 형태로도 제공하고 onpromise 방법도 제공한다. docker compose나 helm chart를 사용하여 쉽게 설치할 수 있다. 개인 서버가 있고, freetier가 부족하면 직접 설치해서 사용하는 것도 좋은 선택이다. Self-Hosted 설치 Docker compose 또는 helm chart를 사용하여 설치한다. 가이드 : https://github.com/getsentry/self-hosted git : https://github.com/getsentry/self-hosted helm chart :..

깃허브 octokit 라이브러리 사용 에러 조치 빌드 환경 : Vite rest api를 사용하려면 octokit 설치할 필요 없고 @octokit/core만 설치해도 된다. yarn add @octokit/core Vite에 아무 설정도 하지 않으면 아래 에러가 발생한다. caught ReferenceError: global is not defined at index.mjs:657:16 vite.config 파일에 아래 global 설정 추가 define: { global: {}, }, global 설정 추가했는데 아래 에러가 뜨면 dex.mjs:1165 Uncaught TypeError: Cannot read properties of undefined (reading 'prototype') at in..

vercel에 간단한 SPA 앱을 만들어서 배포했는데 아래와 같은 에러가 발생하였다. test.com/about 같은 하위 URL로 접근했을 경우, 서버(vercel)는 해당 URL을 처리하는 방법을 모른다. SPA의 라우팅 처리가 아닌 해당 리소스를 찾으려고 하기 때문에 404 에러가 발생하는 것이다. 이럴 때는 vercel에 내 SPA 앱의 인덱스 경로를 설정해 주면 된다. vercel rewrites를 참고해 vercel.json에 rewrite 설정을 하면 된다. { "rewrites": [{ "source": "/(.*)", "destination": "/" }] } 위의 rewrites 방법은 단순하지만 단점이 있다. 어떤 이유로 이미지나 번들, html에 직접 접근하지 못한다. 이럴 경우에는..

validator는 null을 검사하지 않고 순서를 보장하지 않는다. 아래 클래스처럼 벨리데이터를 사용하던 중 의문이 든 내용이다. class User { @Size(min = 1, max = 50) @Pattern(regexp = "^[a-zA-Z]$") private String name; @Min(value = 18) private int age; @Min(value = 130) private int tall; public User(String name, int age, int tall) { this.name = name; this.age = age; this.tall = tall; } } - name에 null이 들어와도 에러가 발생하지 않는다. @size, @pattern 동작 안 함 - 클래스..

여러 프로퍼티를 한 번에 watch 하는 방법 아래와 같은 코드가 있다. car와 coffee 값이 변하면 동일한 doSomething 함수를 호출한다. 여러 개를 watch 해야 하는 상황에서 모든 프로퍼티마다 watch를 선언하지 않고 한 번에 하는 방법이 있다. watch: { car: function (val, oldVal) { doSomething(); }, coffee: function (val, oldVal) { doSomething(); }, // .. so on } Vue 3 Vue 3에서는 아래처럼 할 수 있다. import { watch, ref } from 'vue'; export default { setup(() => { const car = ref('car'), coffee = ..

평소에 주로 다크모드만 사용하는데 근시와 난시를 유발할 수 있다니. 내용을 보면 중고등 때 다 배운 내용들이다. 그렇다고 다크모드를 포기할 순 없는 노릇이니 자기 전에 누워서 핸드폰 하는 버릇을 고치거나 시간을 줄이던가 해야 할 듯. 크랩에서 이 내용이 컨텐츠로 나왔는데 내용을 정리하면, 1. 다크 모드는 근시와 난시가 유발될 수 있는 것은 맞다. 다크 모드를 쓰게 되면 빛의 양이 줄어들기 때문에 더 잘 보기 위해서 눈의 조절력이 더 많이 소모된다. 2. 빛이 줄어들게 되면 동공이 더 확장된다. 확장이 되면 눈 안에 들어온 빛들이 한곳에 모이지 못해서 깨끗하고 선명한 상을 만들지 못한다. 그렇게 되면 눈 안의 수정체의 위치가 약간 앞으로 이동을 하게 되고 근시가 유발될 수 있다. 근시가 유발되는 환경에서..

git gone 명령어를 만들어서 로컬 브랜치들 정리해보자 보통 이미 반영 또는 머지된 원격(remote) 브랜치들은 삭제된다. 하지만 그 브랜치들을 체크아웃(checkout)한 로컬 브랜치들은 여전히 우리 로컬에 존재한다. 이 브랜치들을 정리하지 않으면 로컬에 무수히 많은 브랜치들이 남게 되는데 이 브랜치들을 편하게 삭제할 수 있는 방법이 있다. 트래킹하는 원격 브랜치가 없는 로컬 브랜치는 지워지지 않으니 안심하고 사용해도 된다. git gone 명령어를 새로 만들 거다. git config 명령어를 통해 바로 등록해도 alias를 등록해도 되고, gitconfig 파일을 열어서 직접 입력해도 된다. 방법 1) config 명령어로 바로 등록 git config --global alias.gone "!..

깃허브에서 파일 아이콘 적용하기 크롬 확장 프로그램에서 귀여운 프로그램을 발견했다. 바로 깃허브 사이트에서 파일 확장자에 따라 아이콘을 적용해서 보여주는 프로그램인데 적용하면 귀엽고 가독성도 좋아진다. File Icons for GitHub and GitLab 익스텐션 설치 후, 적용하면 아래처럼 파일 아이콘이 적용된다. 조만간 이 귀여운 크롬 익스텐션 개발에 대해서 알아봐야겠다.

delete 명령어를 사용하여 k8s pod를 삭제했는데 계속 생성되는 pod를 삭제하는 방법 만약 pod를 삭제했는데 다시 생성된다면 pod가 deployment, job 등의 워크로드에 의해 관리되고 있는 건 아닌지 확인해봐야 한다. pod를 관리하는 워크로드들은 아래와 같다. - ReplicationController - ReplicaSet - Deployment - StatefulSet - DaemonSet - Job - CronJob 만약 위의 워크로드에 의해 생성되고 관리되고 있는 pod라면 위 워크로드를 삭제하면 pod도 함께 삭제된다. 해당 정보는 metadata.ownerReference를 보면 알 수 있다. 아래의 경우를 예를들면 해당 pod는 my-repset ReplicaSet 워크..

axios v1.x 버전의 몇 가지 변경점을 살펴보자 axios 버전이 v0.x에서 v1.x으로 업데이트되었다. v0.x에서 오랫동안 업데이트되지 않고 있었는데 한 번에 v1.x이 릴리즈 되었다. 당연히 메이저 버전이 올라갔으니 바뀐 사항들이 많을 것이고, 기존에 동작하던 기능들이 동작하지 않을 수도 있다. semantic-versioning에도 메이저 버전 변경 시에는 기존 API가 삭제/변경되거나 호환되지 않을 수 있다고 나와있다. Major Version: 기존 API의 변경/삭제로 update하면 동작하지 않을 수 있다는 경고의 의미 Minor Version: 이전 버전과 호환되는 방식으로 API가 추가되었으니 살펴보라는 의미 Patch Version: 이전 버전과 호환되는 버그 수정을 했을 경우..

JSONP가 무엇이고 어떻게 사용하는지 알아보자 JSONP(JSON with Padding)는 cross-origin 도메인으로의 요청을 우회할 때 사용되는 방법이다. 예를 들어 www.abc.com에서 www.example.com을 요청하는 경우를 말한다. JSONP는 단, JSONP cross-origin 요청이기 때문에 안전하지 않다. 권장되는 접근방식은 CORS이다. 참고 https://stackoverflow.com/questions/2067472/what-is-jsonp-and-why-was-it-created/2067584#2067584

몽키패치(Monkey patch)가 무엇인지 알아보고 예제와 단점을 알아보자 몽키패치란(Monkey patch) 몽키패치는 원래 소스코드를 변경하지 않고 실행 시 코드 기본 동작을 추가, 변경 또는 억제하는 기술이다. 쉽게 말해 어떤 기능을 위해 이미 있던 코드에 삽입하는 것이다. 자바스크립트의 endwWith 함수를 예를 들어보자. 이 함수는 어떤 문자열에서 특정 문자열로 끝나는지를 확인할 수 있으며, 그 결과를 true 혹은 false로 반환한다. 만약 이 함수가 없었다면 이 기능을 어떻게 구현했을까 첫 번째 방법은 유틸리티 객체를 만드는 것이다. var Utility = { endsWith: function(string, suffix) { return string.indexOf(suffix, str..

오리엔트 특급살인(2판)(애거서 크리스티 추리문학 베스트 2) 포와로는 육감이 비상한 탐정으로, 완벽한 추리 실력을 자랑한다. 포와로는 터키의 이스탄불에서 프랑스의 칼레를 향해 떠난 오리엔트 특급열차에 타게 된다. 오리엔트 특급열차에는 14명의 승객이 타고 있는데, 이 열차가 폭설 때문에 정지하고 있을 때 한 사람이 살해당한다. 아무도 열차를 빠져나갈 수는 없다. 게다가, 승개들은 모두 완벽한 알리바이를 가지고 있다. 그렇다면 범인은 어디로 사라진 것일까? 추리소설의 여왕 애거서 크리스티의 작품 중 명탐정 에르큘 포와로가 등장하는 6번째 작품으로, 자신이 뽑은 best 10에도 들어갈 만큼 크리스티 여사 자신도 좋아했던 작품이기도 하다. 작품내의 상황은 구름속의 죽음이나 나일강의 죽음과 같이 범인이 빠져..

console.log 사용할 때 시간 출력하는 방법 2가지 방법 1) (크롬) 브라우저 타임스탬프 기능 사용 개발자 도구 -> 설정 -> Show timestamps 로그 앞에 시간이 출력됨 방법 2) console.log 수정 몽키패치로 console.log를 수정하는 방법이다. 이렇게도 가능하다는 거지 권장하는 방법은 아님 var log = console.log.bind(console); console.log = function(data) { const timestamp = `[${new Date().toUTCString()}]`; log(timestamp, data); }; console.log(123) // [Fri, 30 Sep 2022 00:38:45 GMT] 123 파라미터를 여러 개 받아서..