The Frontend Engineer

karma-bower-wiredep

karma 로 테스트를 실행할 때 귀찮은 점 중 하나는 karma config 에 실행할 파일을 순서에 맞추어 명시해주어야 하는 부분이다.

files: [
    'vender/base_lib.js',
    'vender/widget_lib.js',
    'vender/foo_widget.js',
    'src/app.js',
    'test/app_spec.js'
],

특히나 bower 로 dependency 관리를 할 경우 그러한데, 이럴 때는 bower dependency 를 줄세워주는 wiredep 을 활용할 수 있겠다. 한가지 문제는 wiredep 은 .html, .css 파일에 대한 replace 는 기본 지원해주지만, .js 파일에 대한 replace 는 기본 지원해주지 않는다. .js 파일을 replace 하고 싶을 경우엔 wiredep options 에 아래와 같이 넣어주면 된다.

# grunt-wiredep coffeescript example
fileTypes:
    js:
        block: /(([\s\t]*)\/\/\s*bower:*(\S*))(\n|\r|.)*?(\/\/\s*endbower)/gi
        detect:
            js: /'(.*\.js)'/gi
        replace:
            js: '\'{{filePath}}\','

참고: https://github.com/taptapship/wiredep#configuration

폴리글랏 프로그래밍

폴리글랏 프로그래밍 책 표지

Polyglot Programming: 여러가지 언어(Programming Languages)를 조합하여 프로그래밍 하는 행위

프로그래밍 언어의 흥망성쇄(라이프사이클)를 통해 현대 프로그래밍 언어의 패러다임 변화. 좀 더 구체적으론 Java 언어의 보수적 판단, 정체된 상황에 대한 이야기와 C#, Scala 를 위시한 새로운 언어로의 패러다임 변화에 대한 이야기.

그 외에 여러가지 프로그래밍 언어들의 역사와 뒷이야기들, 그리고 Closure, Lambda, Generic, Mixin 등의 개념들에 대한 설명이 주를 이루고 있다.

무엇보다 Java 언어의 지나온 길이 Java 를 주 언어로 다루고 있던 우리 회사의 상황과 묘하게 닮아있는 점이 흥미로웠다.

Bootstrap with ember-cli

ember-cli 는 Ember.js 를 활용해서 SPA를 만들려고 할 때 필요한 것들 — dependency management, merge, minify, simple server, directory structure — 을 제공하는 도구다. 전신이던 ember-app-kit 시절에는 blueprint 성격으로 회자가 되었는데, command line 도구 형태로 바뀌면서 이젠 대세로 자리잡은 듯하다.

ember-cli 는 외부 package 관리는 bower, resource 관리는 broccoli (node 계열의 asset pipeline) 를 활용하고 있는데 이 환경에서 Bootstrap(+glyphicons) 을 추가하고자 한다면 아래와 같이 하면 된다.

command line:

$ bower install --save bootstrap

Brocfile.js:

var EmberApp = require('ember-cli/lib/broccoli/ember-app'),
    mergeTrees = require('broccoli-merge-trees'),
    pickFiles = require('broccoli-static-compiler');

var app = new EmberApp();
app.import('vendor/bootstrap/dist/js/bootstrap.js');
app.import('vendor/bootstrap/dist/css/bootstrap.css');
var bootstrapFonts = pickFiles('vendor/bootstrap/dist/fonts/', {
    srcDir: '/',
    destDir: '/fonts/'
});

module.exports = mergeTrees([app.toTree(), bootstrapFonts]);

Fluent 2014, “Keynote With Yehuda Katz and Tom Dale”

http://www.youtube.com/watch?v=jScLjUlLTLI

Ember.js 만든 아저씨들의 “Framework”을 바라 보는 관점에 대한 영상. 재미있는 주제와 내용인데 반해 발표 준비가 완벽하지 않았던 것 같다. Angular / Ember 에 대한 구체 사례 빼고, 이야기 하고자 하는 주요 관점만 잘 정리했어 발표했으면 더 좋았을 텐데 :)

http://googletesting.blogspot.kr/2014/07/testing-on-toilet-dont-put-logic-in.html

whereas production code describes a general strategy for computing outputs given inputs, tests are concrete examples of input/output pairs

and

When tests do need their own logic, such logic should often be moved out of the test bodies and into utilities and helper functions.

지저분한 테스트 코드는 쉽게 버려지더라구요.