'Eclipse'에 해당되는 글 29건
- 2011.08.06 [추천 플러그인]Zencoding For Eclipse : html, css작성을 쉽게! 3
- 2011.08.05 [추천 플러그인] jqueryWTP : Eclipse jQuery Code Assist Plugin 3
- 2011.08.05 설치된 Plugin Uninstall
- 2011.07.28 후져진 Eclipse Indido 에디터 폰트를 다시 쪽바로 맨들기 6
[추천 플러그인]Zencoding For Eclipse : html, css작성을 쉽게!
이클립 2011. 8. 6. 00:21
html, css를 작성할때 특히 html 태그를 작성할때 기가맥힌 이클립 플러그인이다.
일단 바로 설치를 한 다음에 간단한 사용법을 살펴보자.
Help > Install New Software 에 가서 Work with에 http://zen-coding.ru/eclipse/updates/ 입력한후 Add 버튼을 클릭해서 적당한 이름으로 사이트를 등록한다.
사이트를 등록하면 잠시후에 설치할 플러그인 목록이 조회되는데 체크후 Next 버튼을 클릭해서 플러그인 설치를 완료한다.
설치완료 후 이클립을 리스탓트 하면 끝~
자~ 이제 간단히 기능을 살펴보기 위해서 html 파일이나 jsp 파일이나 뭐 아무파일이나 생성해서 에디터를 열어보자.
뭐 이왕이면 html 이나 jsp 파일을 생성하는게 컬러링이 되니깐 좋을것이다.
참고로 Zencoding 플러그인은 이클립스 상의 왠만한 텍스트에서나 다 쓸 수 있다. java 소스 에디터에서도 된다! 할일은 없지만. 아무튼!!
코딩할때 카피&붙여넣기 하는 일이 많을까? 이걸 쓸 일이 많을까 하는 생각은 문득 해보긴 해본다.
뭐 또 아무튼 Zencoding 에서 쓸수 있는 문법이랄까? 하여튼 그게 css 문법이랑 거의 똑같다는게 또 큰 장점이 아닐수 없다.
계속해서 몇가지 예를 들어보자.
html:4t
script:src
link:css
ul#nav.tree>li*3>a
ul#nav.tree>li*2>a.navBtn[href=#]
ul#nav.tree>li*2>a#link$.navBtn[href=#]
ul#nav.tree>li*2>a#link$$.navBtn[href=#]
table+ul#nav.tree>li*2
table#summary>(caption)+(thead>tr>th)+(tbody>tr*2>td*2)
우째 쓰는지는 대략 알수 있을 것이다. 더 많은 것을 알고 싶을땐!
[HTML 예제보러 가기]
[CSS 예제보러 가기]
일단 바로 설치를 한 다음에 간단한 사용법을 살펴보자.
Help > Install New Software 에 가서 Work with에 http://zen-coding.ru/eclipse/updates/ 입력한후 Add 버튼을 클릭해서 적당한 이름으로 사이트를 등록한다.
사이트를 등록하면 잠시후에 설치할 플러그인 목록이 조회되는데 체크후 Next 버튼을 클릭해서 플러그인 설치를 완료한다.
설치완료 후 이클립을 리스탓트 하면 끝~
자~ 이제 간단히 기능을 살펴보기 위해서 html 파일이나 jsp 파일이나 뭐 아무파일이나 생성해서 에디터를 열어보자.
뭐 이왕이면 html 이나 jsp 파일을 생성하는게 컬러링이 되니깐 좋을것이다.
참고로 Zencoding 플러그인은 이클립스 상의 왠만한 텍스트에서나 다 쓸 수 있다. java 소스 에디터에서도 된다! 할일은 없지만. 아무튼!!
div#tree>ul>li*3요렇게 입력하서 Tab 키를 뽓 눌러보면
<div id="tree"> <ul> <li></li> <li></li> <li></li> </ul> </div>요렇게 후딱 싹 바뀌는걸 볼수 있다! 뭐 별기능 아니지만 어째보면 보기만 해도 흐뭇한 기능이 아닐수 없다.
코딩할때 카피&붙여넣기 하는 일이 많을까? 이걸 쓸 일이 많을까 하는 생각은 문득 해보긴 해본다.
뭐 또 아무튼 Zencoding 에서 쓸수 있는 문법이랄까? 하여튼 그게 css 문법이랑 거의 똑같다는게 또 큰 장점이 아닐수 없다.
계속해서 몇가지 예를 들어보자.
html:4t
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title></title> </head> <body> </body> </html>
script:src
<script type="text/javascript" src=""></script>
link:css
<link rel="stylesheet" type="text/css" href="style.css" media="all" />
ul#nav.tree>li*3>a
<ul id="nav" class="tree"> <li><a href=""></a></li> <li><a href=""></a></li> <li><a href=""></a></li> </ul>
ul#nav.tree>li*2>a.navBtn[href=#]
<ul id="nav" class="tree"> <li><a href="#" class="navBtn"></a></li> <li><a href="#" class="navBtn"></a></li> </ul>
ul#nav.tree>li*2>a#link$.navBtn[href=#]
<ul id="nav" class="tree"> <li><a href="#" id="link1" class="navBtn"></a></li> <li><a href="#" id="link2" class="navBtn"></a></li> </ul>
ul#nav.tree>li*2>a#link$$.navBtn[href=#]
<ul id="nav" class="tree"> <li><a href="#" id="link01" class="navBtn"></a></li> <li><a href="#" id="link02" class="navBtn"></a></li>
table+ul#nav.tree>li*2
<table></table> <ul id="nav" class="tree"> <li></li> <li></li> </ul>
table#summary>(caption)+(thead>tr>th)+(tbody>tr*2>td*2)
<table id="summary"> <caption></caption> <thead> <tr> <th></th> </tr> </thead> <tbody> <tr> <td></td> <td></td> </tr> <tr> <td></td> <td></td> </tr> </tbody> </table>
우째 쓰는지는 대략 알수 있을 것이다. 더 많은 것을 알고 싶을땐!
[HTML 예제보러 가기]
[CSS 예제보러 가기]
install : 취임시키다, 장치하다, 임명하다, 자리에 앉히다, 인스톨하다
'이클립' 카테고리의 다른 글
| Zencoding 활용 #1 : 기본적으로 출력되는 lang, locale, charset 변경하기 (0) | 2011.08.08 |
|---|---|
| Eclipse Javascript Code Assist 가 되지 않을때 (1) | 2011.08.08 |
| [추천 플러그인] jqueryWTP : Eclipse jQuery Code Assist Plugin (3) | 2011.08.05 |
| 설치된 Plugin Uninstall (0) | 2011.08.05 |
| 후져진 Eclipse Indido 에디터 폰트를 다시 쪽바로 맨들기 (6) | 2011.07.28 |
[추천 플러그인] jqueryWTP : Eclipse jQuery Code Assist Plugin
이클립 2011. 8. 5. 15:11
Jquery 를 쓰면 쓸수록 이걸 만든 사람들은 천재라는 생각을 하게된다.
이클립에서 Jquery 코딩을 할때 $("div"). 요래 쩜을 찍었을때 쓸 수 있는 메소드들이 뽓 튀어나오도록 해보자.
jqueryWTP 라는 이클립 훌러그인인데 이건 다른 훌러그인처럼 Install New Software 로 설치를 간단하게 할수 없다.
찾아보니까 aptana 라고 다른 훌러그인도 있던데 이것저것 설치할것도 많고 왠지 *.js 파일에만 될것 같기도 해서(실제로 안써봤기 때문에 잘 모른다. *.js 파일 말고도 jsp 나 html 에서 될지도 모름!!!)
※ 설치전 이클립을 종료한다음에 설치, 설치한 이클립스는 Helios Service Release 2 버전임.
뭐 일단 설치하는 방법은
첫번째 - 훌러그인을 다운로드 받는다. [다운!] 나는 jqueryWTP1.20foEN.jar 이걸 다운받았다.
두번째 - 다운받은 jar 파일을 실행한다. cmd 창을 열고 java -jar e:\jqueryWTP1.20foEN.jar 를 실행
※ 다운로드를 E: 드라이브로 받았음.
세번째 -
Jar 파일 선택 : [이클립스설치디렉토리]\plugins 디렉토리 안에 있는 org.eclipse.wst.jsdt.core_xxxxxx.jar 파일 선택
Output Dir : 패치된 org.eclipse.wst.jsdt.core_xxxxx.jar 파일이 생성될 디렉토리
Generate 클릭
네번째 - 패치된 org.eclipse.wst.jsdt.core_xxxxx.jar 파일을 [이클립스설치디렉토리]\plugins 디렉토리에 복사해서 파일 덮어쓰기
다섯번째 - [현재 쓰고 있는 workspace 디렉토리]\\.metadata\.plugins\org.eclipse.wst.jsdt.core 디렉토리 삭제
이렇게 하면 설치가 끝난다.
이클립스를 다시 시작해 보면 이제부터 $("div") 에서 쩜을 찍으면 Code Assist 기능이 적용된다~~~
※ 만약 Code Assist 가 되지 않으면 Project > Properties > Project Facets 에 가서 JavaScript 를 체크해 주셈~
이클립에서 Jquery 코딩을 할때 $("div"). 요래 쩜을 찍었을때 쓸 수 있는 메소드들이 뽓 튀어나오도록 해보자.
jqueryWTP 라는 이클립 훌러그인인데 이건 다른 훌러그인처럼 Install New Software 로 설치를 간단하게 할수 없다.
찾아보니까 aptana 라고 다른 훌러그인도 있던데 이것저것 설치할것도 많고 왠지 *.js 파일에만 될것 같기도 해서(실제로 안써봤기 때문에 잘 모른다. *.js 파일 말고도 jsp 나 html 에서 될지도 모름!!!)
※ 설치전 이클립을 종료한다음에 설치, 설치한 이클립스는 Helios Service Release 2 버전임.
뭐 일단 설치하는 방법은
첫번째 - 훌러그인을 다운로드 받는다. [다운!] 나는 jqueryWTP1.20foEN.jar 이걸 다운받았다.
두번째 - 다운받은 jar 파일을 실행한다. cmd 창을 열고 java -jar e:\jqueryWTP1.20foEN.jar 를 실행
※ 다운로드를 E: 드라이브로 받았음.
세번째 -
Jar 파일 선택 : [이클립스설치디렉토리]\plugins 디렉토리 안에 있는 org.eclipse.wst.jsdt.core_xxxxxx.jar 파일 선택
Output Dir : 패치된 org.eclipse.wst.jsdt.core_xxxxx.jar 파일이 생성될 디렉토리
Generate 클릭
네번째 - 패치된 org.eclipse.wst.jsdt.core_xxxxx.jar 파일을 [이클립스설치디렉토리]\plugins 디렉토리에 복사해서 파일 덮어쓰기
다섯번째 - [현재 쓰고 있는 workspace 디렉토리]\\.metadata\.plugins\org.eclipse.wst.jsdt.core 디렉토리 삭제
이렇게 하면 설치가 끝난다.
이클립스를 다시 시작해 보면 이제부터 $("div") 에서 쩜을 찍으면 Code Assist 기능이 적용된다~~~
※ 만약 Code Assist 가 되지 않으면 Project > Properties > Project Facets 에 가서 JavaScript 를 체크해 주셈~
'이클립' 카테고리의 다른 글
| Zencoding 활용 #1 : 기본적으로 출력되는 lang, locale, charset 변경하기 (0) | 2011.08.08 |
|---|---|
| Eclipse Javascript Code Assist 가 되지 않을때 (1) | 2011.08.08 |
| [추천 플러그인]Zencoding For Eclipse : html, css작성을 쉽게! (3) | 2011.08.06 |
| 설치된 Plugin Uninstall (0) | 2011.08.05 |
| 후져진 Eclipse Indido 에디터 폰트를 다시 쪽바로 맨들기 (6) | 2011.07.28 |
설치된 Plugin Uninstall
이클립 2011. 8. 5. 11:43
설치된 훌러그인이 필요가 없을때 쓰지도 않는걸 남겨두느니 차라리 지우고 싶다.
고럴땐 Help > About Eclipse > Installation Detalis > Unstall 하고 싶은 플러그인 선택 > Uninstall
요래하면 끝
고럴땐 Help > About Eclipse > Installation Detalis > Unstall 하고 싶은 플러그인 선택 > Uninstall
요래하면 끝
'이클립' 카테고리의 다른 글
| Zencoding 활용 #1 : 기본적으로 출력되는 lang, locale, charset 변경하기 (0) | 2011.08.08 |
|---|---|
| Eclipse Javascript Code Assist 가 되지 않을때 (1) | 2011.08.08 |
| [추천 플러그인]Zencoding For Eclipse : html, css작성을 쉽게! (3) | 2011.08.06 |
| [추천 플러그인] jqueryWTP : Eclipse jQuery Code Assist Plugin (3) | 2011.08.05 |
| 후져진 Eclipse Indido 에디터 폰트를 다시 쪽바로 맨들기 (6) | 2011.07.28 |
후져진 Eclipse Indido 에디터 폰트를 다시 쪽바로 맨들기
이클립 2011. 7. 28. 15:03
이클립스 새버전 인디고가 나왔다는 소릴 듣고 후뜩가서 받아서 실행을 해 보았다.
그런데 에디터 창에 폰트가 이전 버전처럼 깔쌈하게 안나오고 이상꾸리하게 후진 모양으로 나왔다. XP에서는 우쩐지 모르겠지만 아무튼 윈도우7에서는 이빠이 모양이 후졌다.
폰트를 전처럼 깔쌈하게 나오도록 설정하기
그런데 에디터 창에 폰트가 이전 버전처럼 깔쌈하게 안나오고 이상꾸리하게 후진 모양으로 나왔다. XP에서는 우쩐지 모르겠지만 아무튼 윈도우7에서는 이빠이 모양이 후졌다.
폰트를 전처럼 깔쌈하게 나오도록 설정하기
- 제어판을 실행 시키고 귀퉁이 검색란에 "글꼴" 입력해서 검색되는것 중에 "설치된 글꼴 보기" 를 클릭
- 폰트 목록 중에서 Courier New 를 선택한다음에 마우스 오른쪽 버튼 클릭해서 "표시" 로 바꾼다. 그러면 보인다는 뜻으로 아이콘이 쪼매 찐해짐
- 이클립스를 뽓 켜고 Window-Preferences-General-Appearance-Colors And Fonts 로 간다.
- 목록중에 Basic-Text Font 를 아까 "표시" 로 바꿔준 Courier New 로 바꿔준다. (2번에서 "표시"로 바꿔주지 않으면 폰트 목록에 안뜸)
- Apply 클릭하면 끝.
'이클립' 카테고리의 다른 글
| Zencoding 활용 #1 : 기본적으로 출력되는 lang, locale, charset 변경하기 (0) | 2011.08.08 |
|---|---|
| Eclipse Javascript Code Assist 가 되지 않을때 (1) | 2011.08.08 |
| [추천 플러그인]Zencoding For Eclipse : html, css작성을 쉽게! (3) | 2011.08.06 |
| [추천 플러그인] jqueryWTP : Eclipse jQuery Code Assist Plugin (3) | 2011.08.05 |
| 설치된 Plugin Uninstall (0) | 2011.08.05 |
