서문
당신의 뇌가 드디어 Ajax를 만났습니다.
자, 이제 여러분은 무언가를 배우기 시작했습니다. 그런데 여러분의 머리는 여러분에게 그 배움에 집착할 필요가 없다고 말합니다. 당신의 머리는 이렇게 생각하기 시작합니다. "더 중요한 문제를 봐야 해. 어떤 야생 동물이 위험한가, 혹은 발가벗고 스노보드를 타는 것이 나쁜 생각인가 등등." 자, 어떻게 하면 당신의 삶이 비동기 프로그래밍을 배우느냐 아니냐에 달려 있다고 당신의 머리를 속일 수 있을까요?
차세대 웹 애플리케이션
1장. Ajax 사용하기
웹 애플리케이션에 광을 내 봅시다.
투박한 웹 인터페이스, 그리고 매번 리로드하는 페이지에 질리셨나요? 그렇다면 이제 웹 애플리케이션에 솔잎 향기가 나는 데스크탑 애플리케이션과 같은 느낌을 줘봅시다. 무슨 소리냐구요? 바로 지금 웹을 강타하고 있는 신기술, Ajax(asynchronous JavaScript and XML) 얘깁니다. 여러분은 좀더 활발하고 기민하고 사용하기 쉬운 막강한 인터넷 애플리케이션을 만들 수 있는 기회를 잡았습니다.
Ajax 요청 만들기
2장. 말하기
이제 비동기로 말하기를 배울 때가 왔습니다.
여러분이 차세대 킬러 애플리케이션을 만들려고 생각하고 있다면 Ajax를 안팎으로 이해할 필요가 있습니다. 이번 장에서는 비동기 자바스크립트의 내부를 자세히 살펴볼 것입니다. 어떻게 다른 브라우저에서 요청을 보내는지를 배우고, 준비 상태와 상태 코드를 마스터할 것입니다. 그러면서 필요한 몇 가지 특별한 동적인 HTML도 배울 꺼구요. 다 배울 때쯤이면 거의 프로와 마찬가지로 요청을 만들고 응답을 처리할 수 있게 될 겁니다. 근데 여러분의 고객들은 여러분이 다 배울 때까지 기다리지 않을 거라고 말했었죠?
비동기 애플리케이션
3장. 비동기에 푹 빠졌어요
대기실요? 죄송합니다만 그런 건 없는데요.
웹은 병원 대기실이 아닙니다. 웹에서 철 지난 잡지를 읽으면서 기다리고 싶어하는 사람은 아무도 없습니다. 이제까지 Ajax를 통해서 페이지를 다시 읽는 것을 얼마나 줄일 수 있는지를 살펴보았다면, 이번엔 어떻게 하면 웹 페이지의 중요 부분이 사용자의 요청에 빠르게 대응하게 할 수 있는지를 알아볼 차례입니다. 이번 장에서 사용자의 요청을 서버로 보내는 방법과 또한 응답을 기다리는 동안 사용자가 다른 작업을 할 수 있게 하는 방법을 배울 것입니다. 사실 이 책도 마찬가지입니다. 기다릴 필요 없이 페이지를 넘기면 바로 시작합니다.
도큐먼트 객체 모델
4장. Web Page Forestry 웹 페이지 조경
구합니다: 업데이트하기 쉬운 웹 페이지를 구합니다.
이제 직접 웹 페이지를 바로바로 업데이트하는 코드를 만들어 봅시다. 도큐먼트 객체 모델을 쓰면 웹 페이지는 새 생명을 얻을 수 있습니다. 사용자의 동작에 바로 응답하고 필요 없는 페이지 리로드를 영원히 없애버릴 수 있습니다. 이 장이 끝날 때쯤 여러분은 웹 페이지의 어느 부분이든 그 내용을 추가하거나, 없애거나, 업데이트할 수 있습니다. 자, 페이지를 넘겨서 웹 마을 수목원으로 들어가 봅시다.
DOM 애플리케이션 개발하기
4.5장. 다시 들여다보기
DOM을 더 배우고 싶다구요?
마지막 장에 웹 페이지를 업데이트하기 위한 가장 멋진 방법, 도큐먼트 객체 모델에 대한 꽤 어려운 과정을 준비해 놨어요. 하지만 그걸로도 부족하게 느끼시겠죠. 그래서 이번 장에서는 방금 배운 내용을 활용할 수 있도록 DOM에 기반한 깔끔한 애플리케이션을 만들어 볼 것입니다. 그러면서 새 이벤트 핸들러도 배우고 어떻게 노드의 스타일을 바꾸는지, 사용자에게 친숙하고 역동적인 애플리케이션은 어떻게 만드는지 등을 살펴볼 겁니다. 이번 장은 여러분의 DOM 기술을 완전히 새로운 차원으로 업그레이드시켜 줄 것입니다.
POST 요청
5장. POST로 보다 풍부한 표현을...
기다리고 기다리던 바로 그 순간이 왔습니다.
여러분이 배우고 싶었던 바로 그것, 그걸 지금 살펴 볼 것입니다: 마침내 send(null)를 버릴 때가 왔습니다. 그리고 서버에 좀 더 많은 데이터를 보낼 수 있는 방법을 배워봅시다. 아주 약간의 작업만 더 하면 됩니다. 하지만 이번 장이 끝날 때쯤 여러분은 "데이터 없음" 대신에 더 많은 이야기를 서버에 해줄 수 있을 것입니다. 물론 비동기 요청을 통해서죠. 자, 우리는 지금 POST 나라에 들어왔습니다. 안전벨트를 꽉 매시고 컨텐트 타입의 세계로, 요청 헤더의 세계로 여행을 떠나봅시다.
XML 요청과 응답
6장. 말로 표현하는 것을 넘어서
아무도 당신 말을 안 듣는 것 같나요?
때때로 자연 언어로 의사소통하는 것이 더 힘든 경우가 있습니다. 지금까지 요청과 응답에서 텍스트를 사용해왔습니다만, 이제 일반 텍스트의 껍질을 깨고 나가 봅시다. 이번 장에서는 XML에 빠져볼 것입니다. 일반 텍스트만 쓸 때보다 서버가 훨씬 더 많은 이야기를 하도록 만들 수 있습니다. 그것뿐만이 아닙니다. 요청 자체도 XML로 할 수 있습니다. 비록 그것이 항상 좋은 방법은 아니지만요(자세한 것은 내용을 보세요). 준비되셨나요? 이번 장을 마치고 나면 요청과 응답은 지금까지와는 완전히 달라질 것입니다.
JSON 대 XML
7장. 진검 승부
초등학교 시절로 돌아가봅시다.
그 때 그 시절이 기억나시나요? 조금만 의견이 다르면 거친 말이 오가고 주먹이 날아다니고 또 어설픈 쿵후 흉내까지 하던 시절요. 교실 여기저기서 "싸워라~ 싸워라~"하는 말만큼 흥분되는 일이 없었던 때를 기억하시나요? 이번 장에서는 잠깐 그 때로 돌아가볼 겁니다. 그리고 친근한 단어들, 황금률 같은 건 잠깐 접어두겠습니다. XML과 JSON은 비동기 요청에서 데이터를 보내고 받는 두 가지 다른 포맷입니다. 이 두 포맷의 차이점을 링 위에 올려놓고 붙여 볼 것입니다. 점수판을 준비하시고 자, 공 울립니다!
부록 1: 기타 등등
a.1 특별 보너스
당신만을 위한 Head First Labs의 작별 선물입니다.
부록에는 다섯 가지 특별 보너스가 선물로 제공됩니다. 핵심을 잘 설명하고 더 많은 이야기를 해주고 싶었지만, 이제는 여러분이 배운 것을 직접 차갑고 냉혹한 현실 속의 웹 프로그래밍에 적용해 봐야 합니다. 우리는 당신이 아무 준비도 없이 출발하길 바라지 않습니다. 그래서 이 책에 다 압축해 넣을 수 없었던 다섯 가지를 부록에서 제공합니다.
부록 2: Ajax와 DOM 유틸리티
a.2 코드를 줘요
보너스가 하나 더 있어요.
이번 부록에는 이 책의 앞부분에서 그냥 건너 뛰었던 몇 가지 고급 유틸리티 코드가 있습니다. 하지만 이제는 이 Ajax와 DOM 유틸리티 함수를 이해할 수 있어야 할 것입니다.