UI 센스가 치명적인 엔지니어가 그것 같은 웹 앱을 만들기 위해 사용한 무료 UI 라이브러리를 정리해 둔다

일 옆, 여가 부서든지로 웹 앱을 구축하거나 하는 것입니다만, 아무래도 UI센스가 너무 없어, 멋지게 사이트라든지를 참고로 흉내내거나 해도, 왠지 스스로 어레인지하면 엄청나게 어려워진다, 라고 한다 일을 반복해 왔습니다.

그래서, 이제 이렇게 되면 스스로 생각하지 않고, 모든 라이브러리에 의지하자! 라고 생각해 web 사이트를 구축했을 때에 사용한 css나 js의 프레임워크, 라이브러리 등을, 간단한 코멘트 첨부해 정리해 두려고 생각합니다.

css 스스로 일절 쓰지 않아도, 이 정도의 UI까지는 되지 않을 것 같습니다.





프레임워크



Bootstrap



베이스는 트위터 부트 스트랩의 혜택을 제공합니다.
GoogleMaterialDesignLite도 외형은 멋집니다만, 여러가지 컴퍼넌트가 없거나 하거나, 결국 아무리 스스로 디자인하지 않으면 아무래도 안 되는 인상입니다.

jQuery



지금 쓸 때까지도 없지만, jQuery 들어 있지 않으면 움직이지 않는 라이브러리도 상당히 있기 때문에 필요하네요.

UIKit



Bootswatch



bootstrap 기반의 UI 키트로서는 왕도인 느낌입니다만, bootstrap감을 지우기에 최적입니다.
개인적으로 둥근 UI가 으 ~ 응이라는 느낌이므로 yeti를 사용하면 지금처럼 좋아합니다.

도서관



viewerjs



이미지 투고계의 사이트 만들기에는 안성맞춤입니다.
이것 하나 있으면 어쩐지 그것 같아집니다.

Bootcards



지금 유행의 카드형 UI의 Bootstrap판.
FlatUI로 yeti로 하고 있으면, Bootstrap감도 없어서 좋은 느낌.

Remodal



모달 표시용 라이브러리입니다.
UI가 비교적 멋지고 심플하고 취급하기 쉽기 때문에 편리합니다.

Bootbox.js



경고를 멋지게 보여주는 라이브러리.
js 데포의 경고라든지 흥미롭기 때문에 소중합니다.

Dropzone.js



"input type=file"을 멋지고 드래그 드롭으로 저장할 수 있는 라이브러리.
UI를 스스로 좋아하게 변경할 수 있는 것이 좋네요(센스 없어 그대로 사용합니다만)
디폴트라면, 프리뷰 화상이 마음대로 잘라져 표시되어 버리는 것이 난점.

Chart.js



그래프를 작성하는 데 사용합니다.
사이트에 따라서는 전혀 이용하지 않을 가능성이 있습니다만, 이번은 사용하고 있었으므로 써 둡니다.
그래프 쓰는 계의 라이브러리중에서는 사용하기 쉬울까~라고 생각하고 있습니다.

infinite-scroll



무한 스크롤시키는 라이브러리군요.
이미지의 일람 페이지등에서 상당히 편리합니다.
곳곳에서 사용되고있는 느낌이 있지만, 소중하므로 추가!

라는 느낌으로, 좀 더 다른 좋은 UI 툴이라든지 라이브러리 있으면 알려주세요!

좋은 웹페이지 즐겨찾기