Outsider's Dev Story

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

기술 뉴스 #105 : 18-07-02

웹개발 관련

  • 웹브라우저 user-agent string 의 역사 : 브라우저의 user-agent를 보면 왜 이렇게 복잡하고 다른 브라우저의 이름을 사용하는지 이해하기 어려운데 오래된 번역 글이지만 모자이크부터 user-agent가 왜 수많은 브라우저에서 지금처럼 혼란스러운 문자열을 사용하는지 이해할 수 있다.(한국어)
  • [번역] 깊이 있는 리액트 개발 환경 구축하기 : Learn Webpack for React의 번역 글이다. 요즘은 create-react-app으로 구성하는게 보통이지만 프론트엔드 환경이 워낙 복잡해서 그 내용을 다 이해하기가 어려운데 이 글에서는 직접 의존성을 설치하고 React 앱을 만들면서 HMR, 코드 스플릿 등의 설정하며 이해하기 쉽게 각 webpack의 설정과 babel 설정을 설명하고 있다.(한국어)
  • Rendering large lists with React Virtualized : React에서 많은 수의 리스트를 출력하면 렌더링 속도도 느리고 스크롤 반응이 느리게 되는데 이를 react-virtualized가 어떻게 해결하는지 설명한 글이다. 기본 접근은 모든 아이템을 다 그리지 않고 화면에 보이는 부분만 그려서 속도를 높이는 것으로 이를 활용해서 60fps로 성능을 높인 것을 보여주고 브라우저 크기가 달라지만 자동으로 크기를 맞춰주는 부분까지 설명하고 있다.(영어)
  • REST vs. GraphQL: A Critical Review : REST와 GraphQL을 비교한 글이다. 내가 느끼기에는 GraphQL을 좀 더 지지하고 있지만 두 API의 특징을 표로 깔끔하게 정리하고 있고 장단점이 잘 나와 있어서 어느 쪽을 선택해야 할지 고민할 때 참고할 수 있는 글이다. REST를 이해하기는 꽤 어려우므로 전혀 모르고 있다면 그냥 GraphQL을 쓰라고 하고 있다.(영어)
  • What is the CSS ‘ch’ Unit? : CSS의 단위 중 하나인 ch에 대해 에릭 마이어가 설명한 글이다. 보통 ch는 캐릭터 글자 수로 가독성을 위해 한 줄의 글자 수를 제한하려고 사용한다고 설명하지만, 이는 0을 기분으로 크기를 잡으므로 고정폭 글꼴에서는 맞는 말이지만 다른 글꼴에서는 다르게 나타날 수 있다.(영어)

그 밖의 프로그래밍 관련

  • React Native at Airbnb : 2016년부터 React Native를 도입했던 Aribnb가 React Native를 버리고 네이티브 개발로 전환하면서 그동안의 경험을 5개의 글(2, 3, 4, 5)로 정리했다. 단순히 React Native의 사용뿐 아니라 React Native를 선택하면서 목표로 했던 점과 DSL(Design Language System)이나 다른 React Native 관련 인프라를 만들어서 개선했던 점이 정리되어 있다. 성능도 잘 나오고 코드도 많이 공유할 수 있지만, 생태계가 아직 부족하고 React Native가 아직 초반이라서 대응해야 할 부분이 많은 등 왜 다시 네이티브 개발로 바꾸는 선택을 했는지 잘 정리되어 있다. 모든 조직이 React Native가 어울리지는 않으므로 Airbnb라는 큰 기업이 React Native를 신중하게 선택하고 다시 바꾸기까지의 고민이 고스란히 남아있는 이 글은 React Native를 고민하고 있다면 정말 소중한 글이다.(영어)
  • MySQL High Availability at GitHub : GitHub에서 데이터를 모두 저장하고 있는 MySQL의 가용성을 높이기 위해 개선한 내용이 정리되어 있다. 마스터 노드가 장애 났을 경우 이전에는 VIP와 DNS를 통해서 변경을 가했으나 이 경우 기존 서버와의 연결을 제대로 끊기지 않고 시간이 걸리는 문제를 해결하기 위해 orchestrator에 Consul과 GLB/HAProxy를 어떻게 이용해서 개선했는지가 잘 정리되어 있다.(영어)
  • Threads in Node 10.5.0: a practical intro : Node.js 10.5.0에 추가된 worker_threads의 사용방법을 설명하는 글이다. Node.js는 싱글 스레드이지만 이번에 워커 스레드가 추가되어 CPU 작업이 많은 경우 워커 스레드를 이용할 수 있게 되었다. 아직 워커 스레드는 실험 상태이므로 언제든 호환성을 깨뜨리는 변경사항이 생길 수 있다.(영어)
  • 구글 I/O 2018 안드로이드 파트 리뷰 : 얼마 전 열린 구글 I/O 2018에서 안드로이드 관련 부분을 정리한 글이다. 구글 I/O의 많은 세션을 다 보기 어려운데 안드로이드 앱의 동적 배포나 새로 공개된 도구나 기술들이 정리되어 있다.(한국어)
  • Web Assembly and Go: A look to the future : Go 1.11에 추가될 Web Assembly 지원을 사용해서 Go 언어로 To do 앱을 만들어 보면서 사용한 경험을 정리한 글이다. Go를 JavaScript로 변환할 수 있는 GopherJS와 Go/wasm이 어떻게 다르게 동작하는지도 나와 있다.(영어)
  • [Go로 구현하는 블록체인] Part 1: 기본 프로토타입 : Building Blockchain in Go. Part 1: Basic Prototype의 번역 글로 Go 언어로 블록체인을 구현하는 튜토리얼이다.(한국어)
  • 이미지 탐지기 쉽게 구현하기 : 당근마켓에서 캐릭터 이미지를 식별하기 위해서 Tensorflow Hub를 이용해서 "당근이"라는 이미지를 구별할 수 있게 구현한 과정이 나와 있다. 딥러닝은 잘 모르지만, 너무 간단한 구현에 놀랐다.(한국어)

볼만한 링크

  • 10배 뛰어난 개발자 되기 : "10배 뛰어난 엔지니어는 남들보다 10배 뛰어난 사람이 아니라, 주변 사람을 10배 뛰어나게 만드는 사람이다."라는 요지의 글로 더 나은 동료가 되기 위한 10가지 접근 방법을 정리한 글이다. 요즘 협업이나 팀 문화에 대해서도 많이 생각하고 있어서 와닿는 부분이 많았다.(한국어)
  • X-Window 탄생 : X-Window의 탄생과정을 만화와 함께 설명한 글이다. 최근 Wayland에 대해서도 알았고 X-Window의 역사를 몰랐기에 재밌게 봤다.(한국어)
  • OWASP Mobile Security Testing Guide : OWASP(Open Web Application Security Project)에서 Android와 iOS 앱의 보안 테스트에 대한 안내를 책으로 묶어서 발간했다. Leanpub에서 무료로 이북을 다운로드 받을 수 있다.(영어)

프로젝트

  • mkcert : 로컬에서 개발용 인증서를 생성할 수 있는 CLI 도구.
  • DensePose : 실시간으로 이미지를 3D 표면으로 매핑해주는 RCNN.
  • DevTube : 개발 관련 동영상을 검색할 수 있는 서비스.
  • Material Dashboard : Bootstrap 4 기반의 머터리얼 디자인 대시보드.

버전 업데이트

2018/07/02 23:04 2018/07/02 23:04