Outsider's Dev Story

Stay Hungry. Stay Foolish. Don't Be Satisfied.
RetroTech 팟캐스트 44BITS 팟캐스트

기술 뉴스 #131 : 19-08-01

웹개발 관련

  • PWA 하루 만에 도입하기(삽질기) : 개발 일정 중 여유가 생긴 날 숨고 웹서비스에 PWA를 도입한 과정을 설명한 글이다. 작업하는 시간까지 설명하면서 PWA를 살펴보고 서비스 워커를 연결한 뒤에 백그라운드 푸시 알림을 보내려고 시도하다가 시간이 늦어서 포어그라운드 푸시를 구현하면서 삽질한 과정까지 잘 나와 있어서 하루의 개발 과정을 생생히 보는 듯한 재미가 있다.(한국어)
  • After 13 Years of Polyfills : 요즘은 활동이 많지 않지만 예전에는 꽤 유명한 JavaScript 개발자였던 WebReflection이 13년 동안 Polyfill 라이브러리를 작성한 경험을 적은 글이다. Polyfill은 비표준 기능이나 구현 수준때문에 브라우저 간 차이 나는 부분을 메꾸고 같은 API로 사용하도록 하는 라이브러리를 얘기한다. 2006년 IE4를 타깃으로 한 JSL부터해서 브라우저가 발전하면서 다양한 Polyfill 라이브러리를 작성하면서 Polyfill 영역이 하나의 라이브러리로 전체를 커버하거나 기능별로 Polyfill하는 방향으로 발전하다가 지금은 Babel이 주로 이 영역을 담당하고 있다고 생각한다. 낮은 브라우저를 지원하면 최신 브라우저에도 Polyfill이 적용된 코드가 들어가므로 필요할 때마다 Polyfill를 CDN에서 가져와서 사용할 수 있는 ungap 프로젝트를 설명하고 있다. 예전에 자주 보던 블로그의 저자라서 그런지 읽으면서 더 반가웠다.(영어)
  • Bypassing anti-incognito detection in Google Chrome : Chrome의 시크릿 모드로 웹사이트에 접속했을 때 웹사이트에서 이를 탐지하는 방법을 설명한 글이다. Chrome 74 이전에는 FileSystem API가 시크릿 모드에서 막힌 것을 이용했고 74버전부터는 임시 스토리지의 크기가 사용 가능한 스토리지의 50%라서 2.4GB일 때 시크릿 모드에서는 최대 120MB이므로 2.4GB 이상의 스토리지는 보통 있을 거라고 가정하고 탐지할 수 있다고 설명하고 있다. 웹사이트에서 사용자가 시크릿 모드로 들어온 것을 굳이 탐지해서 뭔가 하는 것은 좋지 않다고 보지만 또 이런 게 필요한 경우도 있고 접근 방법이 흥미로워서 남겨둔다.(영어)
  • Getting to Know Puppeteer Using Practical Examples : Chrome을 제어할 수 있는 라이브러리인 Puppeteer의 사용 방법을 정리한 글이다. Peppeteer로 무언가 자동화하려고 할 때 디버깅, 페이지 조작, 마우스 조작, 이벤트 감시 등 필요한 기능의 사용법을 설명하고 성능 측정이나 프로파일링까지 설명하고 있어서 지금의 Puppeteer로 어디까지 할 수 있는지 쉽게 배울 수 있는 글이다.(영어)
  • Bypassing CAPTCHAs with Headless Chrome : 웹사이트에서 사람인지 봇인지를 구분하기 위해서 사용하는 CAPTCHA 중 Google의 reCAPTCHA를 2Captcha와 Puppeteer를 이용해서 자동으로 뚫는 방법을 설명하는 글로 전체 소스 코드도 제공하고 있다. 물론 설정 방법을 설명할 뿐이고 reCAPTCHA를 뚫는 부분은 2Captcha에 맡기고 있다.(영어)

그 밖의 개발 관련

  • LINE Manga 데이터베이스 샤딩 – 서버 엔지니어 편 : LINE Manga에서 사용자와 데이터가 증가하면서 기존 MySQL의 부하가 커져서 MySQL을 샤딩해서 사용하도록 변경한 과정을 설명한 글이다. 기존과 새 샤드 DB에 이중으로 쓰는 방식으로 마이그레이션을 6단계에 걸쳐서 진행했다. 서비스가 커지면 대부분 DB에 부하가 커지기 때문에 비슷한 고민을 많이 할 텐데 각 단계에서 고민한 부분이 잘 나와 있고 나중에 샤드를 늘리기 위해서 65,535로 나눈 나머지로 해시 슬롯값을 정한 것도 흥미로운 부분이다.(한국어)
  • How to get the GitHub Student Developer Pack without a student ID : GitHub에서 13세 이상 학생에게 제공하는 GitHub Student Developer Pack을 학교 이메일이나 ID가 없어도 신청하는 방법을 설명하는 글이다. 이 Pack에는 $12,000상당의 상용 개발 관련 서비스들이 포함되어 있다.(영어)
  • The Top 10 Most Common Mistakes I’ve Seen in Go Projects : Go 언어로 코딩할 때 많이 실수하는 사례를 정리해서 이유를 설명하는 글이다. Enum을 마샬링할 때 하는 실수나, 벤치마크를 정확하게 하는 법, 오류 처리, Slice 초기화 등이 정리되어 있다.(영어)
  • Map, Filter and Reduce – Animated : 배열에서 많이 사용하는 map, filter, reduce의 동장방식을 애니메이션으로 설명하는 글이다.(영어)

인프라 관련

볼만한 링크

  • 오픈소스를 금지당한 사람들의 몸부림 : GitHub이 최근 이란, 시리아, 북한, 쿠바 등의 접근을 갑자기 제한하면서 개발자들이 github-do-not-ban-us라는 페이지를 만들어서 제한을 풀어 달라고 것을 요구하고 있는데 이 내용을 정리한 글이다.(한국어)
  • (번역) 2019년 7월 2일 Cloudflare 장애 보고서 : Cloudflare에서 올린 장애 보고서를 번역한 글이다. 지난 뉴스레터에도 소개했지만 방화벽에서 사용했던 정규표현식이 CPU를 100% 사용하면서 30분간 장애가 발생했는데 이 글에서 Cloudflare가 어떤 배포 규칙을 가지고 있고 이번 장애는 왜 발생하게 되었는지가 자세히 나와 있다. 원글이 길어서 못 읽어봤다면 번역 글이라서 훨씬 읽기 편할 것이다.(한국어)
  • Introducing Duotone : Font Awesome에서 2가지 색상의 아이콘을 지원한다. 2가지 레이어를 이용해서 아이콘을 만들어서 색상을 지정할 수 있고 두 색의 교체나 투명도를 조정할 수 있다. 이는 Font Awesome Pro에서 이용할 수 있다.(영어)

IT 업계 뉴스

프로젝트

  • Puppeteer for Firefox : 헤드리스 크롬을 제어하는 API를 제공해 주는 Puppeteer에서 Firefox를 지원하려는 프로젝트로 아직 실험상태이다.
  • Nuclio : 데이터 파이프라인을 만들 수 있는 서버리스 플랫폼으로 Kubernetes를 지원한다.
  • Byteboard : Google에서 공개한 기술 면접 도구로 기존 방식보다 기술 평가를 효과적으로 할 수 있다고 한다.

버전 업데이트

2019/08/01 03:21 2019/08/01 03:21