Outsider's Dev Story

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

기술 뉴스 #118 : 19-01-15

웹개발 관련

  • React Performance Fixes on Airbnb Listing Pages : React로 만든 Airbnb의 리스트 페이지의 성능을 개선한 과정을 설명하고 있다. 서버사이드 렌더링에서 브라우저의 피처 디텍팅이 되지 않아서 성능이 저하된 부분 등 크롬 개발자 도구의 프로파일링 기능과 프레임 그래프를 이용해서 성능이 저하되는 부분을 찾아내고 고치는 과정을 설명하고 있다.(영어)
  • React와 Apollo, Parcel 기반 서비스 개발 : 네이버에서 신규 서비스의 스택을 React, Redux, webpack 대신 React, Apollo, Parcel로 가져간 과정을 설명한 글이다. 실제 서비스를 만드는 세부 내용까지는 안 나와 있고 각 기술을 선택한 이유와 어떤 장단점을 제공하는지 소개하고 있다.(한국어)
  • Front-End Performance Checklist 2019 [PDF, Apple Pages, MS Word] : 작년에 이어 Smashing Magazine에서 웹사이트의 성능을 높이기 위해 점검해 봐야 할 내용을 체크리스트로 만들어서 PDF와 Apple Pages 포맷으로 배포했다. 이 체크리스트에는 개발 전에 준비해야 할 부분, 성능 목표, 환경 구성, 빌드 최적화, 에셋 최적화, 전송 최적화, HTTP/2, 테스트와 모니터링 등으로 나누어서 좋은 성능을 위해 필요한 부분이 잘 정리되어 있다.(영어)
  • The React Handbook : React를 공부할 수 있는 220페이지 분량의 핸드북을 공개했다. 웹에서 볼 수도 있고 뉴스레터에 가입하면 PDF나 ePub 등의 포맷으로 다운로드 받을 수 있다.(영어)
  • 2018 JavaScript Rising Stars : JavaScript 관련 프로젝트들을 프레임워크, 빌드 도구, 생태계 등으로 분류해서 2018년에 GitHub 스타를 많이 받은 순서대로 보여주는 페이지이다. 누적 스타 수는 오래된 프로젝트가 많게 마련인데 이 페이지는 2018년에 증가한 스타 수만 집계하고 있어서 2018년에 주목받은 프로젝트를 살펴볼 수 있다.(영어)

그 밖의 프로그래밍 관련

  • 주니어 개발자가 처음 풀 리퀘스트 보내본 썰.txt : 업무에서 사용하던 라이브러리에서 버그를 발견해서 수정하고 풀 리퀘시트를 보낸 과정을 설명한 글이다. 처음이라고 하시는 데 풀 리퀘스트을 보내는 과정이 깔끔하게 정리되어 있어서 아직 안 보내본 사람이 참고하기 좋은 글이다.(한국어)
  • 천만 명의 사용자에게 1분 내로 알림 보내기 (병렬프로세스의 최적화) : 방송이 시작하면 구독하는 사용자에게 푸쉬 알림을 보내는데 천만 명의 사용자에게 보내는데 최대 11분이 걸리던 상황을 1분 이내로 최적화한 과정을 설명한 글이다. 3단계로 진행하면서 병렬처리 및 Redis 파티셔닝 등 어떤 부분을 개선했는지 설명하면서 단계별로 얼마나 개선되었는지까지 보여주고 있는데 세세한 개선 과정이 나와 있어서 아주 유용하고 비슷한 환경에서 참고하기 좋은 글이다.(한국어)
  • Github Organization as a Code : GitHub 조직의 저장소와 권한 관리를 Terraform으로 하는 방법을 설명하는 글이다. 조직의 성격이나 규모에 따라 다르고 저장소까지 관리하면 새로운 저장소를 만들 때 약간의 불편함이 될 수도 있지만 멤버 혹은 권한 관리나 히스토리를 제대로 알기 어려운 문제 때문에 개인적으로 좋아하는 방식이다.(영어)
  • AWS 람다 커스텀 런타임 만들기(feat. 루비 2.6.0) : 기본에는 AWS Lambda에서 지원하는 런타임만 사용할 수 있었는데 지난 re:invent에서 커스텀 런타임 지원을 발표했다. 이미 Ruby를 지원하고 있지만, 최신 버전인 Ruby 2.6.0을 커스텀 런타임으로 만들고 이를 Lambda 레이어로 올려서 사용하는 방법을 설명하고 있다. Lambda에서 지원하지 않는 언어나 최신 버전이 필요하다면 이 방법을 이용해야 한다.(한국어)
  • 왜 굳이 도커(컨테이너)를 써야 하나요? : 도커가 인기를 얻은 지 오래되었지만 도커 컨테이너를 사용했을 때 서버의 환경을 통일할 수 있고 미리 빌드 실패를 경험해 볼 수 있으면서 격리된 부분은 변경할 수 없게 되어 있는 등의 장점을 설명하고 있다.(한국어)
  • Github Actions 맛보기 : 아직 클로즈 베타로 일부 사용자에게 조금씩 열리고 있는 GitHub Actions로 개인 프로젝트의 빌드, 테스트, Lint 등의 CI 작업을 작성한 경험을 공유한 글이다.(한국어)
  • 이미지만으로 내 중고물품의 카테고리를 자동으로 분류해준다면? (feat. Keras) : 당근마켓에서 사용자가 올린 이미지를 Keras로 학습시켜서 카테고리를 자동으로 분리할 수 있도록 시도한 과정을 설명하고 있다. 사용했던 코드와 학습 결과 및 잘못 분류된 사진들의 예시 등이 잘 나와 있는데 딥러닝은 잘 모르지만 얼마 전 당근마켓에 놀러 가서 내부에서 딥러닝을 사용하는 예시를 보기도 해서 더 재미있게 읽었다.(한국어)
  • Understanding npm-link : npm에서 개발 중이거나 디버깅 목적으로 로컬에 있는 다른 모듈을 설치해서 개발하는 npm-link를 어떻게 사용하는지 설명하는 글이다. npm-link를 사용하면 패키지를 배포하거나 Git 저장소에 올리지 않고도 개발할 수 있다.(영어)
  • Using worker_threads in Node.js : Node.js 10.5.0에 실험 기능으로 추가된 worker_threads로 CPU 인텐시브한 작업을 병렬로 실행하는 방법을 소개하고 있다.(영어)

블록체인 관련

볼만한 링크

  • 구글 면접 후기 : 최근 구글 코리아에 면접을 본 경험을 바탕으로 면접을 위해서 알고리즘 공부를 어떻게 했는지 정리한 글이다. 여러 달 동안 다양한 사이트와 책을 통해서 알고리즘 문제를 풀어보면서 연습을 하고 면접 후에 준비가 아쉬웠던 부분과 좋았던 부분이 나와 있어서 외국계 회사에 면접을 준비한다면 읽어보면 좋다.(한국어)
  • 블로그 글 1편을 쓰기까지의 과정 : 매주 최소 한편씩 블로그에 글을 쓰면서 그 과정을 정리한 글이다. 소재를 선택하고 개요를 적은 후 1차, 2차에 나누어서 초안을 작성한 뒤 발행하는데 체계적으로 잘 정리되어 있다. 나는 이렇게 체계적인 단계를 글을 쓰는 편은 아닌데 다른 분이 글을 쓰는 방식을 보고 배울 수 있는 부분도 많아서 유용한 글이었다.(한국어)

IT 업계 뉴스

프로젝트

  • unified : 문서를 문법 트리(syntax tree)로 만들어서 변환해주는 인터페이스.
  • 한글 에디터 산 1.x : 1993년 고등학생 때 만든 DOS 용 한글 에디터 산의 소스를 공개한 저장소.
  • rrweb : 웹사이트에서 사용자가 동작을 녹화한 뒤 재생할 수 있게 하는 JavaScript 라이브러리.
  • FBT : Facebook에서 만든 JavaScript 국제화 라이브러리.
  • hexyl : 터미널용 hex 뷰어.

버전 업데이트

2019/01/15 23:35 2019/01/15 23:35