2020-03

링크 & 읽을거리

Request - Simplified HTTP client: Deprecated!

24K 깃헙 Star와 매주 18M 건의 다운로드, 그리고 무려 48K 개의 패키지들이 의존하고 있는 인기 HTTP 클라이언트 라이브러리인 'Request'가 지난 2월 20일을 기점으로 deprecate 되었다.

지난 10여 년간(2009년 시작) 유지되었던 이 프로젝트의 개발자인 Mikeal Rogers는 지난 몇 년간 빠르게 변화한 JavaScript 생태계의 변화들로 인해 request의 코어 패턴은 시대에 뒤떨어지게 되었고, 생태계를 위한 최선책은 메인터넌스 모드로 전환하는 것이라고 그 이유를 밝혔다. 보다 자세한 내용은 아래 링크를 통해 확인할 수 있다.

Request’s Past, Present and Future

(영상) dotJS 2019 - Vladimir Agafonkin - Fast by default: algorithmic performance optimization in practice

병목지점을 찾고 왜 느린지 생각하고 빠르게 만들어라!

Javascript에서 퍼포먼스를 향상시키는 방법을 다양한 경험과 예제를 통해 설명한다.

Some Tips for the Web VR Beginners

단돈 5 달러만 있어도 VR 콘텐츠를 즐길 수 있는 세상, Web VR 개발 팁을 공유한다.

Web VR을 개발하려고 할 때 어떤 것들을 고민해봐야 하는지 여러 가지 브라우저와 기기의 측면에서 이야기한다.

Good bye, Clean Code

클린코드 빌런이 되지는 말자. 클린 코드는 목표가 아니고 단지 프로그램의 복잡성을 줄이고자 하는 시도일 뿐이며, 코드가 어떻게 바뀔지 모르는 상황에서, 피해를 최소한으로 줄이고자 하는 방어 전략 중 하나일 뿐이다.

코드가 어떻게 보이는지만 보는 게 아니라 다양한 사람들로부터 어떻게 발전시켜 나갈지가 중요하다는 것을 경험을 토대로 이야기한다.

A Guide to Console Commands | CSS-Tricks

console은 간단히 다루기에는 알아야할 것들이 의외로 많다.

우리가 코드를 처음 시작할 때 다뤘던 console의 다양한 활용법, 기능을 자세히 가이드한다.

Bulletproof node.js project architecture 🛡️

Express.js는 node.js로 REST API를 개발할 때 정말 좋은 프레임워크이지만, node.js 프로젝트를 어떻게 구성해야 하는지에 대해 그 누구도 알려주지 않는 건 큰 문제다.

Express.js 기반의 node 프로젝트를 어떻게 설계/구성해야 하는지 자세하게 설명한다. 한글로 번역된 글(#바로가기)도 있다.

The ultimate guide to proper use of animation in UX

사용자 경험(UX)을 위해 애니메이션을 사용하는 경우 고려해야 하는 종합적인 가이드를 제공한다. Timing Function에 따라 적합한 애니메이션들은 무엇인지, 인터페이스 애니메이션의 가장 최적화된 속도는 200~500ms 사이(다수의 리포트에 근거한)라는 내용들을 소개하며, 각 항목 별로 제공되는 애니메이션 예제를 통해 차이점들을 직접 체감해 볼 수 있다.

ex) 속도와 관련해서는 너무 빠르지는 않지만 사용자들의 기다림을 최소화한 속도의 애니메이션 적용의 필요성에 대한 애니메이션 예제

Design Better Forms

인생은 짧고 사용자는 폼에 데이터를 넣기 꺼려 한다.

사용자에게 어떻게 폼을 제공해야 효과적이고 완료율이 높은지 설명하는 글. 현재 프로젝트에서 폼을 개발하고 있다면 필독!

7 design psychology fundamentals every designer should know

프로덕트를 개발할 때 멘탈모델을 염두해 두면 사용자의 반응을 성공적으로 이끌어 낼 수 있다.

인간의 7가지 심리적요소를 UX에 어떻게 녹여야 사용자의 좋은 반응이 나오는지 설명해 준다.

Why Apple's Notification Bubbles Are so Stressful

iPhone의 잠금을 해제할 때마다 시뻘건 알림 벳지로 부터 공격을 받는다.

나은 UX는 작은 변화로부터 시작된다. 필자가 "인지 과부화"라고까지 일컫는 알림 벳지 스트레스를 어떤 작은 변화로 해결할 수 있는지 이야기한다.

네이버 지도 vs 카카오맵 사용자 경험 비교 (Mobile) / (PC)

네이버 지도와 카카오맵을 Mobile과 PC 두 플랫폼에서 음성검색, 복사, 즐겨찾기 등 다양한 측면에서 비교한 글. 두 지도 서비스를 모두 설치하고 상황에 따라 적절히 이용하고 있는 필자의 UX에 대한 깊은 인사이트를 엿볼 수 있다.

코드와 도구

The Top 50 100+ Developer Tools 2019

2019년 한 해동안 StackShare 커뮤니티에서 공유된 4백만 개 이상의 데이터를 분석했고, 프런트/백엔드부터 디자인 툴 그리고 협업 툴까지 18가지의 범주로 분류해서 순위화했다.

다양한 측면에서 비교를 통해 의미 있는 선택을 할 수 있게 도와주는 참고 자료가 될 것이다.

stackshare에서는 UBER, Airbnb, Shopify 등 기업들이 사용하는 기술 스택을 확인할 수 있다. 링크에서 내가 사용하는 기술 스택과 다른 기업들이 사용하는 기술 스택을 비교하는 것도 쏠쏠한 재미가 되지 않을까?

30 seconds of code

2018년 깃헙 Top 프로젝트로 선정되기도 했던 이 프로젝트는 코드 작성 시 맞닥뜨릴 수 있는 문제들의 해결을 위한 다양하고 짤막한 코드 스니펫 모음들을 제공한다. JavaScript 외에도 CSS, React, Python 등 총 7가지 개발 환경 및 언어들의 분류로 제공된다.

// ex) 배열 내에 존재하는 교차 값을 구하는 스니펫
const intersectionBy = (a, b, fn) => {
  const s = new Set(b.map(fn));
  return [...new Set(a)].filter(x => s.has(fn(x)));
};

intersectionBy([2.1, 1.2], [2.3, 3.4], Math.floor); // [2.1]

추가로 2018년 Top 깃헙 프로젝트로 선정되었던 다음 프로젝트도 유용하게 참고할만하다.

33-js-concepts JavaScript 개발자들이 알아두면 좋을 주요한 33가지 개념들에 대한 설명글과 동영상들의 방대한 목록을 제공한다. 이들 개념들 중에는 Call Stack, Expression(표현식) vs Statement(문장)의 차이 등을 살펴볼 수 있다.