Vue.js 공식 홈페이지에서는 단위 테스팅(Unit Testing)을 위한 테스트 러너로써 Karma를 적극 권장하고 있다.

 

어떤건지 궁금해서 한번 써본 적은 있지만, 실무에 적용해보기에 앞서 너란 놈에 대해 깊은 공부가 필요함을 느끼고...

 

정말 오랜만의 포스팅 주제로 삼았다.

 

 

KARMA

공식 홈페이지에 가보면, 이렇게 소개하고 있다.

 

A tool which spawns a web server that executes source code against test code for each of the browsers connected.

 

위의 영어가 너무 어려워서, 아래처럼 아름다운 한글로 풀어봤다.

 

카르마는 어떤 웹 서버를 생성하는 도구이다.

이 웹 서버는, 다양한 브라우저들과 연결되어 있다.

그리고, 이 웹서버는 연결되어 있는 각 브라우저 위에서 테스트를 수행한다.

 

그렇다. 이 친구의 목적은 하나다.

개발자들이 다양한 브라우저 환경에서 단위 테스트를 손쉽게 할 수 있는 아름다운 테스팅 환경을 제공하는 것.

 

그렇다면, 브라우저가 연결되어있어야 테스트가 가능한데,

카르마가 생성한 테스팅을 수행하는 웹서버는 어떻게 브라우저를 감지할까?

 

 

브라우저 감지

아래 두 가지의 방법으로 브라우저를 감지한다.

  1. 개발자가 손수 브라우저를 열어준다.
  2. 자동으로 감지하도록 할 브라우저를 카르마 config 파일에 지정해준다.

1. Manually

첫 번째 방법, 즉 손수 진행하려면 

테스트를 수행하려는 브라우저를 열고, 카르마 웹 서버가 돌고 있는 URL을 찍어준다.

 

http://<hostname>:<port>/ 

이렇게 주소를 찍고 들어올텐데, 여기서 <hostname>은  카르마 서버가 돌고 있는 그것일테고,

<port>는 그 서버가 listening하고 있는 그것임.

 

근데 로컬에서 띄우고 별 일 없으면 그 주소는 그냥 http://localhost:9876/ 일 것이다.

 

이렇게 손수 브라우저를 띄우는 방법은, pc가 아니라 모바일 환경에서 테스팅할 때 유용하다.

(물론 카르마 서버랑 같은 네트워크여야 하겠지)

 

2. Auto

그러나 웹 개발자라면, 손쉽게 자동으로 감지하도록 카르마에게 시키는 것이 아름다워 보인다.

그러려면 configuration 파일에 자동으로 띄울 브라우저 리스트를 지정해주어야 하는데, 아래처럼 하면 된다.

browsers: ['Chrome']

이렇게 하면 카르마는 알아서 자동으로 브라우저를 감지하고, 테스트를 모두 수행하면 자동으로 죽인다.

(configuration 파일에 대한 자세한 내용은, 이 포스트에서는 다루지 않기로 한다.)

 

 

이 때, 카르마는 브라우저 런처(browser launcher)를 이용해서 브라우저를 띄우는데,

사용 가능한 브라우저 런처 리스트는 아래와 같다.

대부분의 이 브라우저 런처들은 플러그인 형태로 끼워지는 것이다.

그러므로, 우선적으로 런처가 설치되어야 한다. 아래 예시처럼.

# Install the launcher first with NPM:
$ npm install karma-firefox-launcher --save-dev

 

이거슨 누군가가 미리 만들어놓은 브라우저 런처 플러그인이고, 우리가 손수 커스텀 플러그인을 만들어도 된다. 응 그냥 갖다 쓸래

 

 

그럼 이제 자동으로 띄운 브라우저에서, 어떻게 테스트 명령을 내리고 또 테스트를 실행한 결과를 받아오는지 알아보자.

 

 

웹 소켓을 통한 연결

카르마는 웹 소켓을 이용해 브라우저가 카르마 웹 서버와 커넥션을 가지도록 한다.

 

카르마는 config 에 정의된 브라우저들을 띄운 후, 시작 페이지를 카르마 서버의 URL 로 설정한다.

그리고 이 페이지가 브라우저에서 실행될 때, 웹 소켓을 통해 서버에 연결되는 것이다.

 

카르마 서버는 웹 소켓 연결을 확인하면, 클라이언트 페이지에게 테스트 실행을 지시한다. 

 

웹 소켓으로 연결되어 있기 때문에 언제든지 테스트 수행 명령을 내릴 수 있는데,

이는 카르마가 테스팅 환경으로써 넘나 훌륭한 이유라고 할 수 있다.

클라이언트 페이지의 요청이 없어도, 언제든지 카르마 서버의 필요에 의해 테스트 수행 명령을 내릴 수 있기 때문이다.

덕분에 파일의 변화가 일어날 때마다 자동으로 테스트가 실행될 수 있다.

 

 

파일 변화 자동 감지

카르마는 FS Model이라는 놈을 가지고 있다. 

소스코드 파일의 가장 마지막 버전의 타임스탬프라고 보면 된다.

 

그리고 또, FS Watcher 라는 놈도 있다.

이거슨 테스트 중인 프로젝트의 파일들에 변화가 일어나는지 감시하고, 이를 FS Model에 반영하는 역할을 한다.

 

시나리오는 대충 이렇다.

 

1. 소스코드에 변화가 일어난다.

2. FS Watcher는 이를 감지하여, FS Model의 API를 이용해 FS Model을 업데이트한다.

3. FS Model은 변경 사항이 생기면 이벤트를 발생시킨다.

4. 카르마 웹 서버는 FS Model의 변경 이벤트를 Listen하고 있다가, 변경 이벤트가 발생하면 context.html을 재생성한다.

5. 그리고 config에 restartOnFileChange가 true인 경우, 웹 소켓 커넥션을 통해 클라이언트 페이지에게 테스트 재시작을 지시한다.

 

이는 매번 소스코드에 변경이 일어날때마다 reload를 위해 해야 했던 많은 번거로운 작업들을 줄여준다.

진정한 의미의 테스트 자동화라 할 수 있겠다.

 

 

IFrame 기반 테스트

설명을 위해 위의 시나리오를 이어나가 보겠다.

 

6. 서버로부터 테스트 실행 지시를 받은 클라이언트 페이지는 iframe을 연다.

7. 그리고 서버에 context.html 을 요청해서 받아와, iframe 안에 페이지를 생성한다.

 

context.html테스트 프레임워크 어댑터소스코드(테스트의 대상), 그리고 테스트코드를 포함한다.

즉, 테스트에 필요한 모든 요소가 iframe 안에 들어간다고 보면 된다.

(테스트 프레임워크 어댑터는 밑에서 다시 설명하겠음.)

 

테스트 실행 명령이 떨어질 때마다, 클라이언트 페이지는 이 iframe을 다시 로드한다.

즉, 서버는 매번 바뀐 내용을 감지하여 context.html을 생성할테고, 바뀐 내용을 가지고 테스트를 실행하게 되는 것이다.

 

8. context.html 페이지는 로드가 끝나면, onload 이벤트를 발생시킨다.

9. 컨텍스트 페이지(context.html)의 onload 이벤트를 감지한 클라이언트 페이지는, postMessage를 통해 컨텍스트 페이지(context.html)를 클라이언트 페이지에 연결(Listen 이벤트 등록)한다.

 

 

<참고1 - postMessage>

window.postMessage() 메소드는 Windows 오브젝트 사이에서 안전하게 cross-origin 통신을 할 수 있게 한다.

예로, 페이지와 생성된 팝업 간의 통신이나, 페이지와 페이지 안의 iframe 간의 통신에 사용할 수 있다.


이렇게 연결이 되고나면, 이제 남은 일은 테스트를 실행하는 것. 그리고 그 결과를 잘 보여주는 것.

 

글탐 그 일은 누가 하느냐?

컨텍스트 페이지(context.html)에 포함된 테스트 프레임워크 어댑터를 기반으로 테스트 코드가 실행되고,

테스트 프레임워크 리포터가 결과를 전달받아 예쁘게 잘 보여준다.

 

밑으로 고고.

 

 


<참고2 - 테스트 프레임워크 & 테스트 러너>

자알~ 가다가, 갑자기 '테스트 프레임워크' 하니까 갑자기 헷갈리고, 급 의욕 떨어질 것 같아서 설명한다.

아니, 카르마는 테스트 프레임워크가 아닌건가??
흠. 위에 설명을 보니, 카르마는 테스트 러너라네.
읭? 테스트 러너가 테스트 프레임워크 아녔어? 먼솔?

카르마는 테스트 러너로, 자동화된 테스트를 보다 간단하고 빠르게 만들어주는 테스트 환경 툴이다.
그리고 앞으로 언급할 테스트 프레임워크는 Mocha, Jasmine과 같이 자동화된 테스트를 지원해주는 도구이다.
테스트 러너 위에서 테스트 프레임워크를 이용한 테스트가 이뤄진다고 볼 수 있겠다.

읭? 그런데 우리는 이전에 카르마 없이도 Mocha와 같은 테스트 프레임워크로 테스트 잘만 하였는데?

그럴 것이다. 왜냐면 우리가 잘 아는 테스트 프레임워크들도 기본적으로 테스트 러너를 제공하기 때문이다.

그러나.
그 제공한다는 러너가 빈약하기 짝이 없다.

예를 들어 Mocha의 경우, Node 기반의 러너를 제공한다.
Node 테스트만 진행한다면 문제 없겠지만 브라우저 테스트의 경우에는 얘기가 다르다.
DOM 과 같은 브라우저 API는 없기 때문에 cross-browser 문제를 이 방식으로 테스트 하는 데에는 한계가 있다.

물론, 대부분의 테스트 프레임워크에서 사용하는 HTML 러너와 같은 방식으로 브라우저에서도 실행할 수 있지만, 개발자는 테스트를 실행하려면 매번 브라우저를 열고, 러너를 다시 로드해야 하는 불편함을 감수해야 한다.
우리는 이런거 안하려고 카르마 쓰는 거고.

 

테스트 프레임워크 어댑터

Mocha, Jasmine과 같은 기존의 테스트 프레임워크를 사용하려면,

해당 프레임워크를 카르마에서 사용하기 위한 어댑터가 필요하다.

 

각 테스트 프레임워크에는 테스트를 실행하고 결과를 보고하기 위한 서로 다른 API가 있다.

어댑터는 기본적으로 테스트 프레임워크와 카르마 클라이언트 매니저 API 간의 통신을 변환하는 역할을 한다.

(클라이언트 매니저 설명은 밑에 있음)

 

카르마 config 파일에 원하는 테스트 프레임워크 어댑터를 꽂아주면 된다.

물론, 당연히 해당 플러그인이 설치되어 있어야 할 것이다.

// karma.conf.js
module.exports = function(config) {
  config.set({
    basePath: '../..',
    frameworks: ['jasmine'],
    //...
  });
};

 

 

클라이언트 매니저

클라이언트 매니저 카르마 서버와 테스트 프레임워크 어댑터가 통신하기 위한 API를 제공한다.

 

읭? 

혼돈의 카오스를 막기 위해 그림을 제공하겠다.

클라이언트 구조

카르마 서버(A)   <----> 클라이언트 매니저(B) <--(iFrame)--> 테스트 프레임워크 어댑터(C) <----> 테스트 프레임워크(D)

 

매니저(B)는 서버(A)가 프레임워크(D)와 통신하기 위한 통로이고,

어댑터(C)는 매니저(B)와 프레임워크(D)가 서로 알아들을 수 있도록 통신 내용을 변환하는 통역자 역할이라고 이해하면 된다.

 

이렇게 매니저를 통해서 클라이언트 페이지로부터 테스트 수행 지시가 떨어지면,

10. 컨텍스트 페이지의 프레임워크 어댑터는 테스트를 수행 지시를 프레임워크에 전달한다.

11. 테스트 프레임워크는 테스트를 수행한다.

12. 성공/실패 여부는 이벤트를 발생시킴으로써 클라이언트 페이지로 postMessage를 통해 전달된다.

13. 클라이언트 페이지는 다시 웹 소켓을 통해 카르마 서버에 결과를 전달한다.

 

 

테스트 프레임워크 리포터

14. 서버는 클라이언트로부터 메시지를 받으면, '브라우저' 이벤트를 발생시킨다.

15. 리포터는 서버의 '브라우저' 이벤트를 감지하여 결과 데이터를 얻는다.

 

리포터는 데이터를 인쇄하거나 파일로 저장하거나, 다른 서비스로 데이터를 전달할 수도 있다.

 

여기서 중요한 점은, 어댑터와 리포터는 거의 항상 쌍으로 제공된다는 점이다.

 

카르마는 사용자가 어떤 테스트 프레임워크를 사용할지 알 수 없고, 알 필요도 없다.

해당 프레임워크의 데이터 포맷 역시 알지 못한다.

 

결과 데이터는 테스트 프레임워크에 의해 생성되는 것이고,

어댑터에 의해 전달되는 것이고,

리포터에 의해 표현되는 것이다.

 

어떤 프레임워크를 사용하느냐에 따라 어댑터와 리포터는 거의 쌍으로 결정된다고 생각하면 된다.

 

 

 

마치며...

그냥 카르마는 대충 이런거다 설명하려다보니 생각보다 깊게 들어간 것 같다.

이렇게까지 깊게 알 필요는 없었는데;

 

웹 어플리케이션 단위 테스트를 알아보다 보니, 너무나도 많은 테스팅 툴이 있는데

어떤 툴은 다른 툴을 내부적으로 사용하고 있고,

어떤 애들은 비교당하고 있고...

 

도대체 뭐가 뭔지 뒤죽박죽이여서 카르마부터 파보자, 하고 알아봤더니

전체적인 그림이 그려지는 것 같다.

 

굿굿.

하.. 그래서 난 무슨 프레임워크 쓰지.

 

 

 

 

- end 

 

이전 포스트에서 이클립스에서 톰캣을 실행시키는 방법과 그 이유를 설명했다.


이번엔, 이클립스에서 웹 프로젝트를 만드는 2가지 방법을 설명하려고 한다.




이클립스 웹 프로젝트를 만들려면


1) 이클립스에서 직접 웹 프로젝트를 만들 수도 있고,

2) Gradle 도구를 사용하여 이클립스 웹 프로젝트를 만들 수도 있다. 




그러면 두 가지를 다 해보면서 뭐가 더 좋은지도 설명하고 끝내도록 하게따-.




1. 이클립스에서 Dynamic Web Project 만들기



이클립스에서 아래와 같이 Dynamic Web Project를 만들어 준다.




그러면 이런 창이 뜨는데, 먼저 원하는 프로젝트 명을 입력해준다.





프로젝트 다 만들었으면 웹 애플리케이션을 서버실행 환경에 배치해야 한다.


이거슬 해줘야 이전 포스트에서 설명한 그 tmp~ 폴더에 이 웹 프로젝트 파일들이 복붙되어 실행이 가능해진다.


어케 하냐면 


Servers 뷰(이거 뭔지 모르겠으면 이전 포스트 읽으세요) 에서,

등록한 서버에다 대고 오른쪽 마우스 눌러서 context menu를 띄운 다음 > Add and Remove 를 눌러준다. 그럼 아래의 창이 뜬다.





여기서 왼쪽 목록에 나열되어 있는 웹 프로젝트를 선택해서 오른쪽 목록에 추가한다.


그러면 끄읏~!





2. Gradle 도구로 이클립스 웹 프로젝트 만들기


자. 이 방법으로 웹 프로젝트를 만들려면... build.gradle 파일이 일단 있어야 한다.


build.gradle 파일로 말할 것 같으면 여기다가 쓰기엔 역부족이라서ㅜㅜ 다음에 기회가 되면 포스팅 하는 것으로 하고.


이런 파일을 이미 알고 있다는 가정 하에. 



먼저, General 폴더를 하나 만들어준다.




적당히 원하는 이름을 갖다 붙여서 만들어준다. (웹 앱 프로젝트 명)




그러면 Project Explorer에 요렇게 새로 만든 폴더가 생긴다.




그럼 요 폴더에다가 build.gradle 파일을 하나 만들어준다.

원래 있었으면 걍 복붙.






이렇게 해줬으면 build.gradle 파일에다가 아래와 같은 코드를 추가해준다.



  apply plugin: 'eclipse-wtp' 

  apply plugin: 'war' 

  webAppDirName='WebContent'



수정된 build.gradle파일을 저장한 후, 콘솔창(명령 프롬프트)을 켠다.


콘솔창에서 우리가 방금  만들어준 폴더로 이동을 해준 다음, "gradle eclipse"라는 명령을 딱 쳐주면



이렇게 빌드를 성공했다고 나올 거시다.


어디 한번 확인을 해볼가.




다시 이클립스로 돌아와, Project Explorer에서 내가 방금 만든 wow 프로젝트 폴더를 Refresh 해주면...



두둥-. 


아까는 없던 것들이 생긴 것을 볼 수 있다.


그리고 폴더 생김새를 잘 보면 지구본 모양과 J가 붙어있는걸 확인할 수 있다!


요 모양이 바로 "나는 웹 애플리케이션 프로젝트에요" 하고 알려주는 표시다. 요게 생겼으면 잘 된거임.




이렇게 프로젝트 폴더 다 생성 했으면, 아까 이클립스에서 웹 애플리케이션 프로젝트 생성하는 방법에서 해줬던 것처럼


웹 애플리케이션을 서버실행 환경에 배치해주면 진짜 끗-.




2번째 방법을 추천한다.

두 가지 방법 중 간편한 것은 사실 첫 번째 방법이다.


그치만 첫 번째 방법은 다른 사람과 프로젝트 폴더를 공유하기가 어렵다.


왜냐면 저렇게 만든 경우, 프로젝트 설정 파일이 개별적인 PC환경을 반영하기 때문이다.



그래서 Grale 도구를 사용하여 이클립스 웹 프로젝트를 만드는 두 번째 방법을 추천한다..!!


두 번째 방법은 오로지 src 파일과 build.gradle 파일만 있으면  되기 때문에, 파일을 공유할 때 그것만 주면 된다.




끄읏!

  1. ggalggal 2017.06.01 18:26

    요청자료 감사합니다

  2. 의성어장인 2017.06.02 17:09

    보기쉽게 잘설명하셨네여 자주보러올게요 키ㅓㅏ아ㅏㅏㅏ

  3. H 2017.06.03 15:27

    멋져부려요~ 저도 막 요청해도 포스팅 해주시나요? ㅋㅋ~~~

톰캣을 실행할 때 직접 톰캣이 설치된 폴더로 가서 톰캣을 직접 실행시키는 방법도 있지만!


이클립스에서 편하게 실행시키고 끄고 할 수가 있다.



이번 포스트에서는 이클립스에서 톰캣을 실행시키기 위해 해주어야 하는 작업들을 포스팅 해볼까 한다. 유후-.



1. 톰캣 서버가 설치된 폴더를 등록하기

먼저 톰캣을 이클립스에서 실행하려고 하면, 톰캣이 내 컴퓨터 어디에 저장되어있는지 이클립스가 알야아 한다.


그래서 제일 먼저 해야 할 일은, 설치된 폴더를 찾아서 등록해주는 것이다.


그럼 해볼가.




Eclipse의 설정에서 Server > Runtime Environments 에 들어가보자. 

그러면 아래와 같은 화면이 뜰거시다.

여기서 Add 버튼을 눌러보자.




그럼 아래와 같은 창이 또 뜨는데, 저기에서 내 컴퓨터에 있는 톰캣 버전과 일치하는 항목을 선택한 후, Next 버튼을 클릭!





그러면 아래 화면이 되는데, 

Browse 버튼을 눌러서 실제로 내 컴터에 톰캣이 설치되어 있는,

지금 생각하는 바로 그 폴더를 찾아서 등록해준다.





이렇게 다 하고 Finish버튼을 눌러 완료해주면 끄읏. 짝짝짝-.



여기까지 이클립스에서 톰캣 서버를 실행할 수 있도록, 톰캣이 있는 폴더가 등록 완료된거다.



자. 그러면 이제 다된거 아님??

노노. 등록된거 어떻게 실행시킬거임?

모르겠지?


등록한 서버를 이클립스에서 편하게 실행시킬 수 있는 환경을 만들어보자.





2. 웹 애플리케이션 서버(톰캣) 실행환경 구축하기

 

이클립스에서 Windows > Show View > Servers 를 눌러주면,





요런 창이 뜬다. 이걸 앞으로 "Servers 뷰" 라고 하겠음.




저기에 파란색으로 써있는게 무슨말이냐면

"사용 가능한 서버가 없으니 여기를 눌러서 새로운 서버를 생성해다오"

이 말이다.


저기를 눌러주면,  아래와 같은 창이 뜬다.



어디서 많이 본듯한 이 창은 앞에서 톰캣 폴더를 등록해주는 바로 그 창과 비슷하다.

(앞의 그 창은, 폴더 등록해주는거고요, 이 창은 Servers 뷰에서 간편하게 실행시키기 위해 등록하는 창이다.)


당신의 그 톰캣 버전을 선택하고 Finish를 눌러 완료해주면...


아래처럼 Servers 뷰에 새로운 서버가 보일 것임.




오호라-.


그럼 어디 한번 실행시켜볼가.





3. 웹 애플리케이션 서버 실행환경 시작하기


저기다가 대고 오른쪽 마우스를 클릭하면 아래와 같이 context menu창이 뜬다.


거기서 Start 를 누르면-




이렇게 콘솔 뷰에 뭐라뭐라 뜬다.


톰캣이 정상적으로 시작이 되었나보다 헷.




막 빨간색이라서 첨에 에러난줄 알았ㄷ..






여기서 잠깐.


이클립스에서 톰캣을 실행시키면... 뭐 좀 편하긴 하겠는데,


단지 톰캣을 이클립스에서 편하게 시작/종료시키기 위해 이클립스에서 쓰는걸까?


답은 "노노".


서버가 사용자의 다양한 요청에 대해 동작하려면, 사용자의 요청에 해당하는 웹 애플리케이션이 있어야 한다.

그리고 톰캣은 개발자가 만든 바로 그 애플리케이션들을 실행할 수 있는 환경을 제공하는 서블릿 컨테이너의 역할을 한다.


따라서 웹 애플리케이션 파일을 톰캣 폴더 밑 어딘가에 저장해둔다.

(정확히 어디쯤 저장되는지는 다음 포스트에..)


그런데 문제는.. 수정이 일어나면 그 파일을 수정된 파일로 바꿔줘야 한다. 그래야 수정된 파일이 실행될 것이 아닌가.


뭐 하나 바꿀라 치면 톰캣 폴더 밑에, webapps폴더 밑에, WEB-INF폴더 밑에, classes 폴더 밑에 있는 기존의 파일을 지우고 새로운 파일로 교체....하.

생각만해도 욕지기가 나와.


그런데 이클립스에서 이러케 이러케 해주면, 안그래도 된다 이말씀-.이래서 이클립스 이클립스 하나봐.




정리.


이클립스에서 톰캣 웹 애플리케이션 서버 실행환경을 구축하여 사용하는 이유


=> 수정사항이 있을 때마다 파일을 교체해야 하는 번거로운 작업을 생략할 수 있으니까.














4. 실행환경이 구축된 폴더 확인하기


그러면 이클립스에서는 대체 뭘 어떻게 하길래, 수정된 파일을 바꿔주지 않아도 되는걸까?? 알쏭달쏭 궁금궁금


이클립스 workspace 폴더 > .metadata 폴더 > .plugins 폴더 > org.eclipse.wst.server.core 폴더에 한번 가보자.



<참고>


맥 사용자는  .metadata, .plugins폴더가 안보일 수 있다. 

hidden file이라서 그럼.


Command + Shift + .  이렇게 누르면 나오니까 당황말자.




저기 들어가보면 아래와 같은 파일들이 있을텐데 저기 있는 것들 중에 주목할 것은 "tmp0" 폴더이다.



tmp0 폴더는 이클립스에서 톰캣을 실행하기 전까지는 이 폴더가 안만들어진다.


마냑에 톰캣 실행환경을 여러개 만들어서 실행시키면 tmp0, tmp1, tmp2, ... 이런식으로 생긴다.

(tmp 뒤에 붙는 저 숫자는 폴더가 만들어진 순서대로 붙여지는거니까 신경 안써도 됨.)


저 폴더를 열어보면..


이렇게 많은 것들이 있다. 


이 폴더의 이름이 "tmp~"인데는 다 이유가 있다.


이 폴더는 이름 그대로 '임시폴더'다.


이클립스의 Servers 뷰에서 해당 실행환경을 삭제하면, 이 폴더는 사라진다.


즉, 개발자가 뭘 바꾸면, 똑똑한 이클립스는 지가 만든 임시폴더로 가서 개발자가 바꾼 그 파일을 복붙해놓는다.


그러니까 이 폴더에서 뭔가 열심히 바꿔도 소용이 없다. 서버 삭제하면 이 폴더도 다 날아가니까.



<참고2>


저기서 "wtpwebapps"폴더 밑에 "web01"이라는 폴더가 있는데, 이거슨 다음 포스트에서 소개할 웹 애플리케이션 프로젝트이다.


이클립스에서 웹 애플리케이션 프로젝트를 만들면 무조건 여기에 보이는게 아니고,

"이 프로젝트는 이 톰캣 실행환경에서 실행할거야!" 하고 등록하는 과정을 밟아줘야 함. (이거 다음 포스트에 있음. 겁나친절함.)






서버 구성 파일을 바꾸고 싶다면, 그것도 이클립스에서 바꿀 수 있다.


이클립스 Project Explorer에 가보면 Servers 폴더가 이미 있었거나 새로 생겼을텐데, 여기서 뭐 바꾸고싶은걸 바꾸면 알아서 저기 tmp 폴더 밑에 자동으로 반영이 된다.






-----------------


이것으로 이클립스에서 톰캣을 실행시키는 방법 & 왜 꼭 그래야 하는 이유가 잘 이해되었기를-.

나는 맥북 유저인데..

이클립스에서 자바로 프로그램 개발하다가 짜증이 치솟아 내가 해결책을 찾아야겠다는 어떤 오기가 발동해버렸다.


짜증의 원인은 대략 이러하다.

이클립스에 한글 입력 시, 마지막 글자를 입력하고 엔터나 스페이스를 누르지 않으면 마지막 문자가 사라지고마는 문제가 있다.



요렇게 한글을 쳐 넣는데 커서가 '스' 글자 앞에 놓인 것을 볼 수 있다.

여기서 무심코 -> 버튼을 눌렀더니



하하. 이런 일이 일어났다.


내가 입력한 '스'는 안드로메다로 가뻐려따..



그리하여 구글신에게 여쭌 결과 여러 방법을 알려주었는데, 이 글을 보고있다면 


낚이지 마시라.


그 어떤 해결책도 없으며 이클립스 너가 해결해주지 않으면 우린 계속 한글을 입력한 다음에 스페이스나 엔터를 꼭꼭 입력해주어야 한다는 사실.



내가 해본 삽질은 대략 이러하다.


1. 시스템 환경설정 > 키보드 > 텍스트 탭에서 '맞춤법 자동 수정'을 해제하라는 글을 보고 해보았는데 아무런 변화를 느끼지 못했다.


2. 다시 구글신에게 여쭈었더니 '구름 입력기' 라는 친구를 설치를 해서, 기존의 한글 두벌식과 영어 입력기 다 지우고, 구름 입력기만 딱 놔뒀는데도 안됐다.

커맨드 스페이스로 한/영 변환하는거를 풀고, 구름입력기에서 제공하는 shift + 스페이스 바로 단축키를 바꿨는데도 역시나 되지 않았다.


3. 슬슬 열이 치받아 오는 중, 내가 쓰는 폰트가 한글을 제대로 지원 안해줘서 그러하니, 나눔고딕과 같은 한글전용 폰트를 받아서 설치하라는 해결책을 접했다.

이클립스 > Preference > General 에서 폰트를 바꾸어보았다. 나눔고딕으로.
이게 되면 D2Coding 폰트를 가볍게 포기해주려 했지만 역시나 되지 않았다.


4. 후... 

이클립스 사이트에 들어갔다. 나와같은 사람들이 버그 리포트를 영어로 남긴 것을 확인할 수 있었다. 

이 문제와 관련된 버그리포트를 2건이나 만날 수 있었는데, 그 글이 생성된 날짜가... 2012년???? 

이친구들. 한국 쪼매난 나라라고 너무 신경 안쓰는거 아님?


=> https://bugs.eclipse.org/bugs/show_bug.cgi?id=371397 




결론.


방법이 없다. 열심히 이클립스에 같은 문제를 리포트 하는 수밖에.


뭐 이것저것 해보니 됐다 하는 사람들도 있는데, 이클립스가 아니라 크롬 브라우저에서 그랬다거나... 뭐 이런 내용이다.

맥에서 이클립스 사용하는 사람이 이 문제를 해결한 케이스가 있다면 제발 알려주시길 ... ㅠ_ㅠ


걍 참고 쓰면 쓰는건데, 별거 아닌건데, 

거슬린다 너무너무. ㅠㅠ

  1. 저두에요 ㅠㅠ 2018.11.02 15:20

    너무 짜증나여 이거 ㅋㅋ ㅠㅠ 언제 고쳐질까요

  2. 고마워여! 2018.12.08 15:16

    ㅋㅋ저도같은문제때문에 글찾아보다 발견했네요 ㅋ같은문제로 고생하시네요

  3. dev_mac-_- 2019.03.01 17:03 신고

    저도 검색하다가 봤네요 ㅎㅎ

  4. 겨울 2019.03.29 17:47

    한참 고민하고, 찾고 했는데...
    소용없다는 사실을 알려주신것이 너무너무너무 유익했습니다. 감사합니다.

    • 감사감사 2020.07.16 22:42

      앜ㅋㅋㅋㅋㅋㅋ 저우요ㅠㅠ 네이버 상단에 이 글이 있어서 정말 감사합니다....

  5. 이잎새 2019.04.11 15:54

    공감합니다.
    저도 문제있어서 제가 설정을 잘못했나 하고 구글 검색해다가 이글 보고 기쁨마음으로 들어왔는데....
    해결의 글이 아니였군요 ㅜㅜ
    흑흑 너무한다!! 이클립스!!!
    저는 ESC 누르면서 해결하고 있어용..

    • 코딩코딩 2020.07.30 11:12

      꿀팁 감사합니다 ㅋㅋㅋ
      ESC를 눌러주는게 스페이스바로 매번 띄웠다 지우는것보다 유용하네요 ㅎㅎ

  6. 김자바 2019.09.10 00:21

    헉...저도 찾다가 들어왔는데 아직까지도...안고쳐진거군요...ㅠㅠㅠㅠㅠ빨리 해결되었으면

  7. 이클립스... 2019.09.17 10:55

    아직도인건가요

  8. 이클립스... 2019.09.25 17:00

    너무 짜증나서 찾아봤는데 원래 이런가보네요...ㅎ..... 감사합니다.

  9. k01 2019.10.31 02:08

    ㅠㅠㅋㅋㅋㅋㅋ 여전히 고통받는 맥유저들

  10. 2019.11.18 10:54

    정녕 방법 없는건가요 아랫분말처럼 매번 esc눌러가면서 할수도 없고..

  11. hi 2019.12.02 23:22

    아.....여기까지 찾아 왔습니다. 예전 연습 할땐 인서트 입력 안되고 잘되었는데.....짜증이 몰려 오네요

  12. mac 초보 2019.12.09 17:01

    저도 그렇습니다. 진짜 욕이 저절로 튀어나오네요

  13. 뉴비 2020.02.09 18:42

    저도 마지막 글자가 자꾸 사라져서 찾고있었는데... 리포트나 하러가겠습니다

  14. sozero 2020.03.09 16:30 신고

    이 이슈 관련 오래된 글이 2012년이던데 ㅋㅋㅋㅋ 8년째 계속 리포트 들어올텐데 왜 안고쳐지는지 의문이네요 ㅠ

  15. WB 2020.03.18 14:07

    2020년... 아직도 고쳐지지 않았다...ㅠ

    • ㅋㅋㅋㅋㅋ 2020.07.16 22:43

      zㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ뉴뉴 맥유저들 힘내여 ㅠㅠㅠㅠ

  16. 7월 2020.07.10 02:56

    세상에...현재 2020년 7월 중순인데도... 흑흑...😭

  17. mac유저1 2020.07.11 18:21

    저도 글쓴이와 동일하게 1,2,3경우 다 해봤습니다. 안됩니다.
    포기했습니다. 그냥 작성하면서 한글 다 쓴 후에 "이클립스" + space bar 1번 입력 + delete키 1번 입력 합니다
    ㅋㅋㅋㅋㅋㅋ후.....

  18. -jyh7 2020.11.18 13:41

    유용한 글 매우 잘 배우고 가용~

  19. 2021년 2021.03.06 23:55

    하하...2021년 3월... 아직도 해결되지 않았네요

  20. ㅇㅇ 2021.04.07 17:17

    헛질만하다 선생님 글 보고 현타가 오고 동시에 저와같은 동지들이 많다는 것에 조그만한 위로 받고 갑니다..
    감사해요. 그냥 참고 살께요....

+ Recent posts