사이드바 영역으로 건너뛰기

일본 여행 이후

아는 분들은 아시겠지만,

얼마 전 일본에 다녀왔습니다.-_-v

평소에도 애니메이션이나 만화를 즐기는 편이고 일본 영화도 자주 보는 편이라

일본이라는 동네에 한 번 꼭 가 봐야겠단 생각은 전부터 하고 있었지만

이제서야 그 생각을 현실화시킬 기회가 온 것이었죠.

 

오사카와 교토를 2박 3일의 일정으로 다녀왔는데,

날씨 자체는 별로 춥지 않았지만 바람이 많이 불어서

돌아다니기에 좋은 기후는 아니었습니다만...

아직은 20대-_-라는 신념으로 발아프게 다녔죠.ㅎㅎ

 

자세한 여행기는 사진이 나오는 대로 올리도록 하고,

여기선 이번 여행을 통해 느낀 바를 말해보겠습니다.

 

일단 일본인(최소한 오사카 시민)은 매우 친절합니다.

처음 오사카에 도착해서 호텔을 찾아갈 때 길을 잃어버리는 바람에

마침 가게 앞에서 짐을 나르고 있던 청년에게 어설픈 영어로 길을 물어보았습니다.

이 사람 우리가 건네준 지도를 한참 들여다보더니

하던 일을 버려두고 한참을 같이 가 주더군요.

(물론 일하기 싫어서 그랬을 수도 있지만-_-;;;)

돌아오는 날에 백화점에서 물건을 사고 동전을 내는데

동전 몇 개가 바닥에 떨어졌습니다.

100엔짜리 10엔짜리는 주웠는데 1엔짜리는 줍기가 귀찮아 그냥 돌아섰는데

어떤 할머니가 굳이 주워서 쫒아와 건네주더군요;;;

정말이지 기본적으로 친절한 사람들입니다.

 

일본(최소한 오사카와 교토)은 대중교통이 매우 발전한 동네입니다.

교토에서는 지하철보다 버스를 많이 이용합니다.

그렇게 도시가 크지 않거니와 버스망이 매우 잘 발달되어 있기 때문이죠.

당연히 교토 버스는 처음 타 보는 것이었지만, 한 번도 목적지를 잘못 지나친 적이 없었습니다.

교토의 버스는 전부 저층 버스입니다.

휠체어도 쉽게 들어올 수 있도록 설계가 되어 있죠.

버스 정류장에서 어떤어떤 버스가 얼마 정도 기다리면 도착한다는 안내가 되어 있습니다.

오사카 지하철에서는 안내원이 항시 대기하고 있는데 이 사람들도 매우 친절합니다.

민영화된 지하철이 많고 종류가 많아서 지하철을 갈아타려면 한국보단 조금 복잡한데

쉽게 안내를 받을 수 있기 때문에 큰 어려움없이 지하철을 이용할 수 있습니다.

 

오사카 사람들은 한국인과 매우 비슷하게 생겼습니다.

도쿄만 하더라도 별별 괴기한 패션의 인종들이 돌아다니고 생김새도 약간 달라보인다고 하지만

오사카에서는 주위에서 들려오는 일본어만 뺀다면 거의 서울에 있는 것처럼 느껴지기도 했죠.

여러모로 편안함을 주는 도시였던 것 같습니다.

 

그럼 사진이 나오는대로 여행기를 기대해 주세요~

진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

The Best Web 2.0 Software of 2005

2005년도 다 저물어 가는 마당에 연말 결산이 어디서나 한창이군요.

새로운 플랫폼으로서 Web 2.0이라는 개념이 각광을 받기 시작한 것도 2005년이지만,

2005년 각 분야에서 주목받은 Web 2.0 어플리케이션들을 결산하는 페이지입니다.

 

The Best Web 2.0 Software of 2005

 

관련글

블로거 지음 : 웹 2.0 - 다시 웹을 사고한다.

진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

눈이 왔다네-_-

 

12월의 시작부터

무지하게 눈이 오넹.

날씨도 춥고 하니

간만에 제대로된 겨울을 맞을 것 같은;;;

 


♪ Enya - Orinoco Flow ♪


진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

문서객체모델(Document Object Model)

웹 기술과 관련한 글을 읽다보면 돔(DOM)이라는 말을 많이 접하셨을 것입니다. 이미 저도 지난 번에 Ajax에 대해 쓴 글에서 DOM을 언급한 적이 있죠. 문서객체모델(Document Object Model), 약자로 DOM이라고 부르는 객체지향적인 모델은 웹 기술에서뿐만 아니라 구조화된 데이터를 다루는 곳이라면 어느 곳에서라도 사용되고 있습니다.

 

HTML 같은 문서들은 태그들의 계층적인 집합으로 이루어져 있습니다. 예를 들자면 다음과 같은 문서는 HTML로 이렇게 표현이 되죠.

 

[html]

[head]

    [title]고양이 그림[/title]

[/head]

[body]

    [IMG id="cat_pic" src="http://imagepath" border=0]

[/body]

[/html]

 

 

이 HTML을 DOM 문서로 변환한다면 다음과 같은 DOM 객체가 만들어지게 됩니다.

 

 

태그들은 파란색 박스 안에, 태그 안에 쓰인 속성들은 녹색 박스 안에 표시되고 있습니다. 여기서 파란 색 박스로 표시된 DOM의 기본적인 요소를 노드(Node)라고 하며, 각 노드에 딸린 녹색 박스들을 속성(Attribute)이라고 합니다. 각 노드는 다른 노드의 상/하위에 위치할 수 있으며 각 속성은 노드의 하위에 위치합니다.

 

이렇게 계층적인 형태를 지닌 데이터 구조를 트리(Tree)구조라 부르는데, 비단 DOM 뿐만 아니라 데이터베이스의 인덱스, 윈도의 폴더/디렉토리 등에서 트리구조를 사용합니다. 이러한 트리구조의 장점이라 하면 역시 임의의 하위 요소로 빠르게 접근이 가능하다는 것이겠죠.

 

문서를 DOM 객체로 변환하고 나면, 문서의 요소에 임의적으로 접근하여 내용을 수정하거나 새로운 내용을 추가하는 등의 작업이 수월해집니다. DOM 객체의 노드에 접근하기 위해 id를 많이 사용합니다. 여기서 id는 각 노드를 구별해주는 고유한 값인데, 만약 문서 안에 같은 값을 지닌 id를 지닌 노드가 두 개 이상 존재한다면 가장 첫번째 선언된 노드 이외의 노드들은 id로 접근할 수 없게 되죠.

 

그럼 위의 HTML 문서에서 고양이 그림을 나타내주는 [img] 노드에 접근해 봅시다. 다음은 자바스크립트를 사용하여 [img] 노드에 접근하는 코드입니다.

 

[script language="javascript"]

[!--

  var obj = document.getElementById("cat_pic");

  var result = obj.src;

//--]

[/script]

 

"cat_pic"라는 id를 지닌 노드를 찾아온다음, 그 노드의 src값을 얻어왔습니다. 문서의 [img] 태그의 id가 "cat_pic"였으므로, DOM에서 [IMG] 노드를 가져오게 되고, [IMG] 노드는 src 속성의 값으로 "http://imagepath"를 지니고 있으므로, 최종적으로 result에는 "http://imagepath"라는 값이 들어가게 됩니다.

 

이런 식으로 id를 사용하면 문서의 요소에 임의적으로 접근하여 내용을 가져올 수도 있고 변경할 수도 있습니다. 위의 예에서는 자바스크립트를 사용했지만, DOM은 기본적으로 플랫폼이나 프로그램 언어의 제한없이 사용할 수 있기 때문에, 어떤 프로그램에서든지 DOM을 이용하여 동적으로 문서의 내용을 읽고 변경할 수 있죠. 지금은 동적인 페이지를 만들기 위해서 DOM은 거의 모든 페이지에서 필수적으로 사용되는 것 중 하나라고 할 수 있습니다.

 

다만 DOM에서도 웹 개발에서 가장 까다로운 점 중 하나인 브라우저 사이의 호환성 문제가 존재합니다. 이러한 문제를 정리하기 위해 웹표준기구인 W3C에서 DOM 표준을 제작하였으며 역시 표준화된 프로그래밍 인터페이스(API)를 제공하고 있지만, 비표준 역시 널리 사용되고 있는 것들이 많기 때문에 까다로운 지점들이 존재합니다. 따라서 DOM을 적극적으로 사용할 때에는 다양한 브라우저 환경에서의 테스팅이 필수적이죠. 비표준 확장으로 인한 불편함은 정말이지 여러 방면에 걸쳐있는 것 같습니다^_^;;;

진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

바람부는 밤

 

 

휭휭 소리를 내며

바람이 많이 분다.

벌써 겨울의 시작인가 보넹.

 


♪ Radiohead - Thinking about you ♪

진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

야경 #2

아름다운 조명


 

가까이서 보면 디게 지저분하다;;;

 


♪ Elliott Smith - Twilight ♪

진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

대세는 막을 수 없다 : RSS와 XML

네트워커 원고로 작성한 포스트입니다.

과거 RSS 관련 포스트들의 짜집기라고 할 수 있죠;;;

 

 

한국에 블로그가 처음 들어왔을 때만 해도 RSS는 매우 생소한 개념이었습니다. 블로그의 메뉴 가장 하단에 생기는 "XML" 마크를 보며 이게 어디에 쓰이는 건지 의아해 하기도 했었구요. 하지만 현재 RSS는 웹에서 가장 각광받는 컨텐츠 배포 방식이 되었습니다. 개인 미디어로서 블로그의 확산과 더불어 RSS도 범용적으로 사용되게 되었고, 지금은 RSS 피드만을 전문적으로 관리해 주는 서비스도 많이 생기게 되었습니다.

 

RSS는 Rich Site Summary, 혹은 RDF Site Summary, 혹은 Really Simple Syndication의 약자입니다. 이 약자가 무엇이든 간에 여하튼 RSS는 어떤 웹 컨텐츠의 요약본을 제공하는 방식을 말합니다. 어떤 사이트의 컨텐츠를 보기 위해서 일반적으로 웹브라우저를 열고 특정 URL을 주소창에 입력하여 그 사이트가 브라우저에 뜬 후 내용을 읽곤 합니다. 하지만 RSS를 이용하면 이런 식으로 돌아다니면서 정보를 찾는 것이 아니라 정보를 자신에게 가져와 모아서 볼 수 있게 됩니다.

 

RSS가 널리 사용되는 이유 중 가장 큰 것은 컨텐츠 수용자에게 있어 매우 편리한 컨텐츠 수집 방법이기 때문입니다. RSS를 통해 거의 실시간으로 새로운 컨텐츠의 업데이트를 알려주고, 컨텐츠가 아무리 많다 하더라도 이를 범주화시키고 원하는 방식으로 정렬해서 보여줄 수 있습니다. 만약 특정 블로그나 사이트의 컨텐츠에만 관심있는 사람이라면 일일히 브라우저에서 URL을 치고 들어가는 것보다 한 번에 모든 컨텐츠를 모아서 볼 수 있는 RSS 리더를 선호할 것이라는 점은 분명하죠.

 

동시에 컨텐츠 제공자에게 있어서도 RSS는 보다 다양한 방식으로 컨텐츠를 제공할 수 있는 수단이 됩니다. 자신이 제공하는 컨텐츠를 재편집해서 새로운 컨텐츠의 집합을 만들 수도 있고, 다른 RSS 제공자와 연합하여 또 다른 의미의 컨텐츠 집합을 만들 수 있습니다. 즉, 저작권 문제만 조율한다면 여러 곳에서 생산하는 컨텐츠들을 재가공할 수가 있게 되는데, 이는 RSS XML이라는 표준적인 컨텐츠 배포 형식이 존재하기 때문에 가능한 것이죠.

 

RSS에서 사이트의 정보를 나타내기 위해 XML을 사용합니다. XML(eXtensible Markup Language)은 간단하게 말하면 데이터 교환을 위한 표준으로, 특히 계층형 데이터를 쉽게 표현할 수 있다는 장점이 있습니다. 예를 들면 다음은 블로그의 카테고리 정보를 XML로 표현한 것입니다.

 

 

XML은 HTML과 마찬가지로 태그 기반의 마크업 언어(markup language)이기 때문에, 태그를 정의하기에 따라 다른 용도로 사용할 수 있습니다. 프로그램의 기본적인 설정을 기록해둔 설정 파일로도 사용할 수 있고, 요즘 추세에 따르면 심지어 XML로 프로그래밍을 하기도 합니다. 그러나 가장 많이 사용되는 것은 데이터 교환의 용도로 쓰이는 것인데, 대표적인 예를 들면 웹에서 기사를 출판하는 언론의 경우, 기사를 XML 형식에 맞춰 보내면 자동으로 HTML 페이지를 만들어주기도 합니다. 표준에 맞게 XML만 만들면 다른 언론사의 기사라도 쉽게 받아 쓸 수 있게 되는 셈이죠.

 

물론 RSS에도 별도의 XML 표준이 있습니다. 현재는 많은 곳에서 RSS 2.0을 기준으로 XML을 생성하고 있는데, RSS 2.0은 RSS 1.0과 달리 웹표준기구인 W3C의 표준에 호환가능하다는 장점이 있습니다. 이렇게 RSS 서비스를 위해 생성되는 XML 파일을 RSS 피드(feed), 또는 웹피드(webfeed), RSS 스트림(RSS stream), RSS 채널(RSS channel)등 다양한 이름으로 부르는데, 이 중 피드라는 말을 가장 많이 사용합니다. 만약 특정 사이트의 RSS를 구독하고 싶다고 한다면, RSS 피드의 주소를 반드시 알아야 되는 것이죠.

 

XML은 기계는 물론 사람도 읽을 수 있는 형태이기 때문에, RSS XML만 있어도 어느 정도 사이트의 정보를 알아낼 수 있기는 합니다. 하지만 이를 보다 알아보기 쉽고 깔끔하게 표현하기 위해 RSS XML을 읽어들이는 여러 프로그램들이 존재합니다. 이를 RSS 리더, 또는 RSS 수집기(aggregator)라고 하는데, 자신의 컴퓨터에 깔아서 쓰는 형태의 프로그램들도 무수히 많으며, 모질라 파이어폭스(Mozilla Firefox)의 라이브북마크(Live Bookmark)나 익스플로러(Internet Explorer) 7.0 버전처럼 브라우저에서 아예 RSS 리더를 지원하는 경우도 있습니다.

 

RSS는 컨텐츠 배포와 수집 방식으로 이미 큰 흐름이 되어가고 있습니다. 물론 현재 RSS 구독자들이 가지고 있는 피드들의 대부분 블로그이기는 하지만, 반드시 블로그가 아니더라도 인터넷 언론 같이 RSS 서비스를 하고 있는 곳도 많으며 게시판 같이 컨텐츠가 쌓이는 곳이라면 어디서나 RSS를 지원하려 하고 있습니다. 어쩌면 이러한 추세가 사용자의 귀차니즘을 잘 이해한 결과일런지도 모르지만, 동시에 생산한 컨텐츠를 보다 쉽게 배포할 수 있고 컨텐츠들의 재편집을 통해 새로운 컨텐츠를 만들어낼 수도 있다는 점에 있어서, 단순한 배포 기술 이상의 의미를 지닐 수도 있을 것 같다는 생각입니다.

진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

PIFF 2005

9일-10일 이틀동안 부산에 다녀왔다. 이틀동안 힘들게 예매한 네 편의 영화를 봤는데, 하나같이 맘에 들어서 다행이삼^_^

 

어느덧 10회째가 되는 메이저 영화제이지만 실제로 가보기는 이번이 처음이다. 내가 선호하는 소규모의 아담한 영화제와는 달리 사람많고 혼잡하고 매우 요란했지만, 그만큼 좋은 영화들이 많이 상영되었고 볼거리도 많았던 시간이었다.

 

이미 인터넷 예매를 통해 표를 구하려했을 땐 너무 늦은 시간이었다. 상당수의 인기작들이 다 매진되어버려서 대략 난감했었다. 하지만 취소된 표를 근근히 구하여 볼 영화들을 대략 리스트업 하는데 성공했다. 감독, 영화 내용, 시간 등의 까다로운-_- 조건들을 통과한 작품들은...두둥 ( -_-);;; 개막작이었던 허우샤오시엔의 <쓰리 타임즈>, 영국영화특별전에 출품된 피터 그리너웨이의 <털시 루퍼 스토리>, 볼 타이밍을 놓쳐 안타까워했었던 박찬욱의 <친절한 금자씨>, 그리고 같이 갔던 친구가 좋아하는 프랑수아 오종의 <5X2> 등이다.

 

허우샤오시엔의 전작들을 보진 못했으나 대사가 적고 정적인 대신 감정 묘사에 뛰어나단 얘기를 들었다. <쓰리 타임즈> 역시 그 범주를 벗어나지 않았고, 기대를 실망시키지 않은 수작이었다. 대만의 1910년대, 1960년대, 2000년대의 세 시대에 걸친 사랑 이야기를 장첸과 서기를 통해 보여준다. 대만의 역사를 잘 몰라서 시대적인 맥락까지는 이해하지 못했지만, 각 시대의 대만의 모습이 잘 묘사되어 있고 그 시대를 살아가는 남녀의 모습 역시 훌륭하게 보여준다. 허우샤오시엔 감독은 인터뷰에서도 밝혔지만 시대에 따른 사랑의 방식을 <쓰리 타임즈>를 통해 말하려했던 것 같다.

 

<쓰리 타임즈>, 2000년대의 사랑 이야기 중 한 장면.

 

피터 그리너웨이의 작품은 <영국식 정원 살인사건>을 본 게 전부다. 미술전공자답게 미적인 화면을 보여주지만, 너무나 (정말 너무나) 색다른 방식의 스토리 텔링 방식과 편집은 난감하기 그지없었다. 부산에서 만난 <털시 루퍼 스토리>도 기대에 어긋나지 않게 미적으로 훌륭한 화면과 비논리적인 스토리 전개, 그리고 관객들을 우롱하는 결말-_-까지 정말 그리너웨이다운 영화였다. <털시 루퍼 스토리>는 원래 3부작으로 나왔는데 이번에 한 편으로 편집해서 선보였다고 한다. 그나마 이번 편집본이 이해하지 쉽다고는 하는데...

 

<털시 루퍼 스토리>, 92개의 가방 중 68번째 가방이다=_=

 

(<친절한 금자씨>는 DVD 발매가 되면 한 번 더 보고 쓰는 게 나을 것 같고...)

 

프랑수아 오종은 내게 낯선 감독이다. 프랑스의 유망한 감독으로 주가를 높이고 있다고 하는데, 그의 필모그래피를 하나도 모르는 나로서는 일단 접해 보고서야 이 사람의 진가를 알게 되었다. <5X2>는 올해 노벨 문학상을 거머쥔 헤럴드 핀터의 연극 <배신>에서 모티브를 얻은 작품이다.(우연히도 얼마 전에 핀터페스티벌에서 <배신>을 봤다는;;;) 한 남녀가 이별에 이르는 과정을 시간의 거슬러 올라가며 보여준다. 사실 이 한 작품으로 프랑수아 오종이 대단하다는 사실을 느끼진 못하겠지만, 몇 개 안되는 컷과 90분이라는 짧은 런타임을 통해 전체적인 이야기를 펼쳐가는 재능이 뛰어난 것 같았다. 이번 PIFF의 소득 중 하나였던 것 같음^_^

 

<5X2>, 무슨 장면이었더라...-_-

 

전반적으로 정말 즐거웠던 이틀이었다. 다만 1박 2일의 짧은 기간 동안 4편의 영화를 보느라 부산을 즐길 여유가 거의 없었다는 것이 아쉬웠던 점이삼=_=

진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

광명음악밸리축제

 정말 간만에 일하러 사무실에 나갔다가

우연히 참세상 기자 자리에 있던 광명음악밸리축제 팜플렛을 봤다.

 

쌈지 사운드 페스티벌을 못 가게 되어서 맘상해있다가

팜플렛에 소개된 뮤지션들을 보고 눈이 번쩍했는데

조동익, 이병우, 장필순, 이상은, 델리, 허클베리핀, 스웨터 등도 있고

연영석, 노찾사, 꽃다지, 안치환 등의 민중가요 세션도 있다.

(게다가 공짜+_+다)

 

하필 부산영화제 기간과 겹쳐서 갈 수 있을런지 모르겠지만

금요일 공연 정도라도 볼 수 있음 좋을텐데.

 

다만 주최가 광명시-_-;;;라는 점과(시장 인사말이 홈페이지에 올라와 있다;;;)

공연장소가 시민운동장-_-;;;이라는 점이

일말의 불안감을 안겨준다고나 할까.ㅎㅎㅎ

진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크

AJAX : 또다른 인터페이스는 가능하다

저는 개인적으로 국내의 검색 포털을 잘 사용하지 않습니다. 정보를 가장한 광고들도 물론 짜증나지만, 무엇보다 검색 결과의 질이 별로이기 때문이죠. 하지만 블로그나 커뮤니티의 정보를 찾기 위해 어쩔 수 없이 검색 포털을 이용할 때가 있습니다. 그런데 언젠가 (벌써 꽤 오래 전의 이야기가 되어 버렸지만) N모 사의 검색 서비스를 사용하다가 깜짝 놀란 적이 있었습니다. 검색어 입력창에 검색어를 입력하는 도중에 추천 검색어가 아래에 있는 박스에 뜨는 것이 아니겠어요. 보통 어플리케이션에서 이런 기능은 별 것 아닐 수 있겠지만, 일반적인 웹어플리케이션에서는 이런 기능을 수행하기가 거의 불가능에 가깝기 때문이죠.

 

전통적인 웹 처리 방식은 웹서버와 브라우저 사이의 동기적인 통신에 의해 구성됩니다. 이전에 XSS를 설명할 때 잠깐 언급한 바가 있지만, 페이지를 하나를 띄우려면 브라우저에서 웹서버로 페이지에 대한 요청을 보내고 웹서버는 이를 처리하여 페이지를 응답합니다. 이 응답결과를 브라우저는 받아 화면에 표시해 주는 것이죠. 중요한 것은 이런 과정이 동기적으로 이루어진다는 것인데, 이는 브라우저가 웹서버가 응답을 보내줄 때까지 기다려야한다는 의미입니다. 잘못된 주소에 요청을 보내면 브라우저에 곧바로 에러가 뜨지 않고 일정 시간을 기다린 후 404 Not Found 에러가 뜨는 것도 이러한 동기적 통신에 의해 처리가 이루어지기 때문이죠.

 

이러한 특성 때문에 웹어플리케이션에서 어떤 기능을 수행하려면 언제나 페이지 전체를 로딩해야 합니다. 아무리 간단한 정보라도 웹서버에 일단 요청을 보내면 전체 HTML을 다 받아야만 응답이 마무리되게 되어 있으므로 웹서버는 전체 HTML을 전부 브라우저에 보내주어야 하는 것이죠. 하지만 N사의 추천검색어 박스나 구글의 서제스트(Suggest : http://www.google.com/webhp?complete=1&hl=en) 서비스는 페이지를 로딩시키지 않습니다. 전통적인 웹어플리케이션에서 페이지 로딩없이 이런 기능을 가능하게 하려면 모든 추천검색어를 지닌 사전 데이터를 사용자 PC에 미리 깔아놓고 이를 참조하는 것밖에 방법이 없습니다. 그러나 Ajax를 통해 페이지를 보다 동적으로 만들어주는 이러한 기능들이 가능하다는 사실을 나중에야 알게 되었죠.

 

Ajax는 Asynchronous JavaScript and XML의 약자로 제시 제임스 가렛(Jesse James Garrett)이라는 사람이 처음 제안한 웹 처리 방식입니다. 정확하게 말하자면 Ajax는 어떤 특정한 기술을 가리키는 말이 아니라 자바스크립트와 XML을 사용하여 웹서버와 통신하는 처리 방식(또는 플랫폼)을 의미하죠. 전통적인 웹 처리 방식이 HTML을 결과로 받는다면, Ajax에서는 XMLHttpRequest 객체를 사용하여 XML로 결과를 받습니다. 브라우저에서는 결과로 받은 XML을 적당히 가공해서 HTML로 보여주는 것이죠. 여기서 중요한 단어는 Asynchronous, 즉 비동기입니다. Ajax를 통해 브라우저가 웹서버에 요청을 보내면 응답이 올 때까지 기다릴 필요가 없습니다. 대신 XMLHttpRequest 객체의 상태 체크를 통해 웹서버로부터 응답이 왔을 때를 알 수 있고, 이 때 이에 맞는 처리를 해 주면 되는 것이죠. 이런 방식으로 페이지 전체를 로딩할 필요없이 HTML의 일부분만을 변경할 수 있습니다. 이를 위해 Ajax에서는 DOM(Document Object Model)을 사용하는데, 이에 대해서는 나중에 설명하도록 하겠습니다.

 

앞에서 언급한 N사의 추천검색어를 Ajax로 구현한다고 생각해봅시다. "부산국제영화제"를 검색하는 경우, 일단 "부산"이라고 치는 순간 XMLHttpRequest를 통해 "부산"이라는 키워드를 웹서버에 전송합니다. 웹서버는 "부산"에 해당하는 추천검색어를 XML로 브라우저에 돌려주고, 브라우저는 이를 받아 자바스크립트를 통해 박스를 만들고 추천검색어를 이 박스에 써 줍니다. 이런 과정을 통해 페이지 전체를 다시 로딩하는 수고를 하지 않고도 동적인 페이지를 구성할 수 있게 되는 것이죠.

 

현재 XMLHttpRequest를 사용하여 서비스를 구현하는 곳은 매우 많습니다. 페이지를 다시 로딩하지 않았는데도 뭔가 복잡한 동작들을 수행하는 곳 중 상당수는 Ajax를 쓰고 있다고 생각하셔도 좋습니다. 이런 Ajax를 효과적으로 사용하고 있는 곳 중 하나는 바로 구글입니다. 아까 잠깐 언급했던 서제스트(Suggest)도 그렇지만, 지도 서비스를 하는 구글맵(http://maps.google.com/)은 Ajax를 매우 잘 사용한 모범적인 예라고 할 수 있습니다. 구글맵을 접속해보면 아시겠지만, '뭐를 설치하시겠습니까?'라는 질문을 받지 않습니다. 구글맵은 Active-X나 자바 애플릿 등을 사용하지 않고, 오로지 자바스크립트만으로 구성되어 있습니다. 당연히 처음 지도를 로드할 때에는 화면에 보이는 영역의 이미지를 웹서버로부터 불러오지만, 지도를 드래그해서 전후좌우로 움직일 때 페이지 전체를 로딩하지 않고도 새로운 이미지를 받아오는 것을 확인할 수 있습니다. 이런 방식으로 모든 지도의 이미지를 PC에 다운받는 수고를 할 필요없이 실시간으로 웹서버를 통해 지도의 이미지를 가져올 수 있죠.

 

Ajax를 사용하여 할 수 있는 일은 무궁무진합니다. 비단 Ajax 뿐만 아니라 매크로미디어(Macromedia)의 Flex나 차세대 윈도인 롱혼(Longhorn)에서 지원할 XAML, 모질라 기반 브라우저에서 지원하는 XUL 등 대안적인 방식들의 등장으로 인해 어쩌면 웹어플리케이션의 모습은 일반 PC에서 사용하는 오피스 같은 어플리케이션과 비슷하게 될 수도 있을 것 같습니다. 이 가운데 Ajax는 웹표준기구인 W3C의 표준안을 기반으로 하고 있으며 XMLHttpRequest 역시 표준으로 지원할 예정이라는 점에 있어 장점을 지니고 있죠. Ajax를 지원하는 웹브라우저 역시 늘고 있기 때문에, 앞으로 Ajax를 사용하는 웹어플리케이션을 쉽게 접할 수 있으리라 생각합니다.

 

다만 웹어플리케이션의 모습이 화려해지고 풍부해진다고 무조건 좋은 현상이라고 할 수만은 없습니다. 매크로미디어 플래시가 멋진 외관과 다양한 기능을 제공하는 반면 장애인들의 접근성을 떨어뜨리고 많이 사용하지 않는 브라우저를 쓰는 유저들을 배제시키는 것처럼 말이죠. Ajax를 통한 기획/개발을 하는 사람은 언제나 이러한 소수자에 대한 고려를 잊지 말아야 할 것입니다.



진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크