#2. About JavaScript
자바스크립트, 누구냐 넌?
자바스크립트는 동적인 웹페이지를 만들기 위해 사용되는 프로그래밍 언어입니다. 여기서 얘기하는 동적인 웹페이지란 움직임이 들어가는 웹페이지를 의미합니다. 백문이 불여일견, 자바스크립트는 다음 예시 사이트처럼 다양한 기능을 만들 때 사용됩니다.
http://keepearthquakesweird.com/
이렇듯 자바스크립트는 정적인 웹페이지에 동적인 생명력을 불어넣기 위해 사용되는 프로그래밍 언어입니다. 최근에는 웹 뿐만 아니라 모바일 앱, 서버, IoT 등 다양한 분야에 사용이 가능한 인기있는 프로그래밍 언어로 각광받고 있습니다.
자바와 자바스크립트를 같은 언어로 이해하고 있는 사람이 있는데, 이름만 비슷할 뿐 자바와 자바스크립트는 직접적인 연관성은 없다.
프로그래밍에서 Syntax (구문) 란?
개발 공부를 하다보면 Syntax 라는 얘기를 많이 듣게 됩니다. Syntax 는 컴퓨터에서 사용되는 기본 문법을 의미합니다. 외국어로 비유하자면 영어, 프랑스어, 중국어 등 국가별로 고유의 단어나 문장을 갖고 있는데, 이는 프로그래밍 언어 또한 마찬가지입니다.
예를 들어 대부분의 프로그래밍 언어에서는 어떤 데이터를 저장하기 위해서 변수라는 것을 선언하는데 자바스크립트에서 변수를 선언하기 위해서는 var 라는 키워드를 꼭 입력해야 합니다. 하지만 다른 개발 언어인 파이썬에서는 var 를 생략하고 변수를 선언합니다.
자바스크립트 변수 선언 : var 변수명
파이썬 변수 선언 : 변수명
즉, 어떤 프로그래밍 언어를 공부한다는 것은 그 언어의 문장 구조나 표현 방식을 배우는 것과 같다고 할 수 있습니다.
변수에 대한 설명은 다음 시간에 자세하게 살펴보도록 하겠습니다.
자바스크립트 공부를 위한 환경 세팅
에디터 설치
Atom, Sublime Text, WebStorm, Visual Studio 등 프로그래밍을 위한 개발 도구는 굉장히 많다. 필자의 경우 처음에는 Sublime Text 를 사용하다가 지인의 추천으로 WebStorm 으로 옮겼습니다. 개발자 선호에 따라 사용하는 에디터가 다르기 때문에 각각의 특징을 잘 살펴본 후에 본인에게 적합한 에디터를 사용하면 됩니다.
구글 크롬 설치
자바스크립트 개발을 위해 여러 개발 툴을 사용할 수 있지만 브라우저에서 확인을 해야 하는 경우도 발생합니다. 크롬은 브라우저에서 본인이 작성한 코딩에 대한 결과를 직접 확인할 수 있으며, 크롬 개발자 도구에서 간단한 코드도 만들어 볼 수 있습니다.
설치를 완료했으면 브라우저를 실행한 후 오른쪽 버튼을 누르면 검사 탭을 클릭, 그러면 무슨 말인지 이해할 수 없는 외계어( HTML, CSS )들이 등장하기 시작합니다. 상단 탭에 Console 을 클릭을 하면 무언가 입력할 수 있는 창이 나타나는데 거기에서 자바스크립트 코드를 입력할 수 있습니다.
여러분들이 지금 보고 있는 장면을 개발자 도구라고 합니다. 개발자 도구에서 다음과 같이 입력해 보세요
prompt("당신의 이름은 무엇입니까?”)
그러면 무엇가 입력하라는 메시지 창이 등장하고 내용을 입력한 후 확인을 누르면, 여러분이 입력한 내용이 개발자 도구에 출력됩니다.
prompt 는 브라우저 상에서 어떠한 정보를 입력할 때 사용되는 메서드입니다.
이제 자바스크립트 공부를 위한 개발 환경 세팅이 모든 끝났습니다. 다음 시간에는 데이터를 저장할 수 있는 변수에 대해서 살펴보도록 하겠습니다.
