도서출판 인사이트 ::

자바스크립트 개발자, 존 레식(John Resig) 따라잡기

2008/08/14 15:53 | Posted by 너굴;

존 레식(John Resig)을 아세요?

jQuery의 개발자로 유명한 존 레식은 참으로 다양한 방면에 그 재능을 빛내고 있습니다.

존 레식은 자바스크립트의 아버지인 브렌단 아이히(Brendan Eich)와 함께 모질라 재단에서 자바스크립트 에반젤리스트로 활동 중입니다. 예전에는 ‘OLPC(한 아이에게 노트북 한 대씩!)’ 이라는 프로젝트에도 참여했고, Juniper Bay라는 웹 서비스 회사도 운영했었습니다. 이런 일들을 하면서도 jQuery라는 걸출한 라이브러리를 만들어 냈고, processing이라는 데이터 시각화 언어에도 관심이 있는지 자바스크립트로 processing을 구현한 processing.js를 만들기도 했지요. 이 외에도 정말 많은 자바스크립트 관련 도구를 만들어 내고 있습니다.

이런 존 레식이 자신만의 비기를 알려 세상을 널리 이롭게 하고자(홍익인간? ^^) 『프로 자바스크립트 테크닉(Pro JavaScript Techniques)』이라는 책을 썼습니다.

이 책은 고급 활용서라고 할 수 있습니다. 자바스크립트의 기본 문법이나 시시콜콜한 잔소리는 찾아볼 수 없습니다. 당장이라도 써먹을 수 있는 함수와 기법들이 가득합니다. 여기저기서 얘기하는 'Unobtrusive 자바스크립트'라는 개념에 대해, 도대체 그 개념이 웹 페이지를 어떻게 바꿔준다는 건지, 스크린샷과 소스코드만 봐도 쉽게 이해할 수 있습니다.
그렇다고 소스코드만 잔뜩 실려있는 건 아닙니다. '자바스크립트에서 이벤트의 진행 방향', '향상된 Ajax라고 할 수 있는 Comet 기술의 데이터 흐름도' 같은 것들은 그림과 함께 상세하게 설명해줍니다. 이 책을 따라하다 보면 어느새 나만의 라이브러리를 만들 수 있겠다는 자신감이 생기실 겁니다.

원서의 딱딱한 표지는 고난이도의 춤을 추는 비보이들의 모습으로 바뀌었습니다. 저로서는 도저히 따라할 수 없는 자세이고, 무리해서 따라하다가는 팔꿈치가 나가버리지 않을까 생각됩니다. 아무래도 표지에 이런 문구를 넣을 걸 그랬나봅니다.

"탈골이 우려되오니, 표지의 자세를 따라하지 마세요"

8월 25일부터 온라인 서점에서 예약구매하실 수 있습니다. ^^

보너스.

아래는 존 레식이 발표한 자료에서 캡처한 화면입니다. 지난 번 올렸던 어떤 자바스크립트 라이브러리를 사용해야 할까요?의 Part 2라고 할 수 있겠네요. ^^

TAG JavaScript, 존 레식, 프로 자바스크립트 테크닉

Trackback 2

Comment 3

분류없음

자바스크립트 업그레이드 프로젝트

2008/07/29 10:28 | Posted by 너굴;

자바스크립트 개발 능력은 Ctrl과 C를 동시에 누를 수 있는 능력이다.

예. 과거에는 그랬습니다. 자바스크립트 개발 능력이 곧, 어디엔가 존재하는 스크립트를 카피할 수 있는 능력을 의미하기도 했습니다.
하지만 이런 상태로 개발을 계속 하다보면 코드 양이 늘어나고, 브라우저에 로딩되는 속도가 느려질 테죠. 이때쯤 되면 ‘아차!’ 싶지만 그렇다고 속도가 느린 코드들을 삭제하면 웹 사이트 여기저기서 자바스크립트 오류가 발생합니다. 바로 총체적 난국이라고 할 수 있죠.

여러분도 자바스크립트로 개발하면서 이런 경험이 있을 겁니다.

덕지덕지 기워놓은 스크립트 사이에 또다른 기능을 추가하자 코드 여기저기서 충돌이 발생한다.
멋진 애플리케이션을 파이어폭스나 오페라 같은 브라우저에서 열자, 보기 흉하게 깨지고 제대로 작동하지도 않는다.
모바일 환경같이 자바스크립트 지원이 빈약한 기기들도 우리가 만든 애플리케이션을 사용하게끔 하고 싶다.
내가 방금 추가한 기능이 제대로 작동하는지 테스트할 방법이 없는 것 같아 불안하다.

혹시 지금도 그렇다면 이제 자바스크립트를 업그레이드 할 때입니다.

자바스크립트에 새 버전이 나왔냐구요? 아, 그렇지는 않습니다.
지금껏 자바스크립트를 자바스크립트답게 사용하지 않았으니, 이제는 제대로 사용해보자는 의미로 ‘자바스크립트 업그레이드’라는 수식을 붙여봤습니다만, 사실 자바스크립트를 업그레이드한다기보다는 자바스크립트 개발자가 업그레이드된다는 말이 맞을 겁니다.

. 원래부터 자바스크립트에 내재되어 있던 객체지향적인 파워를 이끌어낼 수 있는 개발자.
. 자바스크립트 코드도 테스트하고 디버깅하여 더욱 견고한 애플리케이션을 만들어내는 개발자.
. 브라우저에 구애받지 않으면서도 기능을 추가할 수 있는 개발자.
. 최악의 경우 자바스크립트를 사용할 수 없을 때라도 여전히 잘 작동하는 애플리케이션을 만드는 개발자.

jQuery를 개발한 존 레식(John Resig)은 『프로 자바스크립트 테크닉』에서 여러분을 위와 같은 개발자로 업그레이드해주겠다고 약속합니다.

여러분이 이미 그런 수준이시라구요? 그렇다 해도 jQuery라는 멋진 라이브러리(자바스크립트 라이브러리 사용률 1위를 향해 무섭게 질주하고 있답니다)를 개발한 존 레식(John Resign)의 노하우를 전수받을 수 있는 기회를 놓치지는 마세요. 당장에라도 응용할 수 있는 예들이 여러분을 기다리고 있으니까요.

곧 출간될 『프로 자바스크립트 테크닉』을 기대하세요. ^^

책 내용은 아래에......

more..

TAG JavaScript, jQuery, 자바스크립트, 존 레식

Trackback 0

Comment 10

책 이야기

어떤 자바스크립트 라이브러리를 사용해야 할까요?

2008/07/23 13:59 | Posted by 너굴;

자바스크립트 라이브러리 계의 대부(GodFather)격인 프로토타입(Prototype)의 독주 체제가 주춤한 가운데 Dojo, YUI, mooTools, jQuery 등 수많은 라이브러리들이 여기저기서 할거하고 있습니다. 작금의 라이브러리 시장은 춘추전국 시대라해도 과언은 아닐 겁니다.

라이브러리를 선택하는 일은 개발 과정 전반에 영향을 주기 때문에 매우 신중할 수밖에 없을텐데요. 아마도 가장 먼저 검토하는 것은 각 라이브러리들의 장단점일 겁니다.

아래 링크에서 각 라이브러리를 비교한 표를 보실 수 있지요.
http://javascriptant.com/articles/24/javascript-libraries-by-comparison

한글 자료로는, KCI 님께서 프로토타입과 jQuery의 사용법을 비교하신 내용이 있습니다.
http://dancer.tistory.com/category/Front-End%20Engineering/Javascript

때론, '어떤 라이브러리의 사용자가 더 많은가?'라는 질문이 라이브러리 선택을 좌우하기도 해서, 여기저기서 사용자 조사를 하지요.

다음은 Nitobi의 2008년 2월 설문조사 결과입니다. 총 570명이 답변했다고 하네요.

# jQuery: 144
# Prototype: 143
# Scriptaculous: 127
# YUI: 99
# Ajax for ASP.Net (Atlas): 91
# Mootools: 65
# Dojo: 63
...

http://www.nitobi.com/images/surveyQ10.gif

pingdom이라는 사이트에서도 2008년 6월, Alexa US 기준 상위 100개 웹 사이트와 Webware 기준 상위 100개의 웹 응용프로그램을 대상으로 조사를 했습니다. 결과는 프로토타입(13건)이 jQuery(11건)에 약간 앞서기는 했지만 큰 차이는 없다고 했네요. 두 프레임워크를 함께 쓰는 사이트들도 있다고 합니다.

그렇다면 국내 사정은 어떨까요? 랭키닷컴의 6월 자료를 바탕으로 조사를 해봤더니 Top 25개 사이트 중 공개용 라이브러리를 사용하는 사이트는 여섯 군데였고 그 중 다섯 곳이 프로토타입(1.4가 대부분)을 약간 변경해서 사용, 나머지 하나는 YUI를 사용중이었습니다. (수작업으로 조사하다보니 꼼꼼이 체크하지는 못했고 그냥 .js 파일 이름과 코드 주석 부분만 봤습니다.)

일반 웹사이트들의 라이브러리 사용 비중이 낮은 편이어서 웹 2.0 서비스들도 조사해봤는데요. Web2Dong(www.web2dong.com)에 등록된 국내 웹 2.0 서비스 21개 중 프로토타입이 10개, jQuery가 2개, YUI가 1개였습니다. (프레임워크를 두 개 사용하는 곳도 있었습니다.)

아무래도 프로토타입이 한글로 번역된 문서가 많기 때문이 아닐까 싶은데요. 한 가지, 아쉬운 점은 대부분의 문서가 최신 버전인 1.6을 반영하지 못했다는 점입니다.

이번에 저희가 출간하는 『프로토타입과 스크립타큘러스』가 이런 아쉬운 점을 메울 수 있으리라 기대해봅니다. 프로토타입 1.6과 스크립타큘러스 1.8을 기반으로 설명하기 때문에 최신 내용들을 반영했고, 박영록 님께서 옮긴이의 글에서 언급하셨듯이 공식 문서에 없는 내용들까지 있다고 하니, 최신 정보에 목말랐던 분들께 도움이 되지 않을까요?

TAG JavaScript

Trackback 1

Comment 3

책이 나오기까지

책 표지는 어떻게 만들어지는가? - 프로토타입과 스크립타큘러스(Protptype and script.aculo.us)

2008/06/26 11:01 | Posted by 인사이트

프로그래머가 ‘작동하는 소프트웨어(Working Software)’를 만들기 위해 머리를 짜내고, 이해관계자와 협의하며 섬세하게 코드를 다듬듯, 편집자도 책을 만드는 과정에서 독자에게 책이 어떻게 전달될까를 고민하며 한 단계 한 단계 정성을 다합니다.

그 각 단계 중 어느 하나 중요하지 않은 게 없지만, 개중 큰 비중을 차지하는 것 중 하나가 표지라 할 수 있겠습니다. 독자가 책을 볼 때의 첫 느낌을 좌우하니까요.

어느 날 불쑥 디자이너에게 제목만 얘기해 주면 표지가 ‘생산’되어 나오는 게 아닐 테니, 편집자는 원고를 받아드는 순간부터 표지를 어떻게 할까 머리를 싸매게 됩니다.

예컨대 『프로토타입과 스크립타큘러스(Protptype and script.aculo.us)』라는 책을 발간키로 했는데 이걸 디자이너에게 어떻게 설명하면 좋을까요?

자바스크립트(JavaScript)는 웹 개발에 쓰이는 동적 언어로 최근 리치 클라이언트 환경이 점점 중요하게 되면서 새로이 조명 받고 있는 프로그래밍 언어라 할 수 있습니다. 프로토타입(Prototype)이나 스크립타큘러스(script.aculo.us)는 이 자바스크립트 프레임워크인데. 자바스크립트 개발을 편리하게 해주고, 특히 스크립타큘러스는 비주얼한 이미지를 표현하는 데 탁월...... 어쩌구 저쩌구 ........

아마 이렇게 설명하면 알아들을 수 있는 (책)디자이너가 거의 없을 겁니다.

물론 이렇게 설명하진 않고

자바스크립트란 건 말이죠. 예전에 카페 게시판 같은 데 보면 글씨가 동동 떠다니며 움직이는 게 있잖아요. 그런 걸 만들었거든요. 근데 최근에 서점 같은 데 들어가면 책 이름의 첫 글자를 치면 그 첫 글자로 시작하는 책들이 스르릉~ 하고 열리잖아요. 그런 걸 만들어요. 예전에 비해 화면이 훨씬 멋있어 보이잖아요. 요즘엔 그런 걸 자바스크립트로 만들어요. 웹을 풍성하게 보이게 해주죠. 에이젝스(Ajax) 같은 게.... 뭐 몰라도 괜찮아요. 하여간 그런 게 있다구요.

프로토타입이나 스크립타큘러스는 그 자바스크립트로 프로그램을 만들 때 편리하게 해주는 거예요. 프레임워크라고 하죠. 거... 있잖아요. 자동차 차체(framework). 같은 프레임워크에서 소나타도 나오고 산타페도 나오고 하잖아요. 같은 프레임을 쓰니 비용도 절약되고......

이렇게 마구마구 풀어서 쉽게 얘기하면 대략 설명하고자 하는 게 뭐다 하는 정도를 알아듣게 되죠.

그 정도면 디자이너가 알아서 할까요? 당연히 그 설명을 들은 디자이너는 자기가 이해한 걸 갖고 어떻게 구현할까 머리를 짜죠. 그래도 책이 어떤 내용을 담는지 이해(?)했다는 것과 그걸 시각적으로 구현하는 건 완전히 다른 문제입니다. 표지에 자동완성 기능을 보여주는 화면을 덩그마니 올릴 수는 없잖아요.

어떻게 해야 더 잘 설명할까 고심하다, 이 책을 옮기신 박영록 님께 프로토타입이나 스크립타큘러스를 더 잘 이해할 수 있게 해주는 방법이 있을까 하고 요청했습니다.

박영록 님은

프로토타입(Prototype)은 원형이 되서 공장에서 차체를 빨리빨리 찍어내는 역할을 하고 스크립타큘러스(script.aculo.us)는 찍어낸 차체를 가지고 차를 데코레이션하고 완성하는 역할을 하는 그런 느낌이죠. 이런 느낌을 살릴 수 있으면 꽤 괜찮을 듯.

라는 설명과 함께 아예 이미지를 직접 그려 보내주셨습니다.

이제 저희가 만들려는 책의 내용이 뭔지 ‘그림’으로 그려지나요? 그림까진 그려지지 않더라도 뭘 설명하려는지는 한층 명쾌해졌죠?

편집자로선 책을 설명하기 위해 최선을 다했고, 이제 이걸 구현하는 건 온전히 디자이너의 몫인 겁니다. 같은 설명을 했더라도 어떻게 구현되어 나오는지는 디자이너에 따라 천차만별이 될 겁니다.

아래는 완성된 시안입니다.

어떠세요? 글을 따라 오시면서 책 표지가 어떻게 나올지 조금씩 예상하셨을 텐데, 생각하시던 표지와 완성 시안이 비슷한가요? 완성 시안은 책 내용을 제대로 설명하고 있나요?

ps. 듀트 님께서 얼마 전 발간된 『자바스크립트 완벽 가이드』의 표지가 꽤나 어색하다는 의견을 주셨습니다. 댓글로 설명 드렸듯이 ‘오라일리(O'Reilly)’의 동물 시리즈는 디자인 제약이 있어, 코뿔소를 그대로 갖다 쓸 수밖에 없었답니다. 아무래도 디자인이 섞이게 되니 뭔가 잘 맞지 않는 느낌을 갖게 되는 거죠. 그래도 저희가 발간하는 자바스크립트 책들은 통일된 느낌을 갖고 싶어, 그렇게 디자인을 요청했답니다.

동적(dynamic)인 언어인 자바스크립트의 느낌을 살리고 싶어 표지 하단의 동글동글한 디자인을 선택했는데......

TAG JavaScript, 책제작, 표지

Trackback 1

Comment 5

분류없음

2007년 1분기 컴퓨터 서적 판매추이 (해외)

2007/05/28 14:24 | Posted by 너굴;

동물표지 컴퓨터 책으로 유명한 오라일리 출판사에서 2007년 1분기동안 컴퓨터서적 판매에 대한 자료를 내놓았습니다.
전체적인 시장은 10%가 조금 안되게 감소되었다고 하는데요. 전체 시장에서 각 언어에 대한 서적이 얼마나 팔렸느냐를 아래 그림처럼 나타냈습니다. 하단 중앙에는 성장을 거듭하고 있는 루비가 꽤 많은 면적을 차지하고 있군요. 2006년 4분기와 대비해서만 대비 성장율이 107%이고, 2006년 1,2분기에는 분기마다 600%를 넘는 성장률을 보였답니다. 전체 시장의 5.74%를 차지 했네요! 판매량 Top 10에 진입!

저희 출판사에서 곧 선보일 Lua도 오른쪽 구석에서 선전하고 있는데요. 작게 구석에 자리 잡고 있긴 하지만, Lua는 책이 몇 권 없어, 종수 대비 시장 크기로 하면 또 다른 해석도 가능하답니다.