site 1
url : BulmaBulma is a free and open source CSS framework based on Flexbox.
site 2
url : pure.cssA set of small, responsive CSS modules that you can use in every web project.
site 3
url : Flexbox GridA grid system based on the flex display property.
site 4
url : UIkitA lightweight and modular front-end framework for developing fast and powerful web interfaces.
site 5
url : MilligramA minimalist CSS framework
site 6
url : BaseguideA lightweight and robust CSS framework for prototyping and production code.
반응형 웹사이트 작업을 하다보면 디바이스에 따른 화면 구상과 이를 표현해줄 CSS 때문에 많이 고민을 합니다.
Bootstrap을 이용하면 grid 부터 modal, input 등등 여러가지 해결을 할 수 있지만(익숙해져서..) 다양한 기능들이 들어 가 있는 만큼 파일 사이즈도 크고 로딩 시간이 오래 걸릴 수 밖에 없습니다.
그리고 막상 사용해 보면 어떤경우 grid 기능만을 사용하고 다른 기능을 사용하지 않는경우가 많아서 좀 더 가볍고 사용하기 쉬운 프레임워크가 없을지 여러 사이트를 다녀보다 그나마 마음에 드는 몇가지들이 있어 소개 합니다.
Bulma
최근에 새로 다운 프레임워크 입니다. 아직 v1.0 도 나오지 않은 (현재 v0.6.1) 따끈따끈한 녀석으로 Flexbox로 제작되었습다.
메뉴얼 정리도 잘 되어 있고 속도도 나름 괜찮아서 한번 사용해 보면 괜찮을 듯 합니다.
pure.css
최소한은 기능으로 이루어진 프레임워크입니다. 압축된 크기가 3.8kb라고 하니 부트스트랩과 비교 자체가 되지 않네요.
부트스트랩의 경우 압축해도 155kb정도 되니 40배 차이가 나네요.
normalize.css 도 내장되어 있다니 또 다른 장점이 아닐까 싶습니다.
다른 프로젝트에서 꼭 한번 사용 해 볼까 합니다.
Flexbox Grid
왠지 class 명이 bootstrap과 비슷해서 쓰기 편할거 같은 기분이 드네요.
용량도 12kb 정도 이니 이것도 한번 써봐야 기능을 좀 더 알 듯 합니다.