ElegantCoder::blog()

Blogs

하이브리드 프론트엔드 개발 5원칙

3년 정도 하이브리드 플랫폼들을 경험했다. 하이브리드 플랫폼은 정말 여러 곳에서 쓰이고 있다. 하지만 그 모든 플랫폼이 크롬, 파이어폭스만큼 우수한 디버깅 환경을 제공하지는 않는다. 에뮬레이터를 지원하지 않는 경우는 부지기수이고 한 줄이라도 수정하면 앱을 종료했다 다시 켜야 변경사항이 반영되는 때도 있다. 오늘도 하이브리드 개발 중에 API 서버가 죽었다. 일정도 꼬인 김에 하이브리드 개발 때 도움이 될만한 팁을 공유해본다. 독립된 API 서버를 갖춰라 가능하다면 독립된 API를 갖는 게 좋다. 하이브리드 앱은 API와 통신이 많은 부분을 차지한다. 끊임없이 개발되고 있는 와중에 개발 중인 API가 안정적이기를 바라는 것은 무리다.

더 효과적인 피어 코드 리뷰를 위한 여섯가지 방법

한빛미디어에서 당신의 동료가 더 효과적으로 코드리뷰를 할 수 있게 만드는 여섯 가지 방법 라는 좋은 글을 접했습니다. 그런데 읽다보니 번역문이 이해하기 어려운 점이 많아서 원문을 다시 읽게되었고 요약하게 되었습니다.

램디스크로 더 빠른 개발환경 구축하기

최근에 한 웹앱 프로젝트를 완료했다. 이 프로젝트를 진행하면서 램디스크를 오랫만에 사용해보게 됐다. 웹앱은 특히 HTML템플릿을 많이 사용했는데 그 특성상 처음 퍼블리싱된 파일이 너댓개 템플릿으로 분리되는 것이 예사였다. 파일이 많아지면서 프로젝트 내에서 파일이름을 검색해 여는 단순한 작업도 은근히 느려지는 것을 느꼈다. 그리고 파일 내부 검색에도 시간이 오래걸렸다. 처음에는 SSD 로 업그레이드를 해야하는가 고민했지만 마침 얼마전 램을 16GB로 업그레이드 하면서 평소 메모리 사용량이 꽤 많이 남게 되어서 활용하기로 했다. 램드라이브를 사용하게 되면서 파일이름을 검색하든 파일 내부를 검색하든 버벅거림이 전혀 없고 아주 만족하며 사용중이다.

자바스크립트의 변수형을 알아내는 다른 방법

JavaScript 의 변수형을 알아내는 데는 일반적으로 typeof 를 사용한다. 하지만 toString 을 사용하면 어떤 객체의 인스턴스인지까지 한번에 알아낼 수 있다. JavaScript 의 변수형을 알아내는 데는 일반적으로 typeof 를 사용한다. 이 방법이 가장 간단하고 일반적인 방법이다. typeof 가 나타낼 수 있는 변수형은 아래와 같다. undefined, object, boolean, number, string, function, object typeof 가 변수에 대한 기본적인 호기심을 해결해주긴 하지만 몇가지 모자란 점이 있다.

웹호스팅환경에서 git push 때 자동으로 pull 하기

ssh, bare repository, post-receive hook 을 사용해 로컬저장소에서 push 하면 호스팅 서버에서 자동으로 pull 받을 수 있는 환경을 꾸며봅니다. Bitbucket 에서 private 저장소를 만들어 버전관리를 하고 있는 프로젝트가 있다. 웹 프로젝트이고 이 프로젝트의 결과물은 Cafe24 에 월 500원짜리 웹호스팅에서 서비스된다. 처음엔 remote origin 을 Bitbucket 으로 두고, 이 저장소를 통해 로컬과 호스팅 서버간의 통신을 했다. 소스를 고치고 push 하고, 호스팅서버의 커맨드라인에서 pull 을 해야했으니 매우 불편했다.

jQuery 요소 선택의 성능문제, 셀렉터와 탐색 중 어떤 것이 더 빠를까?

스택오버플로를 둘러보다 아래와 같은 질문을 찾았다. Is jQuery traversal preferred over selectors? jQuery 에서 요소 선택의 성능문제를 묻는 질문인데, $("#vacations").find("li").last(); $("#vacations li:last"); 이 두 가지중 어떤 것이 더 빠를까?

자바스크립트 파일이 세미콜론으로 시작하는 이유

어떤 코드를 살펴보면 자바스크립트 파일이 세미콜론으로 시작하는 때가 있다. ;(function () {})(); 왜일까 궁금했었는데 스택 오버플로를 살펴보니 대략 아래와 같은 답변이다. 이 세미콜론은 자바스크립트 파일을 합칠 때(concatenating) 안정성에 도움이 된다.

Facebook Comment 를 Disqus 로 내보내는 FB2Disqus

페이스북의 Social comment 를 잘 사용하고 있었지만, Disqus 로 옮기고 싶었다. 페이스북 사용자가 아니면 댓글을 달기 어려운 면이 있기 때문에 좀 더 확장하고 싶었다. 그리고 더 큰 이유는 디자인 이었다. 블로그를 새로 꾸미면서 블로그 글 영역을 가변폭으로 만들었는데 Facebook 의 social comment 는 고정폭 만 지원하고 있다.

SSI 를 활용한 프론트엔드 리소스 버저닝

개요 리소스 버저닝은 리소스 캐시를 목적으로 한다. 리소스 캐시는 해당 파일이 변경된 경우 컨텐츠를 새로 전송(Cache Miss)하고, 변경되지 않았다면 컨텐츠를 전송하지 않는(Cache Hit)다. 많이 사용되는 방법으로 버전이름을 쿼리스트링(Query String, GET 파라미터라고도 함)에 명시하는 방법이 있다. 버전이름을 쿼리스트링에 명시하는 방법은 [gist:4754498:exam

브라우저 자동완성 기능의 미래

Form element 에 autocomplete 기능이 소개된 것은 1999년 Internet Explorer 5이 최초였다. 이후 각 브라우저 별로 산발적으로 지원하던 자동완성 기능은 HTML5에 이르러 표준화 되었다. HTML5 스펙은 2012년 12월 17일 버전으로 기준으로 함. 이전 스펙에서 autocomplete attriute 는 "on" 또는 "off" 값만 가질 수 있었으나 최근의 스펙에서는 on, off 외에 공백으로 분리된 토큰들을 가질 수 있다. 이에 따르면 attribute 이 on, off 가 아니라면 아래와 같은 순서로 동작한다. 첫 8글자가 "section-" 으로 시작하는 경우 필드가 이름을 가진 그룹에 속함을 나타낼 수 있다.
Syndicate content