[JS] Blob와 Blob URL

Blob는 Binary Large Objects의 약자로 “대용량 바이너리 객체”쯤으로 해석할 수 있다. 이름 그대로 이미지, 동영상 등 단순 텍스트 데이터가 아닌 바이너리 데이터를 담을 수 있는 객체이다. HTML5에 들어서면서 자바스크립트에서도 이러한 파일을 다루어야 할 필요성이 생겨 File API 명세에 정의되었다. 이 글에서는 Blob 데이터를 구성하는 방법과 URL을 통해 Blob 객체에 접근하는 방법을 다루어 보겠다. Blob 데이터 …

조명 lamp

[JS] 조도(Ambient Light) API

조도(Ambient Light) API를 사용하면 디바이스 주변의 밝기가 변하는 것을 확인하고 이에 따라 애플리케이션의 동작을 제어할 수 있다. 2015년 1월 현재 지원하는 브라우저는 파이어폭스 뿐이며 파이어폭스도 OSX에서만 지원하는 API이다. 파이어폭스의 윈도우즈 지원은 진행 중이며, 크롬이나 IE 등 다른 브라우저에서는 아직 고려 단계에 있다. 사용 방법은 간단하다. window 글로벌 객체에 devicelight라는 이벤트를 추가하면 되는데, 디바이스 주변의 밝기가 …

Mustache 템플릿 문법

Mustache는 제어 구조를 갖춘 것 중 (아마도) 가장 문법이 간단하고 (아마도) 가장 많은 언어로 포팅된 템플릿 엔진입니다. Mustache를 기반으로 이를 확장한 템플릿 엔진도 여럿 있는데 대표적으로는 헬퍼 개념을 추가한 Handlebars와 트위터에서 만든 Hogan.js를 들 수 있습니다. 이 문서는 Mustache 공식 문서를 기준으로 작성되었으며 예제도 해당 문서에서 가져왔습니다. 많은 스펙 문서가 그렇듯 Mustache의 템플릿 문법 문서에도 …

웹 개발자 도구 이스터 에그

최근 나오는 웹 브라우저는 개발자 도구를 기본으로 탑재하고 있다. 본업이 프론트엔드 개발자이다보니 간혹 다른 사람들은 어떻게 마크업을 하고 자바스크립트를 사용하는지 보려고 다른 사이트에서 개발자 도구를 열어볼 때가 있는데 간혹 의외의 센스를 발견할 때가 있다. 이 글에서는 개발자를 위해 이스터 에그를 준비한 사이트 몇 개를 정리해보았다. 모질라 모질라 재단에서 운영하는 사이트에 들어가서 웹 개발자 도구를 켜면 …

[번역] 프론트엔드 개발자는 왜 구하기 어렵나요?

Why can’t we find Front End developers?를 번역한 글입니다. 저 스스로가 프론트엔드 개발자이기도 해서 재밌는 주제라 옮겨봤습니다. ^^ 어느날 우연히 Quora에서 프론트엔드 엔지니어링과 스타트업에 관련된 “Why is it that startups have trouble finding front end developers? (왜 스타트업에서 프론트엔드 개발자를 구하기가 어려운가?)”라는 글을 보게 되었다. 발제자는 다음과 같은 내용도 덧붙였다. (…) 엔지니어링 분야에서 프론트엔드 개발이 …