Front-end

자바스크립트 비교연산자

매일 사용하는 자바스크립트일수록 기초가 중요한 것 같다는 생각에 좀 더 나은 코딩을 위한 비교연산자 사용에 대해 정리해 보려고 한다. 개발을 하다보면 많은 비교 연산이 있는데 값을 비교하기위해 ‘==’와 ‘===’를 많이 사용한다. 차이점은 전자는 값비교, 후자는 참조비교 정도로 알고 사용하게 되는데…

-webkit-overflow-scrolling 사용시 배경색 black으로 노출되는 현상

웹페이지의 UI에 터치 스크롤을할 경우 일반적인 스크롤은 스크롤된 영역만큼 움직이고 손을 떼는순간 바로 멈추게된다. iOS에서는 사용자 경험 개선을 위해? 사용자가 UI를 스크롤할 경우 해당 요소에 가속도 기반의 스크롤을 사용할지를 아래의 css값을 사용하여 처리할 수 있다.

위 속성은 ‘auto’, ‘touch’…

Android, IOS Webview 개발 팁

최근에 webview를 사용하는 서비스의 SPA작업을 진행하면서 OS별 이슈 및 솔루션을 정리해 보았다. 아래 정리된 내용은 정답도 최선도 아니지만 참고하면 많은 삽질을 줄이고 즐겁게 개발할 수 있을 것 같다. IOS position:fixed + 키패드 활성화시 이슈 IOS에서 position:fixed 속성을 사용하면 키패드 활성화…

BackboneJS 서브 뷰 사용하기

BackboneJS는 MV* 패턴을 사용하는 경량 프레임워크로 메인뷰에서 서브뷰를 사용할 수 있다. 서브뷰를 사용하면 경우에 따라 유지보수하기 좋은 좀 더 모듈화된 코드를 만들 수 있을 것 같다.

자바스크립트 문자열 인코딩/디코딩

자바스크립트 문자열 인코딩 디코딩 메소드별 차이점에 대해서 정리해 보려고 한다. 이번에 검색 작업을 하면서 #태그를 사용할 일이 생겼었다. 평소처럼 encdoeURI/decodeURI를 사용하여 처리 했는데 #가 인코딩 되지 않아 문제가 발생하였다. 확인해 보니 encodeURI는 아래표의 예약어를 제외하고 인코딩 한다고 나와있다. #는 Number…

ReactJS 세미나

FBDG(https://www.facebook.com/groups/reactist)에서 주최하는 첫번째 meetup을 다녀왔다. ReactJs를 다룬다고 하길래 신청했고 대기자가 43명인데 다행히 참석할 수 있었다. (사실 막상가보니 대기자여도 갔어도 되는거 같은 분위기이긴 했다..ㅋ) 오늘 다룬 내용은 리액트 전반에 대한 설명과 실사례, 리덕스, 플러스유틸 4가지였다. * 페이스북은 리액트를 어떻게 만들었나? –…

HTML5 LocalStorage

모바일 검색 자동완성에 최근검색어를 같이 출력하기 위해 사용자 디바이스의 localStorage에 최근검색어를 저장하기로했다. 해서 간략히 정리해 본다. (PC 브라우저의 경우 익스플로러는 8부터 지원한다.) HTML5에서 제공하는 클라이언트 저장소는 localStorage와 sessionStorage 두가지인데 localStorage만 정리해보겠다.   특징 window.localStorage – stores data with no expiration date…

JSHint Options

gruntfile.js 작성하면서 jshint 옵션을 줘야하는데 뭐가뭔지 모르겠어서 구글링하다가 잘 정리되어 있는 아래의 블로그를 발견했다. 더 자세한 옵션은 JSHint Option 를 참고 하면된다. 출처 http://blog.outsider.ne.kr/1007 금지(Enforcing) 옵션 아래의 옵션을 true나 특정 값으로 설정하면 JSHint가 해당 내용을 검사해서 더 많은 오류를 알려준다. (옵션을 지정하지…

[Bower] Front-end Package Manaer

학생 때 책에서 잠깐 봤었는데 이걸 사용할 일도 없었고 뭔가 어려워 보여 사용해 보질 못했다. Bower는 프론트개발을 위한 패키지 매니지 시스템이다. 프론트단이 점점 거대해 지면서 서비스 의존성 관리를 위해 만들어 졌다고 하는데, 여기서 의존성은 뭘 말하는지 잘 모르겠다. (누가 댓글로…

[Js] null, undefined 차이점

자바스크립트 데이터 타입중에 null, undefined라는 것이 있다. 둘다 비슷한 느낌의 데이터 타입인데 뭔가 애매하긴하다. 개인적으로는 undefined는 거의 사용하지 않고 null을 사용하는데 undefiend는 초기화 되지 않은 변수를 나타내고, null은 빈 객체를 나타내기 위해 사용한다. 둘다 문법적으로 크게 문제가 될 일은 거의 없을…

자바스크립트 샌드박스 패턴

자바스크립트 샌드박스 패턴 어떤 모듈이 다른 모듈과 그 모듈의 샌드박스에 영향을 미치지 않고 동작할 수 있는 환경을 제공한다. 라고 책에 나와있던데 모듈네임스페이스만 보호하면 SandBox내부에서 아무 작업이나 해도 되는듯 싶다. 싱글톤에 이은 신세계발견 정리 샌드박스는 말그대로 유일무이한 샌드박스 공간을 제공한다. 샌드박스 생성자…