(bootstrap) 부트스트랩 프로젝트 구성하기

 

• bootstrap 이란

부트스트랩은 트위터(twitter)에서 개발한 UI 라이브러리로, 웹사이트를 쉽게 만들 수 있게 도와주는 HTML, CSS, JS 웹 프론트엔드 프레임워크

 

• 프로젝트 구성하기

1. 부트스트랩 다운로드
   https://getbootstrap.com/docs/5.0/getting-started/download/
   

   

2. 압축 풀고 해당 폴더를 visual studio code 에서 연다.
   

   

   css 와 js 가 있음

3. 첫 웹페이지가 되는 index.html 을 만들고 css 와 js 연결
   

   

   <link rel="stylesheet" href="css/bootstrap.css">
   <script src="js/bootstrap.js"></script>
   ​

4. bootstrap js 를 쓰기 위해 jquery 다운로드
   
   https://jquery.com/
   

   

   

   -      자동으로 다운로드 진행 안 되고 raw source code 가 보이면 페이지에서 우클릭 후 저장
   

   

5. 프로젝트 내 js 폴더에 복사
   

   

6.  jquery import 
   

   

7. 모바일과의 완전 호환을 위해 아래 추가
   

   

min.js 와 js 의 차이

.js와 min.js의 차이로는 전자는 사용자가 모든 소스를 볼 수있는 풀버전 이라 생각하면 되고 , 후자는 불필요한 부분을 삭제하여 용량을 줄인것이라 생각하면 될 것 같다.

 

- min.js 는 cdn 을 통해 참조됨

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-3.6.0.js"></script>