Rethinking the Web Application

Ajax의 주요 컨셉을 소개할까한다.

1장에서는 Ajax와 그 사용의 이유를 보여줄 것이다.
2장은 기술적인 기본을 다루고 어떻게 함께 할 수 있는지 보여줄 것이다.
목표는 이책의 끝부분에서는 "hello world" 보다 큰 실세계의 프로젝트를 붙잡을 수 있도록 해줄 것이다.
3장에서는 큰 프로젝트를 관리하기 위해서 사용했던 소프트웨어 개발툴을 소개하고 어떻게 Ajax와 함께 사용할 수 있는 지 보여줄 것이다.

1. A new design for the web
이상적으로, UI(사용자 인터페이스)는 사용자에게 보이지 않아야 한다. 필요한 옵션을 제공하고 그들의 길밖에서 기다리며 손에 있는 문제에서 풀려날 수 있도록 하는 것이 필요하다. 불행하게도 그렇게 하기란 정말 어려운 문제이고, 우리는 곧 익숙해지며, 단념하고, 매일매일의 이유에 따라
차선의 UI를 사용해서 일을 한다.-누군가 우리에게 더 좋은 방법을 보여주고 우리가 현재의 방법이 얼마나 실망적인지를 알게 될때야 바꿀수 있게 된다

인터넷은 현재 이런 깨달음에도 현재 어쩔수 없는 상황이다. 기본적인 웹브라우저 기술이 문서의 내용을 보여주는 것이기 때문에 이 한계점은 계속해서 압박해오고 있다.

Ajax(Asynchronous Javascript + XML) 은 새로운 이름으로 Adaptive Paht의 Jesse James Garret이 만들어냈다. Ajax의 일부분은 이전에 Dynamic HTML이나 원격 스크립팅에 의해서 서술되었다.  Ajax는 더 기운찬 이름이며, 깨끗한 파우더의 이미지를 환기시켜준다.  네덜란드 축구 팀이면서도 그리스의 광기어린 고통받는 영웅이기도 하다.

그러나 이름만이 아니다. 기술적으로도 그리고 비즈니스적인 입장으로도 Ajax를 둘러싼 흥분은 가득하다.

기술적으로, Ajax는 웹브라우저 기술에서 깨닫지 못했던 많은 잠재력을 표현할 수 있도록 해준다.

구글과 다른 소수의 주요 업체들이 웹 어플리케이션으로 할 수 있는 것으로 일반 대중에게 기대를 모으고 있다.이전의 웹어플리케이션은, 우리가 처음부터 사용해오면서 삐걱거리기 시작해서 계속해서 웹기반의 서비스를 복잡해지고 있다. 많은 기술들이 풍성하고 똑똑하며, 클라이언트를 개선하려고 했다.

Ajax는 현대의 컴퓨터들 대다수에 사용된 기술만 가지고도 더 좋고 똑똑하며 풍성함을 제공할 수 있다. Ajax와 함께, 많은 오래된 기술의 모음을 이용해서 그들의 원래의 범위를 넓힐 수 있다.
우리가 소개했던 복잡성을 관리할 수 있는 필요가 있다. 이 책은 각각의 기술을 어떻게 사용할지를 논의하고, 큰 Ajax 프로젝트를 관리할 수 있는 큰 그림을 그려볼 수 있게 한다.

우리는 이작업을 할 수 있도록 Ajax 디자인 패턴을 소개하려 한다.

디자인 패턴은 우리가 하나의 기술에 대해서 얻은 지식과 경험을 획득할 수 있게 해주며 그것을 다른이들에게 전달할 수 있게 해준다.코드 베이스에 대한 규칙서을 소개함으로, 수정하기 쉬우며 요구사항의 변화에 따라 확장하기 쉬운 어플리케이션을 만드는 것을 손쉽게 한다. 디자인 패턴은 일할 때 기쁨을 주기 까지한다.

1.1 Why Ajax rich clients?

풍성한 클라이언트 인터페이스를 만드는것은 웹페이지를 하나 디자인 하는 것보다 한단계 더 복잡한 일이다. 이 여분의 일을 한다면 어떤 동기가 있을까? 이익은 어떻게 되나? 그런데, 풍성한 클라이언트는 무엇일까?

풍성한 클라이언트는 두개의 주요 특징적인 열쇠가 있다: 풍성하며, 클라이언트 이다.
조금더 설명해 보겠다. 여기서 풍성한이라는 것은 클라이언트 모델의 상호 작용이다.
풍성한 사용자 상호작용 모델은 입력 방법을 다양하게 해줄수 있고, 시간의 변화에 따라서 직각적으로 반응할 수 있다는 것이다.

우리는 사용자 상호 작용이 풍성하다는 말로, 야심없는 척도를 설정할 수 있다.
워드 편집기나 스프레드쉬트 같은, 데스크탑 어플리케이션의 현재 세대만큼이나 좋아야 한다.
그렇다면 그것이 무엇을 수반하는지 알아보자

1.1.1 Comparing the user experiences

(웹브라우저 말고) 어플리케이션 설정에 대한 당신의 선택을 보자. 또한 선택된 것이 제공하는 사용자 상호작용의 종류를 세어보자.

스프레드 쉬트를 잠깐 예로 들어서 논의하겠다. 그러나 여기서의 촛점은 일반적이기 때문에 텍스트 에디터로도 가능하다.

끝났는가? 나도 그렇다. 스프레드 쉬트에 간단한 방정식을 쓰는 동안, 여러가지의 방법으로 상호작용할 수 있다는 것을 알았다.데이터를 수정하거나, 키보드나 마우스를 이용해서 이동시키거나 드래그 앤 드랍으로 재 조직화 할 수 도 있었다.이것을 하는 동안 프로그램은 나에게 피드백을 줬다. 커서가 모양을 바꿨으며, 주저하는 동안 버튼이 깜빡거렸으며, 선택한 문자가 색깔을 바꾸고,강조된 창과 대화상자가 다르게 나타났다. 이것은 요즘의 풍성한 상호작용을 보여주는 것이다. 아직도 더 가야할길이 남아있지만, 이것은 시작일뿐이다.

그래서, 스프레드쉬트가 풍성한 클라이언트인가? 아니다라고 말하고 싶다.

스프레드 쉬트나 비슷한 데크스탑 어플리케이션에서, 논리와 데이터모델은 닫힌 환경에서 실행된다. 명백하게 나타나긴 하지만 다른 가능성을 닫아버렸다.

클라이언트에 대한 나의 정의는 다르고, 독립적인 프로세스와 대화하며 기본적으로 서버에서 운영되는 것이다. 전통적으로 서버는 크고 강하고 클라이언트보다 좋다. 또한 괴물같이 많은 양의 정보를 저장한다. 클라이언트는 사용자에게 이정보를 볼수있으며 수정할 수 있도록 해준다. 또한 많은 클라이언트가 같은 서버에 연결되며 데이터를 공유할 수 있게 해준다.

현대의 n-tier 구조에서, 물론 서버는 데이터 베이스와 같은 더 많은 후미의 서버와 통신하며, 미들웨어 레이어들이 클라이언트이며 서버이도록 할 수 있게 해준다. 우리의 Ajax 어플리케이션은 이 사슬의 마지막에 위치하며, 클라이언트 처럼만 행동한다. 그래서 우리는 모든 n-tier 시스템을 우리의 현재 논의의 목표대로 하나의 서버라 라벨링된 블랙박스처럼 다룰 수 있다.

나의 스프레드 쉬트는 그것만의 데이터를 갖고 있을 뿐이며, 지역적인 메모리와 파일시스템에만 저장된다. 구조적으로 잘 설계된다면, 데이터와 표현의 결합력은 훌륭하게 헐겁게 될 수 있다. 그러나 나는 이것을 네트워크를 통해서나 공유함으로 쪼갤 수 는 없다. 그러므로 우리의 현재의 목표처럼 이것은 클라이언트가 아니다.

웹브라우저는 물론 그들이 서버에 페이지를 요구해서 접촉하는 클라이언트다. 브라우저는 사용자의 웹브라우징을 관리하기 위해서 어떠한 면에서는 풍성한 기능을 갖고 있다. 뒤로가기 버튼이나, 목록, 그리고 몇개의 문서를 저장하기 위해서 탭을 사용함으로 그럴 수 있다.

그러나 만약 우리가 웹페이지를 하나의 어플리케이션처럼 부분적인 사이트라고 생각한다면, 이 일반적인 브라우저 제어는 이것은 윈도우의 시작 메뉴나 창 목록과 연결된 나의 스프레드 쉬트 처럼의 어플리케이션이 되지 못한다.

현대의 웹어플리케이션을 한번 보자. 모든 사람이 들었듯이, 우리는 아마존을 흠집낼것이다.
나는 아마존 사이트가 내 마지막 방문을 기억하고 있기 때문에, 내 브라우저가 아마존 사이트를 가리키게 할 것이다. 그것은 나에게 반가운 인사를 할것이며, 추천 도서목록을 보여주며 나의 장바구니 이력 정보를 보여줄 것이다.추천 목록에서 제목을 클릭함으로 내가 잠깐 전에 봤던 이전목록을 모두 잃고 다른 페이지로 넘어가게 할 것이다.

이것은 문맥정보가 가득차서 너무 쓸모없다. 리뷰, 이책의 다음 가격, 같은 작가로의 연결, 내가 최근에 치크아웃한 다른 책의 목록.

내가 정보와 상호작용할 수 있는 행위는 하이퍼 링크를 클릭하거나 텍스트폼을 채우는 것 뿐이다.
브라우징을 할 때 키보드에서 잠깐 졸아서 다음날 일어났을 때, 새로운 해리포터 책이 나왔는지에 대해서 알려면 전체 페이지를 새로고쳐야 한다.

나는 다른 페이지로 넘어갈 때 내 목록을 갖고 있지 못하며, 문서의 크기를 재조정해서 여러개의 내용을 한꺼번에 볼 수도 없다. 이것은 아마존만을 말하는 것이 아니다. 스프레드 쉬트에 비하면 질문을 퍼부을수도 없을 정도의 제한에 기대고 있다.
그럼 왜 이 한계가 현대의 웹 어플리케이션에 나타나는가? 현재의 상황에 대한 어쩔 수 없는 기술적인 이유가 있다.

이후에 기술적으로, ajax가 좋다 그리고 macromedia의 flash기술이나 java의 web start가

ajax에 대한 대안이라 말할 수 있다.. 등등의 내용이 나옵니다.

실제적으로 어떻게 쓰는지가 중요한데 당위성만 늘어놔서 역시 1장은 번역해봐야 헛수고네요

2장부터는 다른 내용이 나오겠죠

Ajax in Action에서 번역한 내용임다.

출처 : Tong - 드렁크수달스님의 ■ AJAX ■통