Outsider's Dev Story

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

기술 뉴스 #139 : 19-12-02

웹개발 관련

  • 만화로 보는 DNS over HTTPS : 모질라의 A cartoon intro to DNS over HTTPS의 한국어 번역본이다. HTTPS를 이용하더라도 DNS를 조회할 때는 어떤 사이트에 접속하려는지 볼 수 있게 되는데 Trusted Recursive Resolver(TRR)와 DNS over HTTPS(DoH)로 이를 어떻게 보호하고 어떤 부분은 감출 수 없는지를 설명하는 글이다.(한국어)
  • SPA에서의 접근성에 대해 배운 것들 : SPA을 만들면서 접근성에 대해 배운 것을 정리한 글이다. 보통 <button>, <input> 대신 <div>, <span>을 많이 사용하는데 이렇게 되면 포커스나 스크롤 위치를 수동으로 다루어 주어야 하므로 접근성 관련해서 버그가 더 많이 나올 수밖에 없다. 그리고 접근성을 강화해서 aria 태그를 이용하면 테스트도 더 쉽게 작성할 수 있다고 얘기하고 있다.(한국어)
  • Build a PWA Using Only Vanilla JavaScript : 바닐라 자바스크립트 즉, 다른 프레임워크를 사용하지 않고 JavaScript로 PWA를 구현하는 과정을 설명하고 있다. Manifest, Service Worker 등 PWA에 필요한 기능을 설명하고 이 구현과정을 설명하면서 예제 소스도 함께 제공하고 있다.(영어)
  • Redux Style Guide : Redux 공식 사이트에 올라온 Redux 코드를 작성할 때의 추천 패턴과 베스트 프랙티스를 모아놓은 스타일 가이드다.(영어)
  • Time Traveling State Debugger — Reactime — Now Supporting Concurrent Mode, Routers, and more : Redux DevTools에 영향을 받아 만든 크롬 개발도구인 Reactime 3.0에 Time Traveling 디버깅 기능이 추가되어 React 앱에서 사용자 액션에 따른 상태 변화를 다시 재현하면서 디버깅할 수 있다.(영어)
  • JavaScript ‪Module Cheatsheet : ECMAScript Modules에서 importexport를 어떻게 사용하는지 이름 있는 경우 default를 쓰는 경우 등 다양한 사례별로 정리한 글이다.(한국어)

그 밖의 개발 관련

  • Announcing core Node.js support for ECMAScript modules : Node.js 13.2.0 버전부터 import, export 문법으로 사용하는 ECMAScript 모듈을 지원한다. 이전 버전까지는 --experimental-module 플래그를 사용해야 했다. 모듈은 .mjs 확장자를 사용하거나 해당 파일의 가장 가까운 위치에 있는 package.json에서 typemodule로 지정되어 있어야 한다. 기본의 CommonJS는 cjs 확장자를 사용하거나 type이 없거나 commonjs로 지정되어 있어야 한다.(영어)
  • Better Android Testing at Airbnb — Part 1: Philosophy and Mocking, Part 2: Screenshot Testing : Airbnb에서 Android 테스트 자동화를 한 과정을 설명한 7편의 시리즈 글 중 첫 두 편의 글이다. Espresso를 쓰다가 Jetpack의 ViewModel을 도입해서 MvRX 라이브러리를 오픈소스로 공개하고 사용해 온 뒤 더 테스트를 잘할 수 있도록 모킹 시스템을 도입해서 MvRX 라이브러리에 통합시키고 이후 스크린샷 비교를 위해 Happo 서비스를 도입했다고 한다.(엉여)
  • Meet Doctor, a new React Native command : React Native 개발 환경의 오류를 검사할 수 있는 doctor 명령어가 추가되었다.(영어)

인프라 관련

볼만한 링크

  • 스프링러너, 벌써 일 년 : 스프링을 배울 수 있는 워크숍을 1년 동안 운영하고 회고하는 글이다. 스프링러너 워크숍에서는 스프링의 사용법과 응용법을 가르치는 것을 목표로 하고 있고 이 과정을 통해서 스프링에 대해서 배울 수 있지만 16시간 동안 많은 내용을 가르치기 때문에 참가자들이 컨디션 조절을 잘해야 한다는 어려움이 있다.(한국어)

IT 업계 뉴스

프로젝트

  • Browser Default Styles : HTML 요소의 브라우저별 기본 스타일을 비교할 수 있는 사이트.
  • Lighthouse CI : Lighthouse를 CI에서 돌릴 수 있게 하는 CLI.
  • whocanuse : 색상 대비로 인한 접근성을 검사해 주는 사이트로 배경색과 텍스트의 색을 입력하고 접근성에 대한 결과를 볼 수 있다.
  • WebGLStudio.js : 웹 기잔의 3D 그래픽 에디터.
  • Gridsome : Vue.js를 이용한 정적 웹사이트 생성 도구.
  • Fitty : 부모 컨테이너 사이즈에 텍스트를 맞추는 JavaScript 라이브러리.
  • Clusterlint : Kubernetes 클러스터가 베스트 프렉티스를 따르고 있는지 검사해주는 도구로 Digitalocean에서 만들었다.

버전 업데이트

2019/12/02 04:19 2019/12/02 04:19