[역자 서문]
"Life is short, you need Python"
이 책을 읽는 독자 여러분은 대개 프로그래밍이 처음인 분이겠죠? 정말 축하합니다. 파이썬처럼 쉽고 직관적이면서도 다양한 분야에 사용되는 언어는 많지 않습니다. 다른 언어로 프로그래밍을 시작했다면 어려운 문법과 추상적인 개념에 머리를 싸매다가 포기하거나, 할 수 있는 일이 그리 많지 않아서 또 다른 언어를 배워야 하는 단계가 금방 왔을 겁니다.
파이썬은 그렇지 않습니다. 파이썬은 매우 쉽고 직관적이어서, 중학생 수준의 영어만 알아도 딱 보면 무슨 뜻인지 짐작이 되는 코드 구조가 아주 많습니다.
if 4 in [1,2,3,4]: print("4가 있습니다.")
만약에(if) [1,2,3,4] 안에(in) 4가 있으면 "4가 있습니다."를 출력(print)하세요.
무슨 뜻인지 금방 알 수 있지 않습니까? 이렇게 쉽고, 사람의 생각과 비슷한 문법을 쓰기 때문에 파이썬으로 프로그래밍을 하면 하고 싶은 일을 금방 프로그램으로 만들 수 있습니다. 그 외에도 파이썬에는 매력적인 특징이 정말 많지만, 서문에서는 이 정도만 적겠습니다.
프로그래밍에 관한 책은 대개 개발자가 집필하는 데 반해 이 책을 쓴 에릭 마테스는 과학과 수학을 가르치는 고등학교 교사입니다. 직업이 교사여서 그런지 이해하기 쉽고 체계적으로 잘 썼습니다. 우리나라도 2018년부터 고등학교 정보 교과 과정에 파이썬이 포함된다고 하니 시기적으로 이 책의 출간이 꼭 맞는 듯합니다. 첫 언어로 파이썬을 택하신 것, 그리고 이 책을 택하신 것 모두 축하합니다. 그리고 감사합니다.
좋은 책을 맡겨준 한빛미디어, 이해하기 쉽게 원고를 수정하고 뜻하지 않은 도움을 주신 조경숙 편집자님, 어색한 곳을 꼼꼼하게 지적해주신 박상은 감수자님께 감사합니다. 초보자의 입장에서 베타리더로 도와주신 황준식 님께 감사합니다. 영문 원고 정리를 도와준 황광선 님에게 감사합니다. 모든 일에 대해, 부모님께 감사합니다.
구슬이 서 말이라도 꿰어야 보배다.
_ 우리 속담
거짓말에는 그냥 거짓말, 지독한 거짓말, 통계 세 가지가 있다.
_ 마크 트웨인
바야흐로 데이터의 시대입니다. 다양한 데이터를 수집해서 분석해 정확한 판단을 내려야 살아남을 수 있습니다. 요즘 우리나라에서는 불행히도 개인정보 관련한 사건이 끊이지 않고 있는데 데이터를 이렇게 저급하게 사용하기 위해 수집하는 곳도 있지만, 시장의 동향을 파악한 다음 정책을 수립한다거나 더 많은 사용자에게 맞춤 서비스를 제공할 수 있도록 개선하기 위해서도 다양한 데이터를 수집하고 이를 정확히 분석하는 능력이 꼭 필요합니다.
우리 속담에도 "구슬이 서 말이라도 꿰어야 보배다"라는 말이 있지만, 데이터가 그냥 데이터베이스에 들어있기만 해서는 별 의미가 없습니다. 그 속에서 '이야기'를 읽어내야 하며, 데이터베이스를 모르는 사람도 이해하기 쉽게 '시각화'해야 다양한 사람의 의견을 들을 수 있습니다.
하지만 이런 시각화 과정은 양날의 칼이라 할 수 있습니다. 제대로 한다면 아주 큰 힘을 주는 도구이지만, 자칫 시각화에 참여한 사람의 실수 또는 어떤 의도에 따라 편향될 수 있습니다. 숫자의 힘은 아주 강하고, 일단 숫자를 사실이라고 믿으면 그 숫자가 쓰인 그래프나 차트가 암시하는 결론까지 자연스레 믿어버리는 경향이 있기 때문입니다. 마크 트웨인도 "거짓말에는 그냥 거짓말, 지독한 거짓말, 통계 세 가지가 있다"라는 말을 통해 숫자의 위험함을 경고한 바 있습니다.
그렇다면 제대로 시각화하기 위해서는 어떻게 할까요? 여기에는 정답이 없습니다. 데이터를 수집한 목적과 수집한 방법, 수집된 양, 그 데이터를 어디에 쓸 것인지에 따라 헤아릴 수 없이 다양하게 나뉘기 때문입니다.
하지만 어떤 데이터를 다루든 꼭 생각해야 할 기본적인 의문과 함정, 판단 근거 등은 존재하므로 이를 숙지한다면 숫자의 함정에 빠지는 일을 피하고 데이터가 전하는 이야기를 정확히 판단해 올바르게 시각화하는 데 큰 도움을 받을 수 있습니다.
이 책은 그런 의문과 함정에 관한 책입니다. "이렇게 하라"고 결론을 내리는 책은 아니지만, 다양한 사례를 분석하고 현장에서 일하는 수많은 전문가와 인터뷰를 통해 데이터 수집과 분석, 시각화에 관해 생각할 점들을 흥미롭고 독특한 방법으로 설명합니다.
전문 용어의 등장은 피할 수 없지만, 딱딱하지 않고 위트 있게 설명된 책이므로 꼭 이 분야에서 일하는 분이 아니더라도 "빅데이터, 빅데이터 말은 들어봤는데", "요새 이런저런 그림으로 설명된 게 많이 보이는데 무슨 뜻인지 잘 모르겠다"하는 의문을 가졌던 분이라면 재미있게 읽을 수 있는 책이라고 생각합니다.
사람의 일은 모두 관계 속에서 이루어지는 것이라 감사의 인사를 드리자면 끝도 없겠으나, 이 책을 읽고 계신 독자분께 가장 먼저 감사합니다.
좋은 책을 맡겨주신 한빛미디어, 늘 뜻하지 않은 도움을 주고 좋은 문장으로 다듬어주는 편집자님께 감사합니다.
항상 그렇지만, 모든 것에 대해 부모님께 감사합니다.
옮긴이가 2008년에 웹 개발을 처음 시작하면서 접했던 책이 『Head First HTML with CSS & XHTML: 웹 2.0 시대의 웹 표준 학습법』(2006, 한빛미디어)이었습니다. 친절한 선배가 바로 옆에 붙어 앉아서 하나하나 알려주는 듯한 구성과, 정말 독특하다고 밖에는 표현하기 힘든 편집 덕에 HTML의 H도 모르던 제가 흥미를 잃지 않고 끝까지 독파할 수 있었고 웹 개발에 많은 흥미를 갖게 되었습니다. 이런 면에서 보자면 이 책이야말로 옮긴이의 오늘에 가장 큰 영향을 미친 책이 아니었나 하는 생각을 합니다.
HTML과 CSS에 대해서 어느 정도 알게 된 후에는 자바스크립트에 관심이 생겼고 당연히 다른 책은 찾아볼 생각도 안하고 『Head First JavaScript: 대화형 웹 애플리케이션의 시작』(2008, 한빛미디어)를 주문해서 공부했습니다. 이 책 역시 매우 재미있게 공부했습니다. J자도 모르는 초보자도 쉽게 익힐 수 있도록 구성되었으면서도 다루는 내용은 놀랄 정도로 풍부하고 깊이 있던 것으로 기억합니다.
두 권 모두 너무 좋았고, 이제 시리즈의 팬이 된 저는 이후로도 관심 있는 분야가 생길 때마다 무조건 책이 있는지부터 확인하는 게 당연한 수순이 되었습니다. 『Head First Ajax: 자꾸 가고 싶은 웹 사이트의 비밀』(2009, 한빛미디어), 『Head First SQL: 효율적인 DB 관리를 위한 SQL 학습법』(2008, 한빛미디어), 『Head First Servlets & JSP(개정판): 상상력을 자극하는 몰입의 학습법』(2009, 한빛미디어) - 불행히도 자바를 활용할 상황이 생기지 않아 마지막 책은 부끄럽게도 먼지만 쌓이고 있긴 하지만 그건 제 사정이니까요. 4년 여의 시간이 흐르고 이제 이 시리즈에 한 권을 더하게 되자 나름 감회가 새롭습니다.
HTML5가 등장하면서 웹은 대격변을 맞이했습니다. 캔버스나 지오로케이션, 소켓, 로컬스토리지, 시맨틱 웹 등 숱한 수식어와 화제를 몰고 다니는 HTML5이지만, 이 새로운 언어를 능숙하게 사용하기 위해서는 자바스크립트에 대한 이해가 필수입니다. 이전 버전의 (X)HTML & CSS의 세상에서 자바스크립트는 알면 좋은 정도에 불과했고, 사실 알아도 할 수 있는 일에 명백한 한계가 존재했지만 HTML5에서는 이야기가 달라졌습니다. 자바스크립트를 알지 못하면 할 수 있는 일에 큰 제한이 생기고, 일단 자바스크립트를 익히면 할 수 있는 일이 너무나 많아져서 정신을 차릴 수 없을 정도입니다. 선택이 아니라 필수라고 말해도 지나치지 않습니다.
자바스크립트가 아무리 쉽다고는 해도 역시 프로그래밍 언어라 처음에는 좀 어렵습니다. 여러분도 잘 아시겠지만 jQuery는 초보자가 자바스크립트의 깊은 부분을 공부하지 않고서도 필요한 일을 빨리 끝낼 수 있다는 점에서 많은 사랑을 받았습니다. 하지만 jQuery 만으로 할 수 있는 일에는 역시 한계가 있어, 어느 단계에 이르러서는 분명 자바스크립트를 익혀야 합니다. 특히, HTML5의 등장으로 jQuery가 HTML5의 새로운 기능을 아직 지원하지 못하고 있는 현 단계에서는 더욱 그렇습니다.
이 책은 jQuery의 기본을 알기 쉽고 충실히 설명하면서도 자바스크립트와 PHP, SQL의 기초적인 내용까지 다루었습니다. 물론 시리즈의 장점인 이해하고 기억하기 쉬운 구성을 택하여, 초보자가 어렵게 느낄 수 있는 부분도 따라하다 보면 어느새 익숙해질 수 있게끔 배려했습니다. 이 한 권으로 모든 것을 끝낼 수는 없겠지만 뭐부터 시작해야 하는지 망설이는 독자들, 열의를 가지고 책을 들었으나 어려운 설명에 좌절한 경험이 있는 독자들이라면 이 책을 통해 부담 없이 시작할 수 있으리라고 생각합니다.
사람의 일은 뭐든 관계 속에서 이루어지는 것이라 일일히 감사의 글을 쓰자면 끝도 없겠으나, 누구보다도 먼저 이 책을 보고 계신 여러분께 감사합니다. 누가 알아주지 않아도 항상 노력하는 사람이 있어 세상은 발전할 수 있다고 생각합니다. 좋은 책을 맡겨주신 한빛미디어, 계속 늦어지는 원고에도 닦달하지 않고 생각 못했던 도움을 주신 조희진 편집자님께 감사 드립니다. 늘 그렇지만, 모든 것에 대해 부모님께 감사합니다.
1996년 자바스크립트가 넷스케이프 내비게이터와 함께 처음 소개되었을 때 성능은 그다지 중요하지 않았습니다. 인터넷은 초기 단계였고 항상 느렸습니다. 성능이 좋지 않은 가정용 컴퓨터에서 다이얼 업 네트워킹으로 접속하던 그 당시의 웹 서핑은 인내심을 기르는 훈련 같을 때가 많았습니다. 사용자는 웹 페이지가 로드될 때까지 기다리는 것을 당연하게 생각했고 페이지가 잘 로드되면 기꺼이 축배라도 들 기분이었습니다.
자바스크립트의 원래 목적은 웹 페이지에서 폼 입력 오류 등으로 인한 사용자의 시간 낭비를 줄이는 것이었습니다. 폼에 입력된 값이 유효한지 검사하는 등의 간단한 작업을 위해 서버까지 갔다가 돌아오는 대신 이러한 기능을 자바스크립트가 페이지에서 직접 수행했습니다. 이렇게 해서 서버까지 왕복하는 시간을 줄일 수 있었습니다. 입력할 내용이 많은 폼을 다 작성하고, 서버로 전송하고, 1분 가까이 기다렸더니 필드 하나를 잘못 입력했다는 응답을 받은 기분을 상상해 보세요. 자바스크립트는 이러한 부분에서 초기 인터넷 사용자의 시간을 많이 줄여준 공로를 인정받아야 합니다.
인터넷은 진화했습니다
십 년 동안 컴퓨터와 인터넷은 진화를 거듭했고, 둘 다 무척 빨라졌습니다. 프로세서의 성능은 급격하게 좋아졌고 메모리 가격은 낮아졌으며 광섬유 연결이 등장해 인터넷은 새로운 시대로 진입했습니다. 그때까지는 볼 수 없었던 빠른 연결이 일반화되어 웹 페이지에 더 많은 정보와 멀티미디어 파일을 담으면서 무거워졌습니다. 문서만 링크하던 밋밋한 웹 페이지에 다양한 디자인과 인터페이스를 담게 되었습니다. 모든 것이 변했지만 자바스크립트만 예전 그대로입니다.
서버까지의 왕복을 줄이는 용도로 쓰이던 자바스크립트가 어디에든 쓰이게 되었습니다. 예전에는 수십 줄이면 충분했던 코드가 이제는 수백 줄을 넘어서 수천 줄이 되었습니다. 페이지를 다시 불러오지 않아도 페이지의 모양을 바꿀 수 있는 DHTML과 인터넷 익스플로러 4의 등장으로 자바스크립트의 비대화는 예견된 것이었습니다. 브라우저 발전에서 가장 중요한 단계는 인터넷 익스플로러 5, 넷스케이프 내비게이터 6, 오페라에서 제각기 구현한 DHTML에 대한 통일안인 DOM(Document Object Model: 문서 객체 모델)의 등장입니다. DOM이 도입된 직후 ECMA-262 3판에서 자바스크립트의 표준화가 이루어졌습니다. 모든 브라우저가 DOM을 지원하고 같은 버전의 자바스크립트를 지원하면서 웹 애플리케이션 플랫폼이 탄생했습니다. ECMA-262에서 표준화되고 DOM 같은 공통 API가 도입되면서 자바스크립트가 많이 발전했는데도 정작 그 코드를 실행할 자바스크립트 엔진은 거의 변하지 않았습니다.
왜 최적화가 필요한가
수십 줄의 코드를 실행하면서 웹 페이지를 보조하던 1996년이나, 수천 줄의 코드를 실행하는 요즘이나 자바스크립트 엔진은 같습니다. 브라우저가 자바스크립트를 잘 관리하고 기반 작업에 신경썼다면 자바스크립트는 크게 성공할 수 있었을 겁니다. 브라우저가 자바스크립트에 별로 신경쓰지 않았다는 것은, 발표 당시에는 안전성과 속도를 널리 인정받았던 인터넷 익스플로러 6이 얼마 안 있어 느린 속도와 버그로 웹 애플리케이션 플랫폼으로는 최악이라는 악명을 떨치게 된 것만 봐도 알 수 있습니다.
사실 인터넷 익스플로러 6이 느려진 것이 아니라 해야 할 일이 늘어났을 뿐입니다. 2001년 인터넷 익스플로러 6이 발표되던 당시의 웹 애플리케이션은 2005년에 개발된 것에 비해 아주 단순하고 가벼웠으며 코드도 무척 짧았습니다. 코드의 양이 늘어나면서 브라우저는 자바스크립트를 잘 관리하지 않은 부작용이 눈에 띄게 드러나게 되었는데, 그 단적인 예가 인터넷 익스플로러 6의 가비지 컬렉션 루틴입니다. 인터넷 익스플로러 6의 자바스크립트 엔진은 메모리에 있는 객체가 일정 숫자까지 증가했는지 살펴서 가비지 컬렉션 시기를 결정합니다. 초기 웹 애플리케이션 개발자는 인터넷 익스플로러 6에서 정해 놓은 한계선을 넘기는 일이 드물었지만 자바스크립트 코드가 길어지면서 메모리에 남는 객체의 숫자도 늘어났고 복잡한 웹 애플리케이션은 이 한계선을 자주 넘깁니다. 문제가 무엇인지 분명해졌습니다. 자바스크립트 개발자와 웹 애플리케이션은 진화했지만 자바스크립트 엔진은 그렇지 않기 때문입니다.
다른 브라우저에서 더 논리적인 메모리 반환 루틴을 도입하고 실행 성능을 좀 더 끌어올리기는 했지만 대다수는 여전히 자바스크립트 인터프리터로 코드를 실행합니다. 코드 인터프리터는 자바스크립트 코드를 실제로 컴퓨터가 실행하는 코드로 바꿔야 하기 때문에 근본적으로 컴파일러보다 느립니다. 인터프리터를 아무리 잘 설계하고 최적화하더라도, 항상 더 느릴 수밖에 없습니다.
컴파일러는 개발자가 효율성을 걱정할 필요 없이 원하는 대로 코드를 작성할 수 있도록 온갖 종류의 최적화를 합니다. 또한 개발자가 작성한 코드를 그 언어의 문법대로 분석해서 하는 일을 알아낸 다음 컴퓨터가 실행할 수 있는 가장 빠른 저수준 언어로 바꿔줍니다. 인터프리터는 컴파일러가 하는 최적화를 거의 하지 못하므로 코드가 작성된 그대로 실행될 때가 많습니다. 결과적으로 다른 언어에서는 컴파일러가 하는 최적화 작업을 자바스크립트에서는 개발자가 직접 할 수밖에 없습니다.
차세대 자바스크립트 엔진
2008년 자바스크립트 엔진은 첫 번째로 성능이 향상되었는데, 구글에서 완전히 새로운 브라우저, 크롬을 발표했습니다. 크롬은 코드 최적화 기능이 있는 자바스크립트 엔진을 탑재한 최초의 브라우저입니다. 코드네임 V8이라 불리는 이 엔진은 자바스크립트 코드를 기계어로 바꿔서 실행하는(JIT) 자바스크립트 컴파일 엔진입니다. 이 엔진은 자바스크립트 실행 성능을 크게 향상시켰습니다.
다른 브라우저도 곧 독자적인 자바스크립트 최적화 엔진을 도입했습니다. 사파리 4는 적시 변환 자바스크립트 엔진 Squirrel Fish Extreme(Nitro라고도 합니다)을 선보였고 파이어폭스 3.5는 자주 실행하는 코드를 최적화하는 TraceMonkey 엔진을 도입했습니다. 새로운 자바스크립트 엔진은 당연히 최적화를 담당해야 할 곳인 컴파일러에서 최적화합니다. 언젠가는 개발자가 코드를 짜면서 성능 최적화에 신경쓰지 않아도 되는 날이 올 겁니다. 하지만 아직은 아닙니다. 아직은 성능에 신경 써야 합니다
자바스크립트 코어의 실행 시간이 많이 단축되기는 했지만 자바스크립트에는 새로운 엔진과 무관한 문제점이 있습니다. 페이지의 외관에 영향을 미치는 작업과 네트워크 지연율 때문에 생기는 지연 시간은 브라우저에서 더 개선해야 합니다. 인라인 함수, 코드 축소, 문자열 병합 알고리즘 같은 간단한 최적화는 컴파일러에서 쉽게 처리할 수 있지만, 웹 애플리케이션의 동적이고 다면적인 구조는 엔진 최적화로 쉽게 해결할 수 없는 문제이기 때문에 최적화는 성능 문제의 일부분만 해결할 수 있습니다.
새로운 자바스크립트 엔진이 등장해 훨씬 빠른 인터넷을 사용하는 미래를 상상할 수 있지만, 지금 성능을 연구하는 것도 미래에 여전히 쓸모 있고 중요할 것이라고 예견할 수 있습니다. 이 책에서는 실행 시간, 내려받기, DOM과의 상호작용, 페이지의 라이프 사이클 등 자바스크립트의 다양한 부분에 관한 테크닉과 접근 방법을 살펴봅니다. 자바스크립트 엔진이 발전하면 코어(ECMAScript) 성능에 관한 일부는 필요 없어지겠지만, 아직은 아닙니다.
다른 주제는 DOM과의 상호작용, 네트워크 지연 시간, 자바스크립트 내려받기의 두 가지 양상(차단과 병행) 등 자바스크립트 엔진이 빨라지더라도 별 도움이 되지 않는 문제에 관한 것입니다. 저수준 자바스크립트 실행 성능이 계속 향상되더라도 이러한 주제는 여전히 중요하고, 앞으로도 더 많은 관심과 연구의 대상이 될 것입니다.
(/ 저자 서문 중에서)
"우리 머리에 주먹질을 해 대는 책이 아니라면, 우리가 왜 그런 책을 읽어야 한단 말인가"
- 프란츠 카프카
자바스크립트는 현재 웹에서 사용되는 언어 중 가장 중요한 언어라고 할 수 있습니다. 처음에는 자바스크립트를 써서 페이지를 좀 더 역동적으로 보이게 하고, 작성할 양식이 많은 폼에 잘못된 형식의 값을 써서 서버에 보냈다가 처음부터 다시 작성하는 일이 없도록 방지하는 정도였습니다. 하지만 이제 자바스크립트는 상상할 수 있는 거의 모든 일을 해내고, 상상하지 못했던 일도 척척 해내고 있습니다.
자바가 처음 개발되었을 때 가장 많은 주목을 받은 특징은 이식성입니다. "이 프로그램은 자바로 만들었으므로 유닉스, 윈도우, 맥 모두에서 동작합니다"라는 문구가 자바의 이식성을 말해줍니다. 하지만 자바스크립트는 이식성이라는 말 조차 필요 없습니다. "그냥 됩니다"
자바스크립트가 번창하게 된 이유는 몇 가지 있지만, 대표적인 이유를 두 개만 든다면 저는 이렇게 말하겠습니다.
1. "그냥 됩니다" - 운영체제? 장치? 브라우저? 상관없이 다 돌아갑니다.
2. "쉽습니다" - 컴파일이 필요 없고 쓴 순서대로 동작하는 스크립트 언어입니다.
하지만 이 대표적인 장점은 또한 대표적인 약점이기도 합니다. 모든 브라우저에서 동작한다는 말은, 바꿔 말해 모든 브라우저를 다 신경써야 한다는 말이기도 합니다. 컴파일이 필요 없다는 말은, 바꿔 말해 컴파일할 수 없으니 성능 문제에서 자유로울 수 없다는 말이기도 합니다.
웹이 점점 우리 생활에서 널리 쓰이고 있습니다. 충분한 성능의 데스크톱 컴퓨터에서 동작하던 자바스크립트는 최근 한두 해 사이에 비교적 성능이 떨어지는 모바일 장치에서 동작하게 되었습니다. 모바일 장치의 성능이 점점 더 좋아지지 않느냐구요? 자바스크립트가 느리게 느껴진다면 하드웨어 성능이 느려서가 아니라, 코드를 미숙하게 짰기 때문일 겁니다. 즉, 지금 느리게 실행되는 코드는 모바일 장치의 성능이 좋아지더라도 여전히 느리게 실행될 가능성이 높습니다. 이 책은 처음부터 끝까지 자바스크립트 성능에 초점을 맞추고 있습니다. 자바스크립트가 어떻게 동작하는지, 웹과 브라우저 환경의 특이점에는 어떤 것이 있는지 살펴보면서 가장 효율적으로 코드를 쓰는 방법을 알려줍니다. 성능 평가를 통해 어떤 부분이 느린지 명확하게 찾아내서 한정된 개발 시간에 최대의 효과를 내는 방법도 다룹니다.
저는 자바스크립트를 공부하면서 많은 책을 접했습니다. 다행히 그 책 모두 좋았지만, 그 중에서 최고를 꼽으라면 단 1초도 생각하지 않고 [더글라스 크락포드의 자바스크립트 핵심 가이드](한빛미디어, 2008)를 꼽겠습니다. 10번을 넘게 읽었는데도 읽을 때마다 새롭습니다. 번역을 마무리하면서 "이제 두 번째로 좋은 책을 꼽으라 해도 전혀 망설이지 않겠구나"라는 생각이 듭니다.
먼저 이 책을 선택하신 여러분께 감사 드립니다. 늘 노력하는 여러분 덕에 세상이 발전할 수 있습니다. 당장 이해하기 어려운 점이 있더라도 꾸준히 노력한다면 분명 그 열매를 얻을 것입니다.
좋은 책을 맡겨주신 한빛미디어, 숱한 오류와 어색한 번역을 교정해 준 한동훈 편집자께도 감사 드립니다. 1년 가까운 기간 동안 코어 자바스크립트 스터디를 함께 한 김태선, 연병화 씨에게도 감사합니다. 혼자였다면 끝까지 공부하지 못했을 겁니다.
HTML5가 등장하면서 웹은 대격변을 맞이했습니다. HTML5는 다루는 범위가 너무 방대하여 어디부터 시작해야 할지 망설여질 정도이지만, 다행히 그 모든 기술을 모두 알아야 HTML5를 활용할 수 있는 것은 아닙니다. 손 닿는 곳부터 시작해서 어제 마크업한 내용을 오늘 '조금 더 HTML5처럼' 만들면서 공부하면 됩니다. 천 리 길도 한걸음부터 걸어가는 것이니까요.
당장은 캔버스 같은 눈에 띄는 새 기능부터 배우고 싶을 수도 있으나 HTML5는 결국 마크업 언어이므로 올바르게 마크업하는 일이 무엇보다도 중요합니다. 올바른 마크업이란 자바스크립트나 CSS 같은 외부 기술에 기대지 않고, 콘텐츠가 어떻게 구성되었는지를 마크업 구조만으로 표현하는 것입니다. 이 위에 자바스크립트와 CSS, HTML5에 추가된 새로운 API로 기능과 디자인을 추가해야 합니다.
이 책은 바로 그런 구성을 택해서 HTML5의 새로운 구조적 마크업부터 시작해 눈에 띄는 새 기능까지, 다양한 예를 통해 지루하지 않게 설명하고 있습니다. 순서대로 읽어나가도 좋지만, 1장을 읽고 이해해야만 2장을 이해할 수 있는 것은 아닙니다. 또한 각 레시피는 독립적으로 구성되었으므로 평소 궁금했던 부분이나 당장 실무에 필요한 부분부터 골라서 읽으셔도 됩니다.
사람의 일은 뭐든 관계 속에서 이루어지는 것이라 일일이 감사의 글을 쓰자면 끝도 없겠으나, 누구보다도 먼저 이 책을 보고 계신 여러분께 감사합니다. 누가 알아주지 않아도 항상 노력하는 사람이 있어 세상은 발전할 수 있다고 생각합니다. 좋은 책을 맡겨주신 한빛미디어 출판사, 수많은 오탈자와 어색한 표현을 수정해 주신 '빨간펜 선생님' 조희진, 박민아 편집자님께 감사합니다. 두 분의 노력에도 불구하고 이상한 점이 있다면 그건 물론 제 잘못입니다. 늘 그렇지만, 모든 것에 대해 부모님께 감사합니다.
“jQuery” + “Mobile”
설명이 필요 없는 두 단어가 만났습니다. 번역 의뢰를 받을 때부터 무척 재미있을 것 같아 기대했는데, 예상이 틀리지 않았습니다. 책을 번역하는 내내 “오?”, “우와~” 이런 감탄사를 입에 달고 살았습니다.
“웹의 힘은 그 보편성에 있다”
웹을 창시한 팀 버너스 리 경의 말입니다. 현재는 각 모바일 장치에 최적화된 네이티브 앱이 더 관심을 끌고 있지만, 지금 당장만 해도 아이폰과 안드로이드폰 두 가지용으로 개발해야 하고 멀지 않아 윈도우폰을 지원해야 합니다. 새로운 기기가 인기를 끌면 그 기기도 지원해야겠죠. 하지만 HTML로 만들면 거의 모든 장치에서 이용할 수 있습니다. 장치별로 서너 가지씩 소스코드를 관리하고 디버그하고 업그레이드할 필요가 없습니다. 게임 등 특정 분야에서는 여전히 앱이 필요하겠지만, 곧 판도가 바뀌어서 보편적인 분야는 HTML 페이지에 자리를 내 주게 될 겁니다. 물론 HTML로 만든다고 호환성 문제가 아예 사라져 버리는 건 아니지만, 다행히 인터넷 익스플로러 6를 지원할 필요는 없습니다. 현재 널리 쓰이는 장치는 대개 HTML5와 CSS3를 잘 지원합니다. 이 시장은 업그레이드 주기가 매우 빠르므로 호환성 문제는 데스크톱에 비해 빨리 해결될 겁니다. 게다가 크로스 브라우징 쪽에는 이미 정평이 난 강력한 우군, jQuery가 있으니까요.
jQuery Mobile은 모바일 페이지를 마치 앱처럼 만드는 jQuery 기반 프로그램입니다. 커스텀 데이터 속성(data- 속성)으로 페이지 요소의 역할을 명시하기만 하면 나머지는 jQuery Mobile이 알아서 처리합니다. jQuery의 슬로건인 "Write less, Do more"와 잘 어울리기도 하고, 미래의 브라우저가 나아갈 방향이 이런게 아닐까 하는 생각도 듭니다. 브라우저가 요소의 역할을 이해하면 복잡하게 스크립트를 짜고 눈이 빠져라 CSS를 들여다보면서 여러 브라우저를 맞출 필요도 없어지겠죠. 시맨틱하게 마크업하면, 나머지는 브라우저(또는 라이브러리)가 알아서 하고, 사용자는 자기 취향대로 서비스를 이용할 수 있는 세상을 기대합니다.
이 책은 jQuery Mobile을 가볍게 소개하는 입문서입니다. 짧고 간단하지만 jQuery Mobile을 다룬 책이 거의 없는 상황에서 jQuery Mobile이 어떤 라이브러리인지, 어떤 일을 할 수 있는지 쉽게 아실 수 있습니다. 설령 jQuery Mobile로 페이지를 개발할 생각이 없다 하더라도 가볍게 한 번 읽어보시기에 적당합니다.
누구보다도 이 책을 살펴보고 계신 당신에게 감사드립니다. 알아주는 사람 없어도 늘 노력하는 당신과 같은 사람 덕택에 세상이 발전할 수 있습니다. 당장 이해하기 어려운 점이 있더라도 꾸준히 노력하신다면 분명 그 열매를 얻을 것입니다. 좋은 책을 맡겨주신 한빛미디어, 독자의 편의를 고려해 많은 아이디어를 내고 수고하신 조희진 편집자님께도 감사드립니다. 웹 앱으로 만든 트위터 예제에 도움을 준 윤좌진 씨에게도 감사드립니다. Peter Paul Koch가 오페라 웹 표준 강좌에 기고한 를 번역한지 만 3년째입니다. 난삽한 번역이나마 사랑해주신 웹 프론트엔드 개발자분들과, 그런 글을 꾸준히 공개해준 클리어보스(http://www.clearboth.org)에도 감사합니다. 그동안 받았던 응원에 책으로 보답하게 되어 무척 기쁩니다. - 옮긴이 서문
