Web Development Reading List #106
원본 : Web Development Reading List #106
저자 : Anselm Hannemann
역자 : 조현석
역자 코멘트
개인적인 공부와 정보 습득의 목적으로 WDRL Web Development Reading List 을 번역해 보고자 합니다. 12년의 의무 영어교육에도 불구하고 의역과 오역이 난무합니다. 제보를 언제나 환영합니다. 이메일과 댓글로 부탁드립니다.
번역하려는 WDRL에 대한 소개는 아래 Smashing Magazine의 글로 대신합니다.
업계에서 무슨 일이 일어나고 있을까요? 최근에 어떤 중요한 기술이 등장했을까요? 새로운 케이스 스터디나, 통찰(insighits), 기술 그리고 도구들이 있을까요? 친애하는 Anselm Hannemann 께서 이 모든 것들을 Web Development Reading List를 통해 추적하고 있습니다. 지난 한 주 동안 일어난 일들과 당신이 관심있어할 만한 것들을 신중하게 모아봤습니다.
Smashing Magazine Ed.
번역문
매주 20개의 흥미로운 Link들을 발행하고 있다. 이미 50여개 이상의 자원 중에서 선발하고 있지만, 이마저도 독자들이 계속해서 주의를 기울이기에는 매우 힘든 것으로 보인다. 종종 사람들에게서 “아직 지난 WDRL들을 자세히 읽어보지 못했어, 미안.” 하는 이야기를 듣곤 한다. 내가 뭐라고 답했을까? 충분히 이해한다. 모든 것을 읽는 것은 불가능하다. Tim Kadlec이 말했듯이, 모든 것을 알 순 없다: “In fact, we can’t know everything about the web.“
News
- 두 달 전, PHP7이 마침내 릴리즈되었다. 퍼포먼스 향상과 새로운 feature를 경험하기 위해 지금 준비하자.
- 사파리 9에 shrink-to-fit: no property in the viewport meta element가 추가되었다. 새로운 웹킷 버전의 initial-scale 속성의 변경에 따른 변화이다.
- ES2016에서 비동기 코드 작성이 쉬워진다. Chakra와 Microsoft Edge 브라우저에서 추가적인 기능을 활성화하면 사용 가능하다.
Concepts & Design
- 최근 UI 프레임워크의 대두와 더불어 프론트엔드 프레임워크와 웹앱의 복잡도가 증가하면서 웹은 나날이 지루해지고 있다. 부트스트랩이나 Material UI Design 등의 비슷한 레이아웃을 참조하며 거의 차이가 없다. 이런 디자인 원칙들 덕분에 우리는 개발자로서 훨씬 쉬운 삶을 살게되었지만, 그러는 동안 우리는 웹의 개별성과 다양성을 잃었다. 이 선언은 웹을 다시 이상하게 만들고자 한다.
Tools
- PostCSS는 가장 새로운 CSS이다. “PostCSS Deep Dive“는 PostCSS가 무엇인지 설명하고, PostCSS가 무엇을 할 수 있으며, 또 그것을 사용함으로서 무엇을 얻을 수 있는지를 설명한다.
- CSS를 구축하고 검증하는 stylelint 옵션이 PostCSS에 추가되었다.
- JSLint에 대해서 알고있을 것이다. JSLint는 JSHint의 훌륭한 후계자이기에, ESLint에 대해서 처음 들었을 때에 왜 또다른 검증도구가 필요한지에 대해서 의문을 가졌을 것이다. Nicholas C. Zakas의 아티클에서는 그가 작성한 새로운 검증도구를 사용할 때에 얻을 수 있는 몇가지 장점에 대하여 이야기한다.
- Vagrant가 꽤 복잡하고 직관적이지 않다고 생각했던가? Vagrant의 제작사에서 그 뒤를 이을 새로운 도구를 제작했다. 개발환경구축과 쉬운 자동배포기능을 합친 도구인 otto를 만나보자.
Security
- Paul Lewis는 CORS, CSP, HTTPS 같은 현재의 접근방식과, 그리고 또 다른 여타 Security Layer들이 그동안의 발전과 실제 사용사례에 대한 연구에도 불구하고 많은 사람들에게 버림받고 있는 이유를 종합했다. CORS for Concern에서는 보다 안전한 웹을 위한 중앙집중방식 인프라 구조의 함정에 대해 이야기한다.
Privacy
- The Intercept를 통해 발간된 이 놀라운 글은 지능적인 기업들이 웹상의 모든 메타데이터 - 음악 네트워크, 쿠키, 비디오 웹사이트, 블로그 플랫폼, 전화, 그리고 사진과 온라인광고 등 - 를 추적해 거의 모든 사람들을 염탐해온 방법을 알려준다. HSTS/HPKP를 이용하여 HTTPS를 구현하거나 광고네트워크의 데이터 수집을 제한하여 유저들의 프라이버시에 더욱 촛점을 맞추고, CDN을 분산하여 각 자원들의 연관성을 떨어뜨려 MITM Attack을 방어하는 것은 개발의 관점에서 중요한 일이다.
Web Performance
- Nolan Lawson은 브라우저 저장소의 퍼포먼스와 그것이 DOM에 미치는 영향에 대해서 더 많은 것을 알고 싶어했다. 알고보니 그것은 복잡하며, I/O 퍼포먼스를 상향할 것인지 DOM Rendering Block을 피할 것인지에 따라, 그리고 각각의 브라우저에 따라 다르다는 것을 알 수 있다.
- 플리커 개발팀의 의 A Behind-the-scenes 아티클은 GPU를 이용하여 어떻게 Image Resizing Service의 속도를 올릴 것인지를 알려준다.
- Yoav Weiss는 진행중인 Netinfo API의 초안이 개발자들이 원했던 것이 아닌 이유와 함부로 추측하지 않고 웹사이트와 응용프로그램을 선택하는 것이 더 중요한 이유에 대해 설명한다.
Javascript
- Ember를 사용하지만 run loops에 대한 사용설명을 따르지 못하고 있다면, Ember Run Loop 에 대한 Free Guide가 여기 있다.
- 수년간 복사/붙여넣기에 Flash를 사용해 왔지만 마침내 순수 Javascript만으로 구현이 가능해졌다. Zeno Rocha의 clipboard.js는 복사/붙여넣기를 쉽게 구현하며, 브라우저도 폭넓게 지원한다.
- ponyfoo의 ES6 아티클 시리즈는 계속되고 있으며 ES6 Promises 작동방법에 대해 깊이있게 탐구하고 있다. 뿐만 아니라 visualize promises의 성능을 개선하기 위해 Prmoisees를 사용할 수 있다.
- YouTube player를 커스텀해보고 싶었다면, youtube.js를 써보자.
- Apple의 새로운 3D force touch action을 이 Javascript 라이브러리로 구현할 수 있게 되었다. framer.js 블로그 포스트로 그 사용방법과 action의 응답에 대해 배워보자.
CSS / Sass
- Chris Coyier는 knockout text를 할 수 있는 서로 다른 방법에 대해 썼다. 꽤 긴 시간동안 이 효과를 구현하기 위해서는 Photoshop만이 유일한 방법이었으나, SVG뿐만 아니라 심지어 CSS로도 어느정도 가능해 졌다.
Work & Life
- Paul McMahon은 실질적으로 필요한 내용이 없는 채용공고가 너무 많다는 것에 짜증이 났다. 그는 유용한 팁이 담긴 “채용공고를 쓰는 방법“을 썼다. 만약 채용을 계획중이라면, 이 힌트를 통해 당신의 채용공고를 보충하라.
덧붙여…
- 처음 이 기사를 읽었을 땐 좀 이상해 보였다. 하지만 우리 행성의 다양성을 이미 3/4 정도를 잃었고 몇몇 똑똑한 사람들이 세계의 남은 씨앗들을 저장하려한다는 것을 읽었을 때에 흥미를 느꼈다. 우리의 후손들이 우리가 일생을 거쳐 해온 것들을 재추적할 수 있도록 보살펴온 사람들이 있음을 기쁘게 생각한다.
- “Dear Tech Industry,“로 시작하는 Jenn Downs가 작성한 이 훌륭한 기사는 기술산업에 종사하는 회사와 사람들이 기술에 대해 더 알고 있다는 사실만으로 스스로를 타인들보다 똑똑하다고 생각하지 말아야한다고 이야기한다. 대신, 지역 자선단체와 문화에 환원하는것이 더 중요하다.
- Gnome outreachy 프로그램은 오픈소스로 함께 참여하고 발전한 좋은 예이다. Mozilla는 당신이 미래에 도움을 줄 수도 있는 것들에 대한 로드맵을 공유하였다.
여기까지가 이번 주의 내용이다. 매주 써왔던 나의 글이 좋았다면, 후원과 공유를 부탁한다. 이 프로젝트에 드는 비용을 확인할 수도 있다. 이메일과 RSS, online으로 제공된다.
감사합니다.
Anselm.