Promise 작업 시간 초과하면 실패로 간주하기 (feat. setTimeout, Promise.race)

개요 요즘 자바스크립트에서는 Promise 가 많이 쓰입니다. 이른바 비동기 작업이라고도 하죠. 여러가지 시간이 좀 걸리는 작업들을 다룰 때 편하기 때문인데요, 그런데 너무 오래 걸리는 작업을 취소하고 싶지 않나요? 예를 들어 게시글의 댓글을 불러오기 위해 api 서버에 요청을 날렸는데, 2~3초가 지나도 묵묵부답이라면, 이건 api 서버가 잘못되었다고 보고, 작업을 취소하고, 유저에게 “서버로부터 응답이 없습니다. 잠시 후 다시 […]

[Node.js] pug + tailwind + Puppeteer + Docker 로 프린터 출력용 PDF 만들기

개요 인터넷 쇼핑몰에서 견적서 같은 걸 자동으로 생성해주는 것을 볼 수 있는데요, 우리도 한번 구현해 봅시다! 전체적으로 Node.js 바탕으로 돌아갑니다. 우선 node 를 설치해주세요. 필자의 버전 기준은 node 14 입니다. docker 를 사용하고자 한다면, docker 와 docker-compose 까지 설치해주세요. 각 기술에 대한 간략한 설명 pug: HTML 템플릿 엔진입니다. 직접 html 파일을 작성하는 것보다 훨씬 간편하고, […]

[Pop!_OS] 부트로더 초기화

개요 ssd 가 잘 인식이 안되서 잘 꼽혀있던 두 개의 자리를 바꿨습니다. 그랬더니 거짓말처럼 Pop!_OS 가 메뉴에서 사라졌습니다. 이게 무슨 일이죠.. 이제 리눅스를 부팅할 수가 없었습니다… Pop!_OS 부팅이 제대로 안되는 문제를 발벗고 해결하기 위해 나섰습니다. 본래 설치를 하면 Pop!_OS 는 systemd-boot 로 부팅된다고 합니다. (아래 인용문 참조) 그게 무슨 소리일까요? 저도 모릅니다. GRUB 도 뭔지 […]

데이터 검증 (Data Validation)은 언제, 얼마나 해야 할까?

개요 필자는 처음 웹 프로젝트를 받았을 때 고생했습니다. 왜냐하면 아는 게 하나도 없었기 때문이지요 (물론 그렇다고 지금도 아는 게 많은 것 같지는 않아요..) 그래도 고생하고 경험하면서 직접적으로 느끼며 배우는 것들은 많은 것 같습니다. 그 많고 많은 주제 중에, 데이터 검증 (Data Validation) 을 언제(when) 얼마나(how much) 해야 하는가에 대한 질문을 조금이나마 더 잘 대답할 수 […]

[vscode] 정규표현식으로 변수의 case 를 변환해보기 (lookahead, lookbehind 활용)

개요 우리의 목표는 아래 코드에서 모든 #define 한 녀석들을 Upper Case Snake Case 로 변환해보는 작업을 할 것입니다. 일일히 손으로 타이핑하여 수정하기에는 너무 오랜 시간이 걸리지요? 그래서 정규표현식을 이용하여 깔쌈하게 바꿔 볼 예정입니다. 바로 아래 나오는 소스코드를 바꿔볼 텐데요, 예를 들어 NoEventMask 라는 문자를 NO_EVENT_MASK 로 바꿔볼 것입니다. case를 변환시키는 작업은 vscode 의 기능을 활용하기 […]

[Node.js] pug + inline-css로 이메일 템플릿 만들어 보내기 (작성중)

개요 pug 란 html 을 좀 더 쉽게 생성하게 해주는 도구입니다. pug 는 자신만의 문법이 있으며, 이는 기존에 태그를 열고 닫는 html 보다 편한 건지는 사람마다 다르겠지만, 문서의 같은 양으로 보자면 실제로 타이핑하는 것들이 훨씬 적어지는 것도 사실입니다. 그리고 pug에는 상속 기능, mixin, interpolation, 변수 기능 등을 제공해주기 때문에 좀 더 원활하게 상황에 맞는 html […]

나의 POP!_OS 설치기 (+ 세팅)

개요 윈도우에서 wsl 로 리눅스 환경을 테스트 하다가 못해먹겠어서 그냥 스스디 하나 더 사고 리눅스를 깔았다. POP!_OS 란 System76 이라는 컴퓨터 만드는 회사에서 배포하고 있는 리눅스 운영체제이다. 우분투 베이스일 것이다. 그러므로 검색할 때 잘 모르겠으면 그냥 ubuntu 를 붙이면서 검색하면 됨. 어떻게 해서 POP!_OS 를 설치하게 되었는지에 대한 스토리가 있다. 처음엔 그래픽카드 때문에 리눅스에서 드라이버가 […]

[javascript] 중첩된 객체에서 원하는 필드를 뽑아오기

개요 본 글에서는 중첩된 객체에서 어떤 값을 가져온다는 간단한 유틸리티 함수를 만듭니다. 하지만 이미 너무나도 유명한 유틸리티 라이브러리인 Lodash 등을 이용해보는 것이, 라이브러리 자체를 익히는 데 시간과 노력이 많이 들 수 있지만, 추후 생산성 측면에서 훨씬 좋아질 수도 있습니다. 동기 중첩된 객체에서 정보들을 한번에 손쉽게 가져오는 방법을 계속 재사용해야 했습니다. 예를 들어 obj 가 뭐가 […]

웹 접근성 인증 받는 방법과 후기

일평생 처음이고, 또 마지막도 될 수 있는 웹 접근성 품질 인증 심사에 대한 포스팅입니다. 일개 힘없는 프리랜서라서 더 잘하는 분들의 힘을 얻고자 인터넷에 관련된 검색을 많이 했었는데, 인증 후기를 도저히 찾을 수 없었습니다! 왜! 힘을 주시지 않는 겁니까… 그래서 최대한 삽질하지 않기 위한 몸부림을 기록하고자 키보드를 두들기게 되었습니다. 둥당기둥당. 웹 접근성은 무엇인가? 웹 접근성이란 쉽게 […]

[Windows] Node.js 전역 npm 패키지 명령어 실행시 ExecutionPolicy 오류

들어가기 전에, ExecutionPolicy 보안 정책에 어긋난다고 해서 이것의 규제 장치를 풀어헤치는 것에 좀 반감이 들었다. npm을 통해 실행할 스크립트야 대부분 신뢰있는 스크립트겠지만, 어쨌건 방화벽 하나를 해제하는 기분이었다. 미래에 어떤 보안 위협이 내 컴퓨터에 올지 모르는 일이니까 걱정이 되었는데, 그냥 걱정하지 않기로 했다. 깊은 생각을 하지 말자. copyfiles를 전역 패키지 설치하여 사용하려고 했으나 에러가 떠서 해결방법을 […]

Scroll to top