Please Enable JavaScript!
Gon[ Enable JavaScript ]

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기

 

프로그램 개발할 때 자동 완성 기능은 필수 입니다. 일일이 함수를 다 외우지 않아도 되고 개발 생산성을 아주 높일 수가 있습니다. 이클립스에서 자바스크립트 개발할 때 설치하는 플러그인 중 JQuery 용이 있습니다. JSDT JQuery 플러그인을 설치하면 인텔리젼스 기능을 사용할 수 있습니다.

 

먼저 플러그인을 설치하기 위해 마켓플레이스로 이동합니다. Help 메뉴로 가시면 마켓플레이스 팝업창을 열수 있는 [Eclipse Marketplace] 가 있습니다. 

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기

 

마켓플레이스 팝업창에서 Find 검색창에 JSDT 라고 입력합니다. 찾은 목록 중 JSDT jQuery 를 볼 수 있을 겁니다. 오른쪽 하단에 [Install] 버튼을 클릭해서 바로 설치합니다. 설치 과정은 특별한 것이 없으며 끝나면 재 시작을 해야 합니다

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기

 

설치 후 Java EE perspective 로 화면을 변경합니다. 그럼 프로젝트 폴더 목록에서 JavaScript Resources 를 볼 수 있습니다. 오른 마우스나 Alt + Enter 를 눌러 속성 정보로 창을 엽니다.

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기


JavaScript Resources 팝업창에서 다운받은 JSDT jQuery 라이브러리를 추가해야 합니다. 오른쪽 메뉴 중 [Add JavaScript Library] 를 클릭합니다.

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기

 

[Add JavaScript Library] 클릭하시면 팝업창이 하나 뜨는데 목록에 jQuery Library 라고 있을 겁니다. 선택 후 Next 를 눌러 다음 단계로 넘어갑니다.

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기

 

다음 단계에서 jQuery Library 의 버전을 선택합니다. 이것은 프로젝트 환경에 맞춰서 결정하시면 되겠죠.

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기

 

jQuery 버전까지 결정하셨다면 Finish 를 눌러 창을 닫습니다. 그럼 Libraries 목록에 추가한 jQuery 라이브러리가 나타납니다.

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기

 

이제 라이브러리를 추가했으니 제대로 자동 완성 기능이 작동하는지 테스트해 봐야겠죠. 아래 그림처럼 객체 뒤에 “.” 을 찍으면 사용 가능한 함수들이 뜨게 됩니다. 이상으로 jQuery 개발 시 필히 추가해야 되는 플러그인에 대해 알아 보았습니다.

이클립스(Eclipse) JQuery 개발 시 자동 완성 기능 JSDT 플러그인 사용하기

 

Posted by 녹두장군

댓글을 달아 주세요

  1. 김선우 2015.10.13 15:39  댓글주소  수정/삭제  댓글쓰기

    감사합니다~

  2. MSY 2015.11.09 17:58  댓글주소  수정/삭제  댓글쓰기

    유용한 정보 감사합니다. 퍼갈께요~

  3. ㅇㅈㄱ 2016.07.28 18:54  댓글주소  수정/삭제  댓글쓰기

    정리 감사합니다. 퍼갈게요!!

  4. Favicon of http://naver.com 아놔 2020.06.17 05:51  댓글주소  수정/삭제  댓글쓰기

    이젠 플러그인 다 사라졌습니다.
    ㅜㅜ

  5. 이거 안되요~! 2020.09.28 00:35  댓글주소  수정/삭제  댓글쓰기

    이거 ㅠㅡ 안되요 marketplace에 JSDT아무리 찾아봐도 없어요. 없어진건가요?