[개인프로젝트] bootstrap-datetimepicker 부트스트랩 달력(데이트피커) CDN 링크 적용

개인프로젝트를 시작했습니다.

외주로 끝내지 말고 소소한것들, 떠오르는것들을 한번 실제로 만들어보려고 합니다.

좋은 무료 호스팅 사이트도 있더라구요.

영상 찍어가면서 한번 시작해보려고 합니다.

 

먼저 달력 기능이 필요했습니다.

부트스트랩 적용하여 달력기능 쓰는 방법을 써보려 합니다.

 

먼저 부트스트랩 기본 링크입니다.

고맙게도 CDN이라는 기능으로 몇줄만 추가하면 부트스트랩의 기능을 쓸 수 있습니다.

 

다 일축하고 요약하면

아래의 내용을 head 부분에 추가하면 부트스트랩의 datetimepicker 사용 준비가 끝난 것!

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css">
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/locale/ko.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>

(스크립트 로딩 순서에 주의해주세요!)

 

적용 마치셨으면 한번 써볼까요?