TOAST UI

프론트엔드에 대한 단위 테스트를 작성하도록 요청받았을 당시에만 해도 나는 Vue 애플리케이션을 테스트하는 것에 대해 전혀 몰랐다. 그래서 vuejs 테스트에 대해 알아보고 배운 것을 공유하고 싶다.

컴포넌트들이 항상 같은 구조로 되어 있진 않다. 그리고 때론 관리해야할 상태들이 많을때도 있다. 이런 문제는 비동기적인 방법으로 해결할 수도 있다.

오늘날 웹 애플리케이션들은 굉장히 크고, 대부분 자바스크립트로 만들어진 것이다. 2018년 중순, HTTP Archive가 보여준 모바일 장치에서 자바스크립트의 평균 전송 크기는 약 350 KB 이다.

본 시리즈의 이전 아티클에서는 웹팩4에 대해 다루면서 바로 쓸 수 있는 환경을 만들어봤다. 이번편에는 그 환경 그대로 이용해 ES6 개발 환경을 추가한다. ES6는 이제 충분히 써도 될만한 시기라고 생각한다. "나는 프런트 개발자가 아니기도 하고 브라우저가 모두 지원하지도 않기에 ES6는 아직 못쓴다" 라고 생각하고 있다면 이 글을 통해 생각을 바꿀 수 있길 바란다. 어차피 쓰는 거 ES6뿐 아니라 ES8까지 사용하는 것을 권장한다.

Proxy는 ES2015에 소개된 기능이다. IE11을 제외하고는 모던 브라우저에서 지원하고 있어서 사용할 수 있다. babel 트랜스파일로도 지원되고 있지 않지만, 구글에서 폴리필을 만들어 공개하고 있다.

러스트(Rust) 커뮤니티의 2018년 최대 목표는 웹 언어가 되는 것이다. 웹 어셈블리(WebAssembly)를 타깃으로 러스트는 자바스크립트처럼 웹에서 실행될 수 있다. 그런데 이것이 무엇을 뜻하는 걸까? 러스트가 자바스크립트를 대체하려는 걸까?

필자는 풀타임 개발자의 업무를 작은 회사에서 처음 맡았다. 우리는 BrowserStack을 가지고 있지 않았기 때문에 임시 변통 장치 실험실을 함께 만들었다. 부서진 1세대 iPad와 오래된 버전의 Safari로 그 웹사이트를 봤을때, 필자는 왜곡과 부서진 잔해들이 보였다. 필자는 한때 웹을 "상상할 수있는 가장 적대적인 소프트웨어 엔지니어링 환경"이라고 생각했던 Douglas Crockford의 말을 떠올렸다. 올해 초 Verge 의 광범위하게 공유 된 기사는 웹에서 볼 수있는 "Chrome에서 가장 잘 작동합니다."메시지에 대해 경고했다. 이 문제의 예가 더 있다. 널리 사용되는 메시징 앱 슬랙(Slack)은 Chrome에서만 음성 통화가 작동한다. 도움 요청에 대한 응답으로 Slack은 다음과 같이 설명했다.

Redux Saga는 테스트가 쉽기로 유명하다. 하지만, 더 간단해질 수 있다면 어떨까? Jeremy Fairbank는 더 간단한 테스트를 위해 redux-saga-test-plan을 디자인했다.

AngularJS의 디렉티브/컴포넌트에서 @ < & = 가 실제로 어떻게 동작하는 지 알아보고, < 기호가 어떻게 나머지 기호들을 대체할 수 있는 지 알아보자.

최근에 새로운 프로젝트를 진행하게 되면서 기존에 간만 살짝 보고 있던 뷰(Vue, 이하 뷰)를 본격적으로 도입하게 되었다. 사실 팀에서는 리액트를 선호하고 있었으나 회사 내부에서 뷰의 사용이 빠른 속도로 증가하고 있었고 그에 따라 팀내에서도 뷰에 대한 전문성이 필요하게 되었다. 뷰와 리액트는 서로 영향을 주고받고 발전해나가는 도구들이라 비슷한 부분이 많아 큰 어려움 없이 적응할 수 있었다. 새로운 프로젝트에서는 뷰를 사용하는것 뿐 아니라 다른 개발 환경도 요즘 것들로 업그레이드 해봤다. 웹팩 4 사용하고 테스트 러너도 기존에 팀 내에서 표준처럼 사용하던 카르마(Karma)에서 요즘(이미) 잘나가는 제스트(Jest)로 새롭게 시도해봤다.