-
CodeMirror 3으로 업그레이드하기
CodeMirror는 웹 브라우저에서 코드 편집 기능을 제공할 수 있게 하는 자바스크립트 컴포넌트입니다. 자바스크립트, CSS, HTML은 물론 C, Java, PHP, Python, Ruby 등 50여 종의 언어 모드(Mode)를 지원하며, 문법 강조, 단축키, 자...
Category: 자료 - 웹개발, Reactions: 4, Views: 99,707, Author: 파이어준
-
The Velox 프로젝트 공개 그리고 클로즈 베타
입사 후 처음으로 수행한 웹 프로젝트가 1년만에 슬슬 마무리 단계에 접어들고 있습니다. 개발자라고는 저 혼자인 상황에서 막연하게 시작했던 프로젝트입니다. 백-엔드 개발자 뽑느라고 4개월 허송세월 보내고,...
Category: 자료 - 웹개발, Reactions: 27, Views: 199,844, Author: 파이어준
-
아이콘 웹 폰트 라운드업
업무가 슬슬 재미있어지고 있습니다. 회사에 그래픽 디자이너가 없다 보니 맘대로 사이트를 작살내고 있는 와중에 하나 둘 드러나기 시작하는 시각적 불만족을 잠재울 아이콘 폰트를 찾고 있던 참이었습니다. 구...
Category: 자료 - 웹개발, Reactions: 12, Views: 122,121, Author: 파이어준
-
PrismJS 문법 강조 언어 추가하기
얼마 전 소개했던 PrismJS는 아직 HTML, CSS, JS만을 지원하고 있습니다. 지금 즈음 다른 언어를 지원하지 않을까 해서 살펴보니 역시나 있더군요. 제가 발견한 현재 확장 가능한 언어는 JAVA, PHP, Bash 그리고 모든 C 스타...
Category: 자료 - 웹개발, Reactions: 2, Views: 75,914, Author: 파이어준
-
쩌는 jQuery 모달 플러그인 - Avgrund
Avgrund는 Dmitri Voronianski씨가 작성한 모달 박스를 출력하는 jQuery용 플러그인입니다. 모달 박스가 출연할 때 원래 페이지와의 깊이를 표현하는 흥미로운 개념을 도입했습니다. 이는 CSS에서 transition 그리고 transform 속...
Category: 자료 - 웹개발, Reactions: 16, Views: 87,982, Author: 파이어준
-
HTML5 게임 프로그래밍
HTML5 게임 프로그래밍은 Jacob Seidelin씨가 작성하고 webgenie(장현희)님이 현지화한 개발 서적으로, HTML5를 이용하여 완성도 높은 보석 퍼즐(비주얼드와 유사한) 게임을 만드는 과정을 소개하고 있습니다. 데스크탑/모...
Category: 정보 - 도서, Reactions: 3, Views: 52,766, Author: 파이어준
-
레이어를 CSS3로 변환하는 포토샵 플러그인 - CSS3Ps
CSS3Ps는 포토샵에서 생성한 레이어를 CSS3로 변환해 주는 클라우드 서비스 기반 포토샵 플러그인입니다. 여러 레이어 또는 레이어 그룹을 선택하고 한 번의 클릭으로 변환할 수 있습니다. Gradient, Inner Shadow, Inner Glo...
Category: 자료 - 웹개발, Reactions: 19, Views: 69,071, Author: 파이어준
-
webkit-overflow-scrolling 속성 사용하기
iOS(아이폰/팟/패드) 그리고 안드로이드 기기에서 화면을 던지는 제스처로 화면을 스크롤링(이동)하는 인터페이스는 이제 우리에게 익숙합니다. 물론 전체 웹페이지에도 마찬가지로 적용되지만, 페이지 내 일부 요...
Category: 자료 - 웹개발, Reactions: 4, Views: 97,707, Author: 파이어준
-
레티나 그래픽을 당신의 웹사이트에 - Retina.js
Retina.js는 사용자 기기의 레티나 디스플레이 지원 여부를 구분하여 이에 맞는 고해상도 이미지가 있는지를 확인한 후 교체해주는 스크립트입니다. 레티나 디스플레이용 고해상도 이미지를 준비하는 규칙은 애플...
Category: 자료 - 웹개발, Reactions: 16, Views: 74,392, Author: 파이어준
-
섹시한 문법 강조기 - Prism.js
PrismJS는 모던 웹 표준에 기반을 두었으며 가볍고 확장 가능한 문법 강조기입니다. 3가지 테마를 제공하며 위에 기본으로 적용된 테마는 "Funky"에요. 위와 같이 "prism.js"와 "prism.css"를 HTML에 코드를 추가하고 코드가 ...
Category: 자료 - 웹개발, Reactions: 6, Views: 49,130, Author: 파이어준
-
CSS 3D Transform 기반의 작은 3D 엔진 - Sprite3D.js
Sprite3D.js는 CSS 3D Transforms 속성을 이용하여 3D를 구현하는 작은 자바스크립트 3D 엔진 라이브러리입니다. 체이닝 형식의 섹시한 구문을 사용하여 HTML 요소(<div>)를 간단하게 3D 객체로 래핑할 수 있습니다. CSS 3D ...
Category: 자료 - 웹개발, Reactions: 5, Views: 112,564, Author: 파이어준
-
JSBin 2.9.8 커스토마이즈
그동한 소스분석 용도로 잘 사용해 오던 JSBin을 새로운 버전으로 업데이트 하려다가 커스토마이즈 하는 기쁨에 쉼취해 회사일도 마다하고 최근 3주간 불꽃 코딩을 작렬했습니다. 애용중인 맥용 소스코드 편집기인...
Category: 자료 - 웹개발, Reactions: 21, Views: 134,834, Author: 파이어준
-
IE 버전에 따른 하위 호환성을 HTML만으로 구분
하위 버전 의존도가 높은 IE에서 호환성을 유지하기 위해 다양한 방법의 트릭들으로 스타일을 유지해 왔습니다. IE 관련 스타일 이슈들이 디펙되어 가는 모습은 마치 게임속의 몹을 잡는듯한 희열을 안겨주지만, ...
Category: 자료 - 웹개발, Reactions: 8, Views: 79,789, Author: 파이어준
-
HTML5 제대로 알고 씁시다! - html5please.us
HTML5의 현재 상황을 제대로 알고 사용하자는 취지로 만들어진 웹사이트인 html5please.us는 HTML5와 CSS3 등에서 지원하는 기능들을 찾고, 그것이 사용할 준비가 되어 있는지 알고, 대략적인 개념을 설명하고 있으며, 꼭...
Category: 자료 - 웹개발, Reactions: 40, Views: 145,359, Author: 파이어준
-
CSS3와 자바스크립트를 이용한 프리젠테이션 impress.js
사내 개발자가 아닌 분들을 대상으로 하는 HTML5 발표가 있어서 자료를 조사하던 중 Bartek Szopka씨가 만든 impress.js를 발견하고 소개했습니다. 보시던 분들의 반응이 아주 좋더군요. impress.js는 CSS3와 자바스크립트를 ...
Category: 자료 - 웹개발, Reactions: 11, Views: 170,610, Author: 파이어준