[Front end] jQuery 적용(다운로드, CDN)
jQuery 적용
jQuery는 자바스크립트 라이브러리이므로, jQuery 파일은 자바스크립트 파일(.js 파일) 형태로 존재한다. 따라서 웹 페이지에서 jQuery를 사용하기 위해서는 jQuery 파일을 먼저 웹 페이지에 로드(load) 해야 한다.
웹 페이지에 jQuery 파일을 로드하는 방법은 다음과 같다.
- jQuery 파일을 다운받아 로드
- CDN(Content Delivery Network)을 이용하여 로드
jQuery 다운로드
최신 버전의 jQuery 파일은 다음 공식 사이트에서 다운로드할 수 있다.
Official jQuery Blog | New Wave Javascript
Hello again! jQuery 3.4.0 was released just three weeks ago, but we’ve had a few issues reported that warranted a patch release. Thank you to everyone that reported issues and helped us get these fixed quickly. Here are the changes: Triggering focus or blu
blog.jquery.com
Download jQuery | jQuery
link Downloading jQuery Compressed and uncompressed copies of jQuery files are available. The uncompressed file is best used during development or debugging; the compressed file saves bandwidth and improves performance in production. You can also download
jquery.com
다운받은 jQuery 파일을 서버에 저장하고, <script> 태그를 웹 페이지의 <head> 태그 내에 삽입하면 된다. 혹은 콘텐츠 로딩 속도 성능을 높이기 위해 맨 아랫부분에 삽입하는 경우도 있다.
jQuery CDN
CDN(Content Delivery Network)이란? 웹 사이트의 접속자가 서버에서 콘텐츠를 다운받아야 할 때, 자동으로 가장 가까운 서버에서 다운로드하도록 하는 기술이다. 이 기술을 이용하면 특정 서버에 트래픽이 집중되지 않고, 콘텐츠 전송 시간이 매우 빨라지는 장점이 있다.
CDN을 이용하면 jQuery 파일을 서버에 따로 저장하지 않아도 jQuery를 사용할 수 있다. 현재 이용할 수 있는 jQuery 버전 3.x의 CDN은 다음과 같으며, 어떤 CDN을 이용하더라도 동일한 동작을 한다.
//jQuery.com CDN
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
//구글 CDN
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
//MS CDN
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"></script>
//CDNJS CDN
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
//sDelivr CDN
<script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>