Frameworks/Node.js

[Node.js 강좌] 11. bower - 프론트 엔드 패키지 관리 모듈

양디 2016. 1. 21. 18:26




Bower ?

혹시나 프론트 엔드라는 개념을 아직 모르시는 분이 계시는 분을 위하여 , 프론트 엔드는 사용자가 마주하는 부분을 의미합니다.


백 엔드는 프론트와 반대 개념으로, 사용자가 마주하지 못하는 뒤에서 돌아가고있는 서버를 뜻합니다.


따라서 웹 개발에 있어서 프론트엔드는 브라우저에서 보는 화면들 에 해당합니다.


Bower는 이 프론트엔드에서 필요한 라이브러리들을 관리해줍니다.


웹페이지를 만들다 보면, 많은 라이브러리 들을 사용하게 됩니다.


jquery, angularjs, bootstrap, materialize .....


따라서 파일이 많아질수록 관리하는 것은 힘들어(귀찮아) 집니다.


그런 어려움을 극복하기 위한 모듈이 bower입니다.


설치 및 사용법

Bower 또한 node.js 의 모듈 중 하나이기 떄문에, 역시 npm을 사용해서 받을 수 있습니다.



npm install bower -g


bower는 직접 라이브러리들을 다운받는 기능을 해주기 때문에, 커맨드라인이 필요합니다.


따라서 글로벌로 -g로 깔아줍니다.


설치가 끝났다면 준비가 끝났습니다.


사용법은 굉장히 간단합니다.


npm과 유사한 방식으로 사용할 수 있습니다.


bower init

bower.json 파일을 설정하고, 만들어줍니다.


jquery 패키지는 자동으로 설치가 되어집니다. 


bower install


npm에서 npm install 하면 package.json 에 있는 파일을 다운로드 받을 수 있듯이,


bower install 명령어를 통해서 bower.json 안에 있는 파일을 자동으로 설치할 수 있습니다.



bower install <package> --save


패키지를 다운로드 받을 수 있습니다.


bower install <package>#<version> --save


원하는 패키지를, 원하는 버전으로 다운로드 받을 수 있습니다.


--save 옵션은 역시 bower.json 에 해당하는 패키지들을 자동으로 다운로드 받아줍니다.



bower uninstall <package>


패키지를 삭제해줍니다.


직접 폴더를 삭제하고, bower.json 에서 지우는 것과 동일합니다.


마치며..

많은 프론트엔드 라이브러리들이 bower를 제공해줍니다.


공식 홈페이지에 bower 명령어가 써져 있다면 100% 지원을 해줍니다.


혹시 공식 홈페이지에서 찾기 귀찮으시거나, 바로 검색하고 싶으신 분은 아래 링크를 타고 들어가시면 됩니다.


Bower - Search Link


이상입니다.







댓글