오픈소스의 좋은 점 중 하나는 제품 개발과정을 볼 수 있다는 것입니다. 소스 프로젝트의 구성을 볼 수 있고, ant나 maven 등의 빌드 구성과 TestCase를 어떻게 만들었는지 확인이 가능합니다.

httpunit이라는 소스포지의 오픈소스를 통해서 그 구성을 살펴보겠습니다.
http://httpunit.sourceforge.net 에 접속합니다.

왼쪽 메뉴 중 Download를 클릭해서 다운로드 받습니다.

파일을 이클립스에서 import 해보겠습니다. httpunit 이라는 이름으로 자바프로젝트를 하나 만듭니다.

프로젝트를 선택하고 컨텍스트 메뉴에서 Import... 를 선택합니다.

ar 이라고 필터란에 입력하면 Archive File 메뉴가 보입니다.

앞서 다운로드 받은 httpunit-1.7.zip 파일을 선택합니다.

폴더 통째로 import를 해왔습니다.

디렉토리의 구성을 잘 살펴볼 필요가 있습니다.
doc : 아마도 html 이나 프로젝트 관련 문서들 원본 등이 있을 것입니다.
examples : httpunit을 이용하는 예제들 디렉토리
jars : 프로젝트 관련 jar 파일 디렉토리
lib : httpunit.jar 산출물 생성 디렉토리
META-INF : jar 압축시 기본 생성 디렉토리
src : java 소스 디렉토리
test : 테스트케이스 디렉토리
build.xml : 프로젝트 빌드를 위한 ant 빌드 스크립트


이러한 구성을 참고로 자신이 진행하는 프로젝트의 소스 및 파일들을 관리하는 것도 좋을 것입니다.

eclipse panels

eclipse panels

이클립스의 각 부분 명칭입니다.

가운데 프로그래머의 핵심 공간인 에디터(Editor)를 중심으로 보좌하는 뷰(View)들이 둘러싸고 있습니다. 에디터의 상태에 따라 뷰에서 보여지는 내용들이 변하게 됩니다. 뷰와 에디터는 연결되어 있다고 생각하시면 됩니다.
각 패널들(에디터, 뷰)은 이동이 가능합니다. 그리고 탭으로 여러 개의 뷰끼리 또는 편집파일끼리 겹쳐놓을 수 있습니다.


제일 상단에 메뉴바가 위치하고 그 아래 아이콘 집합인 툴바가 있습니다. 그 오른쪽에는 퍼스펙티브(Perspective)를 선택할 수 있는 퍼스펙티브 아이콘들이 있구요. 퍼스펙티브는 작업의 종류에 따른 레이아웃 구성이라고 생각하시면 됩니다.

그리고 제일 아래 상태표시줄(Status Bar)이 있습니다.

firebug CSS Layout
firebug css layout tab

firebug css layout tab


간만에 올리는 firebug 관련 글입니다. 우측의 Style , Layout , DOM 에서 Layout 으로 했을 경우 좌측 html 태그 선택에 따라서 상단 view 영역의 색상이 표시가 됩니다. 그리고 pixel 단위의 화면 자(screen ruler)도 보이고, 마진margin은 노란색으로 패딩padding은 보라색으로 표시됩니다.
Layout 에 해당 숫자는 변경할 수 있고, 라이브로 위에 변경내용이 보입니다. 물론 서버에서 돌아가는 코드는 여기서 얻어진 수치를 바탕으로 직접 수정해야겠죠. ^^;

조사하면 다 나와 버튼 아시죠. 개똥벌레(firebug) 이미지 옆에 Inspect , 이거 클릭하고 상단에 마우스를 움직일 때마다 해당영역의 코드와 Layout을 볼 수 있습니다.

간만에 UI 작업하면서 짧게 포스팅합니다. 

뷰를 X를 눌러서 없애거나 이리저리 옮겨놓고 정리가 안될 때
Reset Perspective 한방 눌러주시면 깔끔하게 정리됩니다.

Reset Perspective

Reset Perspective


저 오른쪽에 빨갛게 보이는 것은 mylyn에서 기한이 지나도 완료가 안된 태스크가 표시됩니다. 무시무시하죠. ^^;
엄청난 잠꼬대가 기억나는군요.
"쪼금만 기다리세요. 거의 다 됐어요. ㅠㅠ;"

+ Recent posts