[EP] 개발자를 위한 ‘共感(공감)’ 세미나 12회 발표자료 : 혼자서 프로젝트 수행하기..

출처 : Outsider's Dev Story https://blog.outsider.ne.kr/

지난 7일 교보타워에서 공감 세미나가 있었다. 오랜만에 참석하는 공감세미나이긴 하는데 이번에는 KSUG쪽 세션을 맡아서 발표자로 참석을 하게 되었다. 처음에는 첫 세션을 맡았지만 낮에 갔다와야 할 곳이 생겨서 마지막 세션으로 바꾸었지만...

이번 세션은 그냥 사석에서 얘기를 나누다가 프로젝트 할때 아이콘 폰트는 뭐 쓰고 프레임웍은 뭐 쓰고 이런 얘기를 나누다가 fupfin님이 그걸 발표해도 괜찮겠다고 해서 시작되었다.(그때는 농담인줄 알았지만...) 잉여력을 발휘해서 학습 겸 개인 프로젝트를 많이 하는 편인데 그럴때 사용할만한 도구들을 소개하는 발표였다.


혼자서 프로젝트 수행하기 from Outsider

나는 네이밍을 잘 못하는 편인데 특히 이런 발표나 글 같은 경우 내용은 채우겠는데 제목짓는 건 참 어렵다. 나름 고민해서 지은 제목이긴 하지만 개인 프로젝트를 하면서 도움이 될만한 도구들의 소개가 위주인데 제목에서는 잘 안타난것 같아서 아쉽다. 처음에 발표하기로 하고 이런 저런 유용한 도구를 소개하는 것도 괜찮겠다고 생각은 했지만 막상 발표준비를 하다보니 발표시간만큼의 분량이 잘 생각나지 않았다. 상황별로 누가 물어보면 뭐 쓰면 좋겠다 라고 대답해 줄 수 있겠지만 막상 처음부터 생각하니까 "내가 무슨 도구를 쓰더라", "이 도구는 다들 알고 있는 것 아닌가?"하는 생각이 많았다. 그래서 처음부터 기획하고 디자인하고 서비스하는 과정에서 내가 사용하거나 참고할 만한 도구를 위주로 자료를 만들었다. 이런 도구를 설명하는 발표는 해당 도구나 서비스를 아느냐 모르냐의 차이일뿐 어떤 사전지식이나 내공(?)이 필요한건 아니라서 꽤 유용하다고 생각하지만 자칫하면 다들 하는 너무 쉬운 것만 말할 수도 있어서 조심스럽기도 하다. 다행히 끝나고 몰랐던게 많았다고 해주신 분들이 계셔서 다행이었다.

추가적으로 기존에는 발표자료를 만들때 그림을 많이 넣는 편이다. 이전에는 거의 전 페이지에 이미지를 넣어서 만들었는데(이미지 찾는데 시간이 엄청 걸린다.) 최근에는 발표내용을 전달하는데 얼마나 유효한가에 대해서 좀 의문이 들었다. 발표자료 만드는 스킬을 좀 더 올리고 싶은데 적절한 상황에서 이미지를 활용하는 것은 전달에 도움이 되지만 그냥 습관적으로 이미지를 넣어서 만드는 경우도 많은 것 같아서 이번에는 이미지를 좀 자제하고(스샷이 많았지만) 텍스트를 넣으려고 했다.(발표자료 만드는건 역시 어렵;;;)

[JS]웹개발자를 위한 Cheat Sheet 모음..

출처 : Outsider's Dev Story https://blog.outsider.ne.kr/

다른쪽도 마찬가지겠지만 웹개발을 하다보면 메서드명이나 프로퍼티명이 헷갈릴때가 많다. 아예 어떻게 쓰는건지 모르는거 말고 어떻게 쓰는지 그게 있다는건 아는데 갑자기 쓰려니 이름이 헷갈릴때.... 분명히 있다.
getElementByTagname이던가 getElementByClass이던가 하는듯.... 스펠링도 헷갈리고 각 언어나 라이브러리마다 메서드명도 약간 차이가 나고... 함수명 하나 찾을라고 인터넷 뒤지거나 책찾아보는 것도 은근히 번거로운데 이런게 다른사람들도 생각하는 문제인지 Cheat Sheet라는 게 존재한다.

Cheat Sheet라는건 쉽게 말하면 컨닝페이퍼정도? A4한장 정도의 사이즈에 이쁘게 잘 정리해서 필요한 각 메서드나 프로퍼티를 정리해 놓아서 바로바로 참고해서 쓸수 있게 해 놓은 걸 말하는데 Cheet Sheet를 잘 모아놓은 포스팅이 올라와서 소개한다.

The Best Cheat Sheets for Web Designers and Developers

이곳에 올라와 있는 Cheat Sheets는

• CSS
• Prototype 1.5.0
• Script.aculo.us
• Mootools
• PHP
• jQuery
• Javascript
• XHTML
• HTML
• Ruby on Rails
• mod_rewrite
• Perl
• htaccess
• .Net
• ActionScript 2.0
• mySQL
• ASP/VBScript
• Ajax
• Worldpress
• Blogger
• Movable Type
• MovableType ExpressionEngine Quick Reference
• RSS 2.0
• TypePad

가 올라와 있다.

좀 잘 활용해 볼려고 하긴 하는데 아직은 습관이 안붙어서 잘 안된다.(솔직히 아예 알지도 못하는 메서드들이 너무 많아서.. ㅠ..ㅠ)

[DEV]웹개발을 할때 IE 오류메시지 셋팅..

출처 : Outsider's Dev Story https://blog.outsider.ne.kr/

머 개발을 하면서 버그 없이 한번에 개발한다는 것은 말도 안되고 디버깅을 하는데 있어서 오류메세지는 아주 중요하다.

IE에서 흔히 볼 수 있는 에러메시지이다.

그냥 클라이언트에게는 깔끔한 화면일지 몰라도 개발하는 입장에선 실제적으로 아무런 도움이 안된다. 머가 문제가 있다는건지.. 막막할 따름이다.

이 화면은 IE 7 에서의 화면이긴 하지만 IE6에서도 동일한 옵션이 있다. "HTTP 오류 메시지 표시"에 대한 체크를 풀어준다.

그리고 아까의 사이트에 다시 들어가보면...

HTTP메시지가 사라지고 위와 같은 메시지가 출력된다. 디버깅을 하기에 어느쪽이 좋은지는 머 비교해볼 필요도 없다.

[JAVA]이클립스 WTP로 웹개발하기..

출처 : Outsider's Dev Story https://blog.outsider.ne.kr/

이클립스에서 JSP웹개발을 할때 많이 쓰는 롬보즈와 WTP중 WTP이다. 롬보즈에 비한다면 훨씬 설정이 간단한 편이다. 사소한 버그들이 좀 보이긴 한데 서로 장단점이 있어 보인다.. 툴의 선택은 좀 더 써봐야 할 것 같고 WTP의 설정을 보자.

WTP는 Web Tools Platform의 약자인데 이클립스 3.2이상인가 버전부터는 WTP가 포함되어 있는 All-in-One버전이 같이 나와 있다. 이걸 다운받아서 사용하면 된다. 솔직히 뭐 설정이랄 것도 없다.

[Windows] - [Preference]에 들어가서 Server밑에 Installed Runtime을 찾아 들어간다. 이곳에서 사용할 서버를 설정해 주어야 한다. 여기서는 톰캣 4.1버전을 사용했으므로 Add를 눌러서 톰캣 4.1을 선택해 주고 Next를 누른다.

톰캣이 설치된 폴더를 선택해주고 JRE는 사용하는 JRE를 선택해 주면 된다. 여기서는 java 1.4를 사용하고 있으므로 J2sdk 1.4를 선택해 주었다.

이것만 설정해 주면 WTP의 설정은 끝났다. 이제 그냥 개발을 하면 된다. Lomboz에 비한다면 설정과정이 무척 단순한 것을 알 수 있다.


그럼 이제 개발을 해보자.

New프로젝트를 해서 Web밑의 Dynamic Web Project를 선택해 주고 Next를 누른다.

당연히 프로젝트 이름을 써주고 Target Runtime에 사용하려는 서버가 제대로 설정되어 있는지를 확인한 뒤에 Finish를 누르면 JSP개발을 할 프로젝트가 생성된다.

자동으로 WebContent라는 폴더가 생기는데 이게 웹사이트의 루트가 되는 곳이다. 이곳에서 우측마우스클릭을 해서 JSP페이지를 추가해 주면 된다. Java파일은 프로젝트에서 class를 추가해주면 자동으로 src에 위치하게 된다. (package를 무조건 사용해라.)

개발을 했으면 이제 봐야지 않은가... 보려는 파일을 마우스 우클릭을 해서 Run on Server를 하면 이클립스가 자동으로 톰캣을 실행하고  브라우저에 보여준다.

기본적으로는 이클립스의 내장브라우저에 보여주는데 이건 편할수도 있으면서 불편할 수도 있다. 브라우저를 원하는 브라우저로 보려면 [Windows]-[Web Browser]에 들어가서 원하는 브라우저를 선택해 주면 Run on Server를 했을때 선택한 브라우저가 실행된다.

덧) 롬보즈와 WTP의 큰 차이점은 롬보즈는 실제 배포를 하고 WTP는 실제로 배포하지 않고 실행을 한다는 것이다. 무슨말이냐 하면 롬보즈는 배포를 해서 실행해 보기 때문에 배포를 한 시점에서 그 웹페이지는 실제 운영될수 있는 별도의 페이지가 되는 것이다. (때문에 톰캣을 미리 켜두고 실행해야 한다. 물론 이클립스 내에서 실행할 수 있지만...)

하지만 WTP는 미리 톰캣을 실행해 두면 안된다. 따로 톰캣폴더안에 Context를 만들고 웹사이트를 돌리는 것이 아니라 WTP가 이런 일을 가상으로 해주기 때문에 WTP에서는 Data Source를 사용하기 어렵다고 한다. Class.forName으로 DB연결을 하고 마지막 배포시에만 Data Source로 바꾸어 주도록 하자.