2015/01/12 02:13 - the1900
보통 Fonr-end 개발시 생산성이나 기타 이유로 인해 프레임워크를 많이 사용합니다 그중에서도 Bootstrap이 가장 유명할 것입니다.
Bootstrap외 에도 Foundation이란 프레임워크도 존재합니다. 이 둘은 반응형 웹을 위한 휼룡한 프레임워크입니다 하지만 저는 RIA개발을 위해 UIkit을 선택했습니다.
UIkit은 제가 살펴본 프레임워크들중 가장 컴포넌트간 결합도가 낮습니다. 이것이 의미하는 바는 굉장히 큽니다.
예를 들어 RIA 메뉴를 보면 off-canvas와 accordion, Sticky 라고 각각 불리우는 기능들이 구현되어있습니다.
Foundation 이나 Bootstrap으로 이를 구현하려면 굉장히 어렵습니다. CSS나 Javascript를 40%이상 원본에서 수정해야 가능 할것입니다. 실제로 저는 RIA 초기 버젼을 Foundation 으로 개발하다가 RIA 메뉴를 Foundation 프레임워크를 통해 구현하려면 아예 해당 자바스크립트와 CSS코드를 다시 만들어야 되는 상황이 되어버려서 도중 포기하고 UIkit으로 갈아타 겨우 RIA 스킨을 완성했습니다.
UIkit은 앞서말한 컴포넌트간 결합도가 낮음에도 불구하도 Bootstrap보다 다양한 기능을 제공합니다.
실제로 Bootstrap은 Javscript를 통해 제공되는 컴포넌트가 12개인 반면 UIkit은20개 이상입니다 게다가 무려 웹 에디터도 존재합니다. 웹 에디터는 우리가 티스토리나 네이버 블로그를 포스팅할때 사용하는 에디터를 말합니다. 요즘은 보안상의 이유로 XSS 같은 공격에 대비하기위해 치환방식을 많이 사용하는데 UIkit은 이러한 치환방식의 웹 에디터 컴포넌트를 제공합니다.
UIkit은 실시간으로 커스터마이징된 결과를 볼수있습니다. 아래의 웹 어플리케이션으로 말이죠.
또한 UIkit은 기본적으로 Front-end의 필수라고 불리는 Jquery와 Font-awesome 이 자동으로 포팅되고 포함되어있기 때문에 UIkit만 사용해도 라이브러리가 더 필요하지 않습니다.
반응형웹의 필수의 그리드 같은경우 Bootstrap은 768px 를 기준으로 모바일인지 아닌지를 판별하는데 UIkit는 이를 조절할수있습니다 Foundation은 참고로 640px가 기준입니다.전에 포스팅한 Troy를 보시면 아시겠지만 현재의 모바일은 768px보다 640px 가 더 모바일에 맞는 기준 해상도입니다.
굳이 단점이라면 한국어로된 예제라던가 레퍼런스가 부족하다는게 흠입니다ㅋㅋㅋ
