Archive
husky를 이용한 정적 분석 자동화
지난 글에서 editorconfig, prettier, eslint를 이용해 코드를 정적 분석하고 일관된 스타일을 적용하는 법에 대해 알아보았다. 분명 이 작업을 통해서 코드의 품질이 좋아지고, 놓치는 버그의 수도 확연히 줄어들었을 것이다. 하지만 과연 실제로도 그럴까...
블로그는 사드세요... 제발
내가 지금 글을 쓰고 있는 이 블로그는 (몇 번인가 이야기한 적이 있는 것 같긴 한데) Vue를 이용해 바닥부터 올린 사이트이다. 요샌 별로 특이한 방식은 아니지만, 정적으로 페이지를 빌드해서 Netlify에 올리는 방식으로 배포하고 있다. webpack-dev-ser...
CSS 중앙 정렬의 역사
가운데 정렬은 어렵다. 근본적인 이유를 파고들면 부모 태그와 자식 태그가 어떤 속성을 가졌냐에 따라 가운데 정렬에 사용되는 속성이 무시되거나 다르게 해석될 여지가 있기 때문이다. 요새는 flex가 사실상 표준이라 새 사이트나 페이지를 만들 때엔 그걸 쓰면 되지만 옛날엔...
Node.js로 색깔 있는 콘솔 찍기
인터넷을 돌아다니다 보면 console.log를 이용해 예술을 하는 사람들을 가끔 만날 수 있다. 쿠팡의 콘솔. 이쪽은 아스키 아트도 추가했다 브라우저 콘솔은 CSS 스타일시트를 지원하기 때문에 조금 번거롭긴 하지만 이런 작품을 만들기 어렵지 않다. 예를 들어 매트릭스...
나만의 웹팩 로더 만들기
도메인 값이 아까워서 블로그를 활성화시켜야겠다는 연초의 각오가 무색하게 또 블로그를 몇 달 묵혔다. 글감은 계속 쌓이는데 마음 잡고 글 쓸 일이 없던 찰나 지인의 소개로 글또라는 프로젝트를 알게 되어 5기로 참가하게 되었다. 회사 일이 크게 바쁘지 않으면 아마 2주에 ...
내 소스를 어디서나 깔끔하게 - editorconfig, prettier, eslint
사람은 누구나 실수를 한다. 프로그래머도 사람이므로 마찬가지로 실수를 한다. 실수라고 해봐야 사실 별 볼 일 없는 것들이 대부분이지만 어쨌든 실수는 작게는 프로그래머 한 명을 패닉에 빠뜨릴 수 있고 심하게는 서비스 팀 전체가 장애대응 모드에 들게 만들 수 있다. 주작이...
highlight.js에 줄 번호를 넣어 보자
개발 블로그에 코드 블럭은 필수다. 열 줄의 설명보다 한 줄의 코드가 나을 때가 있다. 괜히 개발자는 코드로 말한다는 말이 있는 것이 아니다. 덜렁 pre 태그 안에 코드를 넣어 버리면 가독성이 크게 떨어지므로 보통 소스 코드를 넣으면 자동으로 하이라이트해주는 라이브러...
메이플스토리 강화 효율을 큰 수의 법칙으로 시뮬레이션해보자
갑자기 생각나서 메이플스토리를 다시 잡은지 대략 5달이 좀 넘게 지났다. 나는 게임은 좀 아쉽게(?) 해야 향상심이 생긴다는 주의라 일부러 현질도 안 하고 경매장 기능도 안 쓰면서 게임을 하고 있다. 원래는 적당히 돈을 모아서 상위 보스가 드랍하는 장비를 경매장에서 사...
Netlify Large Media로 이미지 호스팅하기
사정을 설명하자면, 이 블로그는 원래 이미지를 flickr에서 호스팅하고 있었다. 블로그에 올리는 사진은 단순 캡처도 있고, 핸드폰으로 찍은 사진을 올리는 경우도 있었는데, 어느 쪽이든 이미지가 너무 커지면 블로그가 엄청나게 느려지고, 쓸데없이 트래픽을 소모하며, 이미...
재택근무 일기
전국이 코로나 바이러스로 난리다. 회사 안에서는 지난 주쯤부터 재택근무 논의가 되고 있었는데, 2월 25일 드디어(?) 전사 단위의 재택근무 공지가 났다. 꽤 긴 시간을 재택근무로 보내게 되었고, 기존 업무와는 다른 새로운 점, 출퇴근하면서는 몰랐던 점들을 정리해 보면...
새 맥북 세팅하기 - Homebrew를 중심으로
우리 회사는 2년 단위로 노트북을 새것으로 교체해준다. 재택근무 중이라 다시 회사로 돌아갔을 때나 교체받을 수 있을 줄 알았는데 회사에서 노트북을 퀵으로 쏴 줬다! 일단 정말 끔찍한 사용성을 보여줬던 나비식 키보드를 벗어난 것만으로 감지덕지다. 회사에서 노트북을 교체했...
jest와 mock-fs로 fs 유닛 테스트하기
파일시스템 유닛 테스트는 까다롭다. DB/API 테스트와 마찬가지로, 원래라면 건드리면 안 되는 외부 시스템에 영향을 주기 때문이다. 보통 DB 테스트는 자신의 로컬 머신을 이용하든지, 테스트 전용 서버를 따로 파든지 해서 이 문제를 회피한다. 이 흐름을 파일시스템 테...
sharp.js로 자동 워터마크 이미지 제작하기
최근에 카톡에 깃헙 링크를 공유하다가 멋진 오픈그래프를 발견했다. 처음엔 깃헙에 오픈그래프 이미지를 넣을 수 있는 기능이 생긴 건 줄 알았는데 깃헙에서 자동으로 만들어주는 것 같다. 내 레포도 잘 나온다 문득 이걸 내 블로그에도 적용해보면 멋지겠다고 생각했다. 예전에 ...