동고 팔자 상팔자

깃허브에서 파일 아이콘 적용하기 크롬 확장 프로그램에서 귀여운 프로그램을 발견했다. 바로 깃허브 사이트에서 파일 확장자에 따라 아이콘을 적용해서 보여주는 프로그램인데 적용하면 귀엽고 가독성도 좋아진다. 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 파라미터를 여러 개 받아서..

axios-extensions를 사용하여 axios http 요청에 캐시를 적용해보고, 어떻게 캐시를 적용하고 있는지 구현 코드를 살펴보자 1. axios-extensions를 사용하여 axios에 캐시 적용 axios-extensions 설치 npm install axios-extensions --save axios-extensions에서 제공하는 cacheAdapterEnhancer를 axios 어답터에 적용 import axios from 'axios'; import { cacheAdapterEnhancer } from 'axios-extensions'; const http = axios.create({ // enabledByDefault는 캐시 사용 디폴트 설정 // default 값은 true이..

reduce와 스프레드 연산자(Spread syntax)를 함께 사용하는 걸 피해라 자바스크립트의 reduce는 매우 강력한 내장 함수이다. 배열의 덧셈, 곱셈 등의 연산에 많이 사용되지만 자유도가 높아서 map, filter 등의 함수도 모두 reduce로 구현할 수 있다. 하지만 reduce 사용 시 주의해야 할 점이 있다. 그건 바로 reduce와 스프레드 연산자를 함께 쓰지 않는 것이다. 다음 코드를 예로 들어보자. const arr = [ { id: "ironman", name: "Tony Stark" }, { id: "hulk", name: "Bruce Banner" }, { id: "blackwidow", name: "Natasha Romanoff" }, ]; const superheroes..

마이 시스터즈 키퍼 쌍둥이별 중요한 윤리적 논쟁들을 제기하는 조디 피콜트의 소설『마이 시스터즈 키퍼: 쌍둥이별』. 백혈병에 걸린 언니를 치료하기 위해 태어난 소녀 안나가 자신의 권리와 존재를 찾아가는 과정을 그려내었다. 장기 기증, 맞춤아기, 자녀에 대한 부모의 통제권 등 윤리적 논란이 될 만한 이슈들을 소재로 다루고 있다. 각 인물들이 화자가 되어 자신의 시점에서 이야기를 이끌어간다. 안나는 백혈병에 걸린 언니 케이트를 위해서 유전자를 수정하여 태어난 아이다. 안나는 태어난 직후부터 언니에게 필요한 제대혈, 백혈구, 줄기세포, 골수 등을 제공해왔고, 그런 삶과 역할에 대해 한 번도 도전한 적이 없었다. 이제 열세 살이 된 안나는 다른 평범한 10대들처럼 자신이 누구인가를 질문하기 시작한다. 언니와의 관..

html2canvas는 어떻게 화면을 캡처하는지 코드를 통해 알아보자 html2canvas는 자바스크립트로 화면을 캡처할 때 많이 사용되는 오픈소스이다. 깃헙에 어떻게 동작하는지 아래처럼 나와있다. DOM과 스타일을 적용하여 캔버스 이미지로 그린다고 되어있다. 실제 사용법도 간단하다. 캡처 대상 element와 옵션만 설정하면 promise로 캔버스를 반환한다. jspdf 라이브러리를 통해 화면을 통째로 PDF로 내보낼 때도 이 오픈소스를 이용하기도 한다. (참고. 자바스크립트로 PDF 내보내기) html2canvas는 어떻게 element를 캔버스로 만들고 있는지 코드를 살펴보았다. 코드는 v1.4.1 기준이다. 1) 디버깅 모드 기본적으로 logging 옵션(default : true)을 지원한다. ..

자바스크립트로 PDF 생성 및 화면 내보내기 자바스크립트 화면 캡처에 이어 PDF 내보내기이다. PDF 생성은 jsPDF 라이브러리를 사용할 것이다. 간단한 텍스트, 표 생성 및 한글 깨짐 현상 해결 및 화면(dom 영역)을 캡처하여 PDF로 저장해보자 1. 기본 옵션 확인 및 PDF 생성. 한글 깨짐 현상 해결 jsPDF 설치 npm install jspdf --save # or yarn add jspdf 간단한 jsPDF 설정 및 문자열 출력 import { jsPDF } from "jspdf"; const doc = new jsPDF({ orientation: "p", // p: 가로(기본), l: 세로 unit: "mm", // 단위 : "pt" (points), "mm", "cm", "m", "..

어제, 오늘 수리남 몰아서 봤는데 정말 재밌다. 얼마전 공개된 '서울대작전'과 비교할 수 없을 정도이다. (서울대작전은 미술도 어색하고 카매라 무빙도 일부러 그렇게 찍은건지 촌스럽고 이상해서 끝까지 못봤음) 이 드라마가 실화라는게 더 믿기지 않았는데, 어디까지가 실화고 얼마나 각색한건지 살펴봤다. 2000년 초에 있었던 실제 이야기인데, 먼저 황정민이 연기한 역할은 조봉행이라는 인물이다. 목사 컨셉으로 나오는데 캐릭터 분위기가 영화 아수라의 시장 역할과 거의 비슷했다. 이런 연기에 최적화된 배우인 듯. 하정우가 연기한 인물은 K씨인데, 엄청난 베짱을 지닌 사람이다. 민간인이라고 믿을 수 없을 정도 베짱을 가졌는데 실제로도 그랬다고 한다. 조직내에 언더커버로 침투했을때 조직원에게 정체를 들켰는데 오히려 적..

토르: 러브 앤 썬더 "신을 죽이는 자, 신이 상대한다!" 슈퍼 히어로 시절이여, 안녕! 이너피스를 위해 자아 찾기 여정을 떠난 천둥의 신 '토르' 그러나, 우주의 모든 신들을 몰살하려는 신 도살자 '고르'의 등장으로 '토르'의 안식년 계획은 산산조각 나버린다. '토르'는 새로운 위협에 맞서기 위해, '킹 발키리', '코르그', 그리고 전 여자친구 '제인'과 재회하게 되는데.. 그녀가 묠니르를 휘두르는 '마이티 토르'가 되어 나타나 모두를 놀라게 한다. 이제, 팀 토르는 '고르'의 복수에 얽힌 미스터리를 밝히고 더 큰 전쟁을 막기 위한 전 우주적 스케일의 모험을 시작하는데...7월 6일, 우주 최고의 ‘갓’ 매치가 시작된다! 평점 5.0 (2022.07.06 개봉) 감독 타이카 와이티티 출연 크리스 헴스..

크록포드(Crockford) 스타일로 자바스크립트 오브젝트 생성하기 자바스크립트는 자바처럼 전통적인 객체지향언어가 아니며 객체 지향 기능을 갖춘 프로토타입 기반 언어로 간주된다. (비록 다른 객체지향 언어들과의 차이점에 대한 논쟁이 있긴 하지만, 자바스크립트는 강력한 객체지향 프로그래밍 능력을 지니고 있다) 프로토타입 기반 프로그래밍은 클래스가 필요없는 객체지향 프로그래밍 스타일로 프로토타입 체인과 클로저 등으로 객체 지향 언어의 상속, 캡슐화(정보 은닉) 등의 개념을 구현할 수 있다. 자바스크립트에서 객체를 다양한 방법으로 생성할 수 있는데, 크록포드는 객체를 어떤 스타일로 만드는지 살펴봤다. 더글라스 크록포드(Douglas Crockford)는 자바스크립트의 아버지로 불리는 미국의 개발자이다. 자바스..