2016년 6월 12일 일요일

Boilerplate란 무엇일까? - 개념과 설치해보기

요즘 Front-end 쪽 프로젝트도 많이하고
공부도 많이 하고 있는 중에 HTML boilerplate 에 대해 보게되었다.

우선 boilerplate 란, 여기(텀즈)를 참고해서 이야기해보자면
"변경없이 재사용이 가능한 저작품"

원래 보일러 플레이트는 증기 보일러 내부에 있는 커다란 압연 강판을 말한다.

다른 의미로는 이렇게 표현할 수 있다.

"이 용어는 보일러 플레이트가 오랜 기간동안 시험되었으며, 
강철처럼 튼튼하다, 또는 반복적으로 재사용하기에 충분할 정도로 강력한 어떤 물건으로 만들어졌다는 등의
 여러 가지 함축적인 의미를 내포하고 있다."

보일러 플레이트에 대한 용어 설명은 이만하고
HTML Boilerplate에 대해서 한번 살펴보려고 한다.

HTML5  BOILERPLATE

Link : https://html5boilerplate.com/



메인 페이지에서는
"보일러플레이트를 사용하면 사이트나 웹앱을 빠르고 튼튼하게
그리고 잘 적응할 수 있게(다른 컴포넌트와 잘 맞게) 만들 수 있다." 라고 되어있다.

밑으로 내려서 사이트 내용을 더보자.



좋은 내용만 있는거 같다.
1. 모바일에 친화적이고, 구글 아날리틱스도 잘 쓸 수 있음.
2. Normalize.css 를 이용해서 잘 만들 수 있음.
3. jQuery, Modernizr 을 이용해서 빠른 라이브러리 호출을 할 수 있다.
4. 좋은 성능 : 아파치 서버 세팅을 통해서 빠르게.

Modernizr 에 대한 내용은 따로 공부해보는 것도 좋아보인다.
https://modernizr.com/

다시 보일러 플레이트로 돌아가서,
이러한 좋은점이 있으니 사용해라인데, 일단 다운받아봤다.
다운 받는 방법은 세 가지가 있는데

1. 사이트에서 다운받기
2. http://www.initializr.com/ 이 사이트에서 조건 설정해서 다운받기
3. git clone을 통해서 다운받기

일단은 1의 방법으로 다운받았다.

다운받아서 그 안에 내용을 봤더니


이렇게 구성되어 있었다.

여기서 index.html을 켜보면,
아래와 같은 페이지가 보인다.


(역시 시작은 Hello world!)

보일러 플레이트를 이용한 다른 사이트들을 볼 수 있는곳은
http://h5bp.net/

많은 사이트들이 있는데
기본적으로 반응형으로 제작되어있었고
페이지 로딩이라던지, 다른 부분에 있어서 퍼포먼스는 좋았다.

실제로 개발해보면서 자세히 들여다보고 분석해보는게 좋을 것 같다는 생각이 들었다.

댓글 없음:

댓글 쓰기

JIRA Plugin - ScriptRunner 소개 #2

관련 글 소개 #1:  https://pineoc.blogspot.com/2019/03/scriptrunner-1.html ScriptRunner 소개 #2 지난 글에서는 Behaviours를 보았고 다음 내용인 콘솔, 리스너 등을 ...