유부중년 개발자의 우울

한국 developerWorks에 기고한 번역문 원문: Ajax overhaul, Part 4: Retrofit existing sites with jQuery and Ajax forms 번역: Ajax로 사이트 전면 개편, Part 4: 기존 사이트를 jQuery와 Ajax forms를 사용하여 개선하기 열화와같은 독자들의 성원에 힘입어 연장 방영 중인 Ajax 오버홀 시리즈~ 4부에서는 앞에서 한번 써 먹었던 jQuery Tabs UI와 jQuery Forms를 사용하여, 예제 애플리케이션인 Customize Me Now의 구매 과정을 마법사 스타일의 UI로 개선한다. 百問而不如一見~

아기다리고기다리던(20세기 개그를.. 쿨럭) 그놈 2.24가 나왔어요^O^ 흠... 뭐가 달라졌나 볼까~~ Telepathy 프레임웍 기반의 인스턴스 메신저 empathy...? 그럼 pidgin(aka gaim)은 어떻게 되는 걸까? (라고 했더니 아얄씨 그놈방 상구옹께서 pidgin은 그넘인적이 없다고...-.-) Ekiga 3.0이라... 난 화상채팅 안하니까... 무시~ 노틸리스에 Compact View 기능 추가. 단축키는 Ctrl+3~ 노틸러스에 탭 브라우징 추가!!! GREAT!!! Deskbar(OSX의 QuickSilver 짝퉁)에 계산기, Google Search, Google Code Search 기능 추가. XRandR 호환 듀얼 모니터 / 해상도 조절... 이건 우분투엔 원래 있던..

http://www.suntechdays2008.com/ 10/15(수) 시 간 내 용 07:30 ~ 09:00 참가 등록 09:00 ~ 09:10 환영 오프닝쇼 09:10 ~ 09:50 기술 데모 : 참여의 시대 내일의 기술 09:50 ~ 10:10 환영사 10:10 ~ 11:00 기조 연설 Rich Green/썬마이크로시스템즈 소프트웨어부문 수석 부사장 11:00 ~ 11:20 휴식 및 전시부스 방문 자바와 클라우드 컴퓨팅 효율적인 개발을 위한 혁신 오픈솔라리스 Hands-on-Lab (실습) 11:20 ~ 12:10 GlassFish와 Java EE의 미래 JavaSE6U10 무엇이 달라졌나 리눅스의 미래 : 오픈솔라리스 JAX_WS와 WSIT를 이용하여 신뢰도와 보안성 높은 웹 서비스 구축하기 1..

한국 developerWorks에 기고한 번역문 원문: Ajax overhaul, Part 3: Retrofit existing sites with jQuery, Ajax tabs, and photo carousels 번역: Ajax로 사이트 전면 개편, Part 3: jQuery, Ajax 탭, 회전식 슬라이드쇼로 기존 사이트 개선하기 Ajax 오버홀, Part 1: Ajax와 jQuery로 기존 사이트 개선하기와 Ajax 오버홀, Part 2: jQuery, Ajax, 툴팁, 라이트박스로 기존 사이트 개선하기로 마무리된 줄 알았던 오버홀 시리즈... 열화와같은 독자들의 성원에 힘입어 연장~~?! 하긴.. 그렇게 끝나면 열라 허무했을 거다. 지금 4부까지 번역했는데... 분위기로 봐선 5부도 조만간 나..

오늘 예스24를 뒤적이다 우연히 깨달은 변화... 현재 페이지를 확실히~ 알려주는 빨간 글씨와 사각형... 어쩌면... 기획자, 디자이너, 개발자들이 엄청 싸웠을지도... 그러나 그들은 예쁜 UI 보다는 편한 UX를 선택했고, 나는 그 결과가 만족스럽다. 예쁜 UI와 편한 UX는 공존할 수 없을까...

CVS에서 SVN으로 마이그레이션 하기... 벌써 세번째 인데... 할때마다 헷갈린다. 적어두자... -.-;;; (소 잃고 외양간 고치는...) cvs 서버:현 시점에서의 CVS를 SVN 형식으로 덤프 뜨자. $ cvs2svn --use-cvs --encoding=cp949 --fallback-encoding=utf8 --dumpfile=/tmp/cvs-dump /home/cvs 덤프를 SVN 서버로 복사하자. 같은 서버라면 할 필요가 없다. $ scp /tmp/cvs-dump root@svn.mycompany.com:/tmp/ svn 서버:SVN 리포지터리를 만들자. $ svnadmin create /home/svnSVN을 WEBDAV으로 접근하려면... 이런게 필요하다. $ chgrp -R www-..

짠밥먹고 별 짓 다한다-.-; 아무튼... 먼저 현재 설정을 확인해보자: select dbms_xdb.gethttpport from dual; 손댄적인 없다면 기본값인 8080이 나올꺼다. 이제 바꿔보자: begin dbms_xdb.sethttpport('7080'); end; 만일 웹 콘솔에서 했다면... 다시 접속해야한다: http://localhost:7080/apex 윈도라면 시작메뉴가 사용하는 북마크도 바꿔줘야한다: C:\oraclexe\app\oracle\product\10.2.0\server\Database_homepage.url 이 파일을 노트패드같은걸로 열어서, 요렇게 바꿔주자: [InternetShortcut] URL=http://127.0.0.1:7080/apex 흠냐... 그냥 까먹..

여름 휴가도 있고... 밥먹고 사는 일도 있고 해서... 한참 쉬었으니 다시 시작해보자. dojo의 객체 시스템의 핵심은 dojo.declare다: dojo.declare(className, superClass, { members... }) : 주어진 이름을 가진 클래스를 정의한다. 클래스 이름은 문자열로, 수퍼클래스는 클래스 객체로 지정해야 한다. 수퍼클래스가 없으면 null 또는 [ ] (빈 배열)을 지정하면 된다. 하나 이상의 수퍼클래스(정확히는 하나의 수퍼클래스와 여러 개의 믹스인을 배열로 지정할 수도 있다.먼저, 단순한 클래스를 정의하는 예를 보면: dojo.declare('Point', null, { x: 0, y: 0, constructor: function(x, y) { this.x = x..

웹2.0의 열기가 안정되면서 한 때 잘 나가던 몇몇 회사의 서비스들이 조용해졌다. 씽크프리도 그 중의 하나일지도... 그러나 버뜨! 쓸모도 없는 데모만 보여주고(지금은 뜨지도 않지만)... 스샷만 남발하고... 연기에 연기를 거듭하던 씽크프리 노트가 최근 업데이트에서 모습을 드러냈다. 데모 때 보다 한결 깔끔해진 모습으로~ 고화질(1024x768) 동영상(30M)은 용량 문제로 따로 올렸다. 흠... 솔직히... 아직 제대로된 원격 블로깅 도구라고 하기엔 한~참 멀었지만... 다음 업데이트를 기약하면... 이번엔 요기까지~ 덧. 블로그 포스팅에 촛점을 맞춰서 만들었는데... 관심있는 분들... 더 삼빡하게 하나 만들어 주세요.~.~/

자바스크립트로 코딩 좀 했다는 분들도 IE(참고자료)와 불여우, 그리고 W3C의 표준 DOM 이벤트 모델간의 차이에 대해서 제대로 이해하기보다는 까이꺼~ 대충~ 통밥으로~ 처리하는 경우를 많이 본다. 누가 좋으냐 나쁘냐는 논쟁은 끝이 없으니... 넘어가기로 하고... 골치아픈 브라우져간의 차이점을 신경쓰지 않고 개발할 수 있는 dojo의 이벤트 시스템을 알아보자. dojo.connect(이벤트객체, 이벤트이름, 이벤트핸들러함수) : 지정한 객체에서 지정한 이름의 이벤트가 발생하면 이벤트 핸들러 함수를 호출하도록 "연결"한다. 핸들을 리턴한다.dojo.disconnect(핸들) : dojo.connect()함수의 리턴값으로 받은 핸들을 사용하여 이벤트와 이벤트 핸들러 함수의 연결을 끊는다.뭔 얘긴지 더 헷..

한국 developerWorks에 기고한 번역문 원문: Develop Ajax applications like the pros, Part 1: Using the Prototype JavaScript library and script.aculo.us 번역: 전문가다운 Ajax 응용 프로그램 개발, Part 1: Prototype 자바스크립트 라이브러리와 script.aculo.us 사용하기 developerWorks 특유의 장황한 제목이 인상적이다. 장황한 제목은 무시하고... 내 맘대로 제목을 붙여본다면... 프로토타입과 스크립타큘러스로 배우는 AJAX 프로그래밍 입문.

이번에 알아볼 내용은 애니메이션/효과를 위한 기능이다. 기본 효과 간단한 효과들이지만 dojo base에 포함되어 있어서 dojo.js 파일 하나만 있으면 편하게 쓸 수 있다. dojo.fadeIn(args) : 지정한 노드를 서서히 불투명하게 만든다. args는 여러가지 파라메터를 묶은 해시다. dojo에서는 이런 식의 파라메터를 즐겨쓴다. dojo.fadeOut(args) : 지정한 노드를 서서히 투명하게 만든다.dojo.animateProperty(args) : 지정한 노드의 (CSS) 속성을 연속적으로 변화시킨다. 이 함수만 활용하면 대부분의 효과를 만들 수 있다.간단한 예를 들어 보면: dojo.fadeOut( node: 'title', duration: 1000, delay: 250 }).pl..

뜬금없는 OSGi 기반 웹 어플리케이션 얘기다. OSGi를 실무에 적용하려고 삽질 좀 해 본 사람들이라면 아래의 그림들을 본 적이 있을 것이다(문서 전체). 시나리오1 기존의 WAS 위에 OSGi 프레임웍을 내장해서 돌리는 방식이다. 시나리오2 OSGi 프레임웍이 바닥에 깔리고 그 위에 WAS가 구동되는 방식이다. Equinox나 Felix등이 추구하는 모델은 모두 시나리오2다. Spring-DM도 기본적으로 시나리오2에 스프링 IoC 컨테이너와의 접점을 마련해둔 것 뿐이다. OSGi를 옹호하는 입장에서는 OSGi가 모든 것의 기반이 되는~ OSGi 번들로만 이루어진 세상(class space)을 원하겠지만, 현실의 웹 어플리케이션은 그렇게 자유롭질 못하다. 지금 쓰고 있는 WAS를 버리고, 듣도 보도 ..

F3에 JavaFX라는 뜬금없는 이름을 붙이곤, 자바원 2008에서 그렇게 떠들어 대더니... JavaFX의 첫번째 프리뷰 SDK가 나왔다. 포함된 것들을 보면: 1) JavaFX Compiler & Runtime tools 2) 2D Graphics and Media Libraries 3) Tutorials API docs, and Sample Code 4) NetBeans Plug-in 5) Project Nile - a suite of tools and plug-ins(포토샵/일러스트레이터용!) 그렇다... 역시 넷빈즈 플러그인만 있다. 이클립스 플러그인은... 당근 없다. 하긴... 마티스가 없는 JavaFX는 FLEX Builder없는 FLEX! 뽀대 작살! (역시... OSX은 스샷을 위한 O..

한국 developerWorks에 기고한 번역문 원문: Performance Ajax tools 번역: Ajax 성능 도구 Apache Bench, Tsung, Bonnie++, Wireshark(Ethereal), 그리고 Cometd, Lightstreamer, KnowNow, lighttpd 등의 Comet 구현체들, LiveHttpHeaders 등의 파이어폭스 확장들을 소개한다. 말그대로... 소개만 할 뿐... 너무 기대하지 말자. -.-;;; 그래도 이렇게 모아서 소개해주는 것만으로 큰 도움이 된다.

할 수 있는데 까지 해보자. DOM 노드 위치/좌표 관련 함수들 CSS만으로 모든 레이아웃을 정확하게 계산하기란 쉽지 않다. 디자이너의 현란한 디자인이 IE의 더블마진 버그와 만나는 순간... 때문에 레이아웃 잡는게 여간 골치아픈게 아니다. 그래서 이런게 필요하다: dojo.marginBox(domNode) : 지정한 DOM 노드의 margin box를 얻는다.dojo.marginBox(domNode, {l:가로좌표, t:세로좌표, w:너비, h:높이}) : 지정한 DOM 노드의 위치/크기를 margin box로 설정한다. 위치는 부모 노드의 위치에 대한 상대좌표다(즉, CSS의 position:absolute 다). margin/padding/border는 바뀌지 않지만, content box의 크기는..

남아 있는 유틸리티 함수들 중에서 정말 자주 쓰이는 몇가지만 더 알아보자. dojo.byId(id) document.getElementById(id)와 동일하며 프로토타입의 $(id)와 동일하다. 지정한 id를 가진 DOM 노드를 찾는다. 참고로 dijit.byId(id)와는 전혀 다른 녀석이니 헷갈리지 않기를... 그리고 다른 window(frame/iframe)의 노드를 찾고 싶을 때는 dojo.withGlobal(window,'byId',dojo,[id]) 처럼 하면 된다(뭐가 이렇게 복잡하냐고? 그래도 없는 것 보다는 낫다). $()보다 길어서 타이핑하기 귀찮겠지만... 덕분에 프로토타입이나 jQuery와 섞어서 사용해도 아무런 문제를 읽으키지 않는다. 굳이 $()를 쓰고 싶으면 예전에 쓴 블로그..

웹 프로젝트에서 자바스크립트의 비중이 점점 커지면서, JSLint 같은 검증 도구의 필요성이 날로 높아지고 있다 이걸 매번 소스코드를 클립보드로 복사(copy)해서 jslint.com의 웹 폼에 붙여넣고(paste) 돌리는 짓을 하다가 귀찮아서 몇가지 방법을 찾아 보았다. 먼저, maven: pom.xml에 이런거 대충 추가하자. 그러면 mvn site 돌릴때 같이 실행되서 target/site/jslint/index.html에 보고서가 만들어진다. 중간에 sourceDirectory는 잘 고쳐 주시길... 안고쳐주면 src/main/javascript 가 기본값이다. ... ... org.codehaus.mojo.javascript javascript-report-maven-plugin src/main..

자바스크립트에는 두 가지 타입 검사 연산자가 있다: instanceof와 typeof 그런데 이게 미묘하다. 예를 들어: var hello = "hello"; alert(typeof hello); // string var world = new String("world"); alert(typeof world); // object -,.-;; dojo를 사용해보면 어떨까? alert(dojo.isObject(hello)); // false alert(dojo.isObject(world)); // true alert(dojo.isString(hello)); // true alert(dojo.isString(world)); // true 말나온 김에 한 가지만 더 예를 들어보면: function test2() ..

dojo를 알고 있는 ajax 개발자들 조차도 dojo하면 먼저 뽀대는 나지만 용량이 크기, 느리고, 무거운 위젯 시스템(일명 dijit)을 떠올린다. dijit도 많이 가벼워졌고, 더 가볍게 쓸 수 있는 방법들 많이 있지만, 일단 무시하고... dojo의 기본 시스템(일명 dojo core), 그 중에서도 유틸리티 함수들에 대해서 알아보기로 하자. 서버에서 ajax로 다음과 같은 json 데이터를 받아 왔다고 치자: items: [ { link: 'http://www.googledocs.com/', title: 'Google Docs' }, { link: 'http://www.zoho.com/', title: 'Zoho' }, { link: 'http://www.thinkfree.com/', title..

한국 developerWorks에 기고한 번역문 원문: Debug and tune applications on the fly with Firebug 번역: 파이어버그를 이용한 신속한 웹 애플리케이션 디버깅과 튜닝 파이어폭스를 최강의 웹브라우져로 만든 주역 Firebug에 대한 소개 기사다. 아주 기본적인 내용들을 스크린샷 위주로 쉽게 설명하고 있다. 잘 알고 있는 사람들에겐 따분하고 쓸모없어 보이겠지만, 이 마저도 모르는 사람들이 수두룩하다.

개발자라면 한 번쯤 해봤을 고민... 소스코드 편집기용 글꼴... 리눅스라면 Bitstream Vera Sans Mono, 맥이라면 Monaco가 기본값이어서 그럭저럭 쓸만하지만, 윈도의 Courier(또는 FixedSys)는 ... -.-;;; MS도 개발자들의 이런 불만을 알고 있었는지 Visual Studio 2008과 함께 Consolas라는 글꼴을 공개했지만, ClearType이 적용된 흐릿한 글꼴을 싫어하는 분들에겐 무용지물... 그래서 모아보았다: 내 경우엔 지금은 ProFontWindows를 사용하고 있지만, 변덕이 심해서 언제 바뀔지 모른다.

씽크프리에서 새 서비스를 슬쩍~ 오픈했다. "ThinkFree Online for iPhone"이라는 길고 장황한 이름의 이 서비스를 사용하면 이름 그대로 씽크프리 온라인에 저장되어 있는 문서들을 아이폰이나 아이팟 터치에서 볼 수 있다. 흠... 지금은 볼 수만 있다. 씽크프리 매니저를 사용하면 데스크탑의 문서가 온라인과 싱크가 되니까... 최종적으로는... 흠... 데스크탑의 문서를 어디서나 볼 수 있다는 말씀? 이것이 Boundless?? TODO에 보니까 이것저것 된다고 하니, 일단 맛만 보고 좀 더 기다려보자. 아이폰이나 아이팟 터치를 갖고 계신 씽크프리 사용자라면 지금 바로 눌러보시라~ http://demo.thinkfree.com/guu/ 덧1. (광고) 아직 계정이 없으면, 이 기회에 하나 ..

한국 developerWorks에 기고한 번역문 원문: Ajax overhaul, Part 2: Retrofit existing sites with jQuery, Ajax, tooltips, and lightboxes 번역: Ajax 오버홀, Part 2: jQuery, Ajax, 툴팁, 라이트박스로 기존 사이트 개선하기 Ajax 오버홀, Part 1: Ajax와 jQuery로 기존 사이트 개선하기에 이은 오버홀 완결편. 그 시작은 창대하였으나 끝은 미미하리라...

한국 developerWorks에 기고한 번역문 원문: Ajax performance analysis 번역: Ajax 성능 분석 모처럼 유용한 번역 기사다. 뭐 그렇다고 그동안 번역했던게 백해무익했다는 얘기까진 아니고... -.-; 원 제목을 그대로 번역하다보니... 짧게 "Ajax 성능 분석"이 되버렸는데... 제대로 된 제목은 "Firebug와 YSlow!를 이용한 Ajax 성능 분석"이 되겠다. Firebug는 이제 웹 개발자, 특히 AJAX 개발자들에겐 없어선 안될 친구다. 그러나, 대부분의 개발자들은 Inspector와 Script 디버거 외에는 별로 활용을 하지 않는 것 같다. 하지만 Firebug는 우리가 기대하는 그 이상의 도구다. 이 기사는 Firebug의 Net탭을 통한 성능 측정 방법..

한국 developerWorks에 기고한 번역문 원문: Use XStream to serialize Java objects into XML 번역: XStream으로 자바 객체를 XML로 직렬화하기 오랜만에 자바 기사 번역이다.-.-; 요즘은 완전 AJAX 전담 번역자가 된 듯... 직렬화(serialization)라고 하니까 거창해 보이지만, 정말 단순하면서도 유용한 라이브러리다. 다만, 너무 늦게 나왔다는 것이 문제라면 문제일까... XML이 자리를 잡기 시작할 무렵, 지저분한 SAX와 메모리 귀신 DOM 사이에서 갈등하던 시절에는 apache의 commons-digester가 나름대로 유용함을 인정받았지만, 지금은 어떨까? 왠만해서 XML를 직접 파싱할 필요도 없고, 필요하다고 해도 DOM의 메모리 ..

자바스크립트에는 URL 인코딩과 관련해서 4가지 함수가 있다. encodeURI(), encodeURIComponent(), escape()/unescape() 이 그것인데... 구글신께 여쭈었더니... 이렇게 다르다고 말씀해 주셨다. 정말? 일단, 실험을 해보기로 했다. 저 사이트에 나온 파일을 UTF-8과 EUC-KR로 각각 저장했다. test-utf8.html, test-euckr.html 그리고 각각의 파일의 헤더 영역에 다음의 메타 태그들을 끼워넣은 파일을 두개 더 만들었다. test-utf8-meta.html test-euckr-meta.html 그리고, 이 페이지들을 한글 IE7, 영문 IE6, 영문 IE7, FF 2.0 으로 브라우져로 테스트 했다. 혹시나 싶어서 IE의 경우엔 항상 "UT..

일종의 자뻑+광고이니... 감안하고 보시길... -.-; 씽크프리가 거의 2년여 만에 대규모 업데이트를 했다. 한 참 동안 잠잠했던 탓에 씽크프리가 망해가는 거 아니냐는 얘기도 나돌았지만... 어쨌든 이렇게 멀쩡하게 살아있었다. 그리고 "공짜" 씽크프리 매니저와 워크스페이스라는 새로운 선물을 들고 나타났다. 먼저 MyOffice~ 예전부터 있던 서비스이지만, 많이 쓰이지 않는 기능들을 대거 제거하고 단순화를 시도했고, 다단계 폴더도 지원된다 ^O^ 백엔드의 엔진은 거의 새로 만들었는데, 그 덕분인지 속도도 꽤~ 잘 나온다. 서비스 그 자체로는 다른 회사의 유사 서비스와 크게 차별화되는 부분이 없지만, 씽크프리 매니저나 워크스페이스와의 연동을 통해 파워 업 x 100만배!! ppt 파일의 오른쪽에 있는 작..

한국 developerWorks에 기고한 번역문 원문: Ajax overhaul, Part 1: Retrofit existing sites with Ajax and jQuery 번역: Ajax 오버홀(overhaul), Part 1: Ajax와 jQuery로 기존 사이트 개선하기 developerWorks 기사답게... 제목이 장황하다. 덩달아서 번역도 장황하다. 급하게 번역한 티가 너무 팍팍 난다. jQuery의 철학적 근간?!이라고 할 수 있는 "조신한 자바스크립트(Unobtrusive JavaScript)" -- 누군가는 "나대지않는 자바스크립트"라고 번역했더라 --에 "점진적 향상(Progressive Enhancement)"이라는 뜬금없는 개똥 철학까지 들먹이며... 기존 사이트의 최대한 손대지..

한국 developerWorks에 기고한 번역문 원문: Ajax and XML: Ajax for tables 번역: Ajax와 XML: 테이블을 위한 Ajax 흠... 급하게 번역한 티가 팍팍 난다-.-;;; 테이블을 위한 Ajax라니...-.-;;;; 제목은 "Ajax로 table 다루기 정도"로 바꾸면 좋겠다. 아무튼 prototype.js를 사용해서 tab, table, glider(slide-in effect) 등의 자주 쓰이는 기법을 (미주알 고주알) 정말 알기 쉽게 설명하고 있다.(내가 그랬다는 얘기가 아니고 원저자가 그랬다는 얘기다) AJAX라는 말만 들어봤지 실제로 써본적은 없는... 개발자라면...(이런 분들 꽤 많다) 이 기회에 한 번 맛이라도 봐두자. AJAX를 나름 좀 써봤다는 분들..