자바스크립트와 웹 프론트엔드


클라이언트 측 자바스크립트

자바스크립트는 웹브라우저에서 HTML 문서와 CSS를 동적으로 제어하기 위해 탄생한 언어입니다. 우리가 어떠한 웹사이트에 접속하게 되면 JavaScript는 정적인 콘텐츠로 HTML 및 CSS와 함께 서버에서 클라이언트(사용자 웹브라우저)로 보내지며, 사용자의 브라우저에 임시저장된 상태로 웹페이지의 동작을 제어하게 됩니다.

즉 개발자가 작성한 자바스크립트 코드는 코드 그 자체로 사용자의 컴퓨터로 전달되며, 사용자의 컴퓨터에서 자바스크립트 코드가 컴파일되어 실행되게 됩니다.

이를 가능하게 하기 위해서 웹 브라우저에는 자바스크립트 실행을 위한 자바스크립트 엔진이 내장되어 있습니다. 다시말해, 웹 브라우저를 사용하는 모든 사용자는 자바스크립트를 실행 시킬 수 있는 프로그램을 가지고 있다는 것입니다. 개발자 입장에서도 웹브라우저를 사용하는 것 만으로 자바스크립트 개발을 위한 환경은 준비되어 있다고 볼 수 있습니다. 이렇게 웹브라우저를 기반으로 동작하는 자바스크립트를 클라이언트 사이드 자바스크립트라고 합니다.

현대의 자바스크립트

과거의 자바스크립트는 처리속도가 느리다는 이유로 인해 웹페이지에서의 단순한 UI 조작등에 한정적으로 사용되었습니다. 그러나 최근에는 클라이언트 컴퓨터의 성능 향상과 더불어 JIT(Just-In-Time) Compiler의 등장으로 자바스크립트의 성능 개선이 이루어 졌습니다.

실제로 이를 바탕으로 네이티브 애플리케이션에 버금가는 기능과 성능을 가진 웹 애플리케이션 서비스가 끊임없이 만들어지고 있습니다.

이러한 웹 애플리케이션을 개발하기 위해서는 JavaScript 문법과 더불어 웹브라우저와 문서의 조작을 위한 객체와 API에 대한 이해가 필요합니다.

여기서는 이러한 것들에 대해 학습함으로써 인터렉티브한 웹페이지 제작에 대해 이해할 수 있으며, 현대적인 웹애플리케이션 개발을 위한 토대를 마련할 수 있습니다.

준비할 것들

이 과정을 이해하기 위해서는 기본적인 JavaScript의 문법에 대해 알고 있어야 합니다. 여기서는 기본적인 자바스크립트의 문법적인 부분은 다루지 않으며 자바스크립트의 기본 문법은 아래 페이지를 참조하여 학습할 수 있습니다.

웹개발을 위한 JavaScript 기본문법

또한, HTML과 CSS에 대해 알고 있어야 합니다. JavaScript는 HTML과 CSS를 조작해 다양한 형태의 UI를 제공하게 되므로 HTML과 CSS 대한 기본적인 이해는 필수입니다.

크롬 브라우저 혹은 파이어폭스 브라우저를 사용하면 좋습니다. 이러한 웹브라우저는 웹 개발을 위한 편리한 개발자 도구를 제공하며, 자바스크립트 개발을 쉽게 할 수 있도록 도와줍니다. 물론 다른 웹브라우저에도 비슷한 도구들이 있지만 편의성과 사용자층을 고려했을 때 위 두개의 브라우저를 사용하는 것이 편리합니다. 만약 하나를 선택한다면 더많은 확장 프로그램을 제공하는 크롬을 선택하겠습니다.