웹 프론트엔드 개발

HTML / CSS / JavaScript 개발을 포괄해서 웹 프론트엔드 개발이라고 한다. 웹 퍼블리싱, 웹 코딩 등으로 불리기도 한다.

패키지

패키지 관리

CSS, JavaScript 패키지들을 쉽게 설치해주는 도구로 bower가 있다. 웹 개발의 필수 도구다.

필수 라이브러리

위지윅 에디터

오픈소스로는 오랫동안 CKEditorTinyMCE가 경쟁해왔고, 최근 몇 년간 CKEditor가 앞서 나갔으나, 버전 4를 발표하면서 문서가 개판이 되었고, TinyMCE는 버전 4를 발표하면서 좀더 좋아졌다. 에디터와 엮어서 개발해야 할 것이 많다면 TinyMCE 추천.

redactor는 최근에 등장해서 높은 평가를 받고 있고, 제공하는 기능이 가장 안정적이라고 평가되지만 API가 다소 부족하고 문서도 부실하다. 국산으로 summernotejQuery, Bootstrap, FontAwesome을 활용해서 개발되어 코드 양으로 효과적으로 줄여 미래가 촉망되지만, 아직은 문서가 부족하다. 위지윅 에디터들이 처음 나올 때는 jQueryBootstrap도 없기도 했고, 라이브러리 의존성이 제약사항이 되기 때문에 그런 기능들을 전부 자체 개발해왔는데 앞으로는 summernote 같은 아키텍처가 더 유리할 것 같다.

기타 유용한 라이브러리

HTML / CSS

CSS 설계 원칙 같은 글을 있지만, 이제는 그냥 Bootstrap이 베스트 프랙티스다.

Responsive Design

CSS 문제 해결

IE CSS Hack

float 엘리먼트의 컨테이너의 height가 0이 되는 문제

IE6 position:absolute bug

파일 업로드 버튼 CSS로 꾸미기

IE6 png 투명 문제

개발 도구

IE 버전별 테스트

http://osxdaily.com/2011/09/04/internet-explorer-for-mac-ie7-ie8-ie-9-free/

기타