[JS] 01. 자바스크립트 입문: 정의부터 환경 설정까지

1. 자바스크립트(JavaScript)란 무엇인가?

웹 개발을 이야기할 때 빼놓을 수 없는 세 가지 요소가 있다. 바로 HTML, CSS, JavaScript이다.

• HTML (Structure): 웹 페이지의 뼈대. 내용과 배치를 정하는 마크업 언어이다. (디자인 수정은 어렵다.)
• CSS (Style): 뼈대 위에 입히는 옷. 요소들의 스타일과 디자인을 담당한다.
• JavaScript (Behavior): 집 안의 가전제품 같은 역할. 웹 내부에서 발생하는 다양한 기능과 동작을 만든다.

과거에는 브라우저 안에서만 작동했지만, 이제는 Node.js 덕분에 서버, 모바일 앱, 데스크톱 앱, 심지어 IoT 기기까지 그 영역이 확장되었습니다. 문법이 유연해 배우기 쉽지만, 비동기 처리나 프로토타입 같은 심오한 개념을 담고 있어 깊이 파고들수록 매우 강력한 언어이다.

 

 

현재 자바스크립트의 활용 범위:

1. 웹 서버: Node.js 기반의 백엔드 구축
2. 데스크톱 어플리케이션: Electron (Discord, Slack 등)
3. 모바일 어플리케이션: React Native (iOS, Android 동시 개발)

---

2. 개발을 위한 환경 설정

공부를 시작하기 전, 최적의 도구들을 먼저 세팅해보자

1. VS Code 설치: 현시점 가장 대중적이고 강력한 에디터인 Visual Studio Code를 설치한다.
2. Node.js 설치: 브라우저 밖(내 컴퓨터 터미널 등)에서도 JS를 실행할 수 있게 해주는 런타임이다. 안정적인 LTS(Long Term Support) 버전을 강력히 추천한다.
3. 추천 확장 프로그램 (Extensions):
   • Prettier: 코드를 예쁘게 자동 정렬해 준다.
   • Live Server: HTML/JS 수정한 내용을 브라우저에서 실시간으로 확인할 수 있게 해준다.

---

3. 자바스크립트의 주요 특징

① 인터프리터 언어 (Interpreter Language)

코드를 미리 컴파일(번역)하지 않고, 실행 직전에 한 줄씩 읽어서 실행한다. 덕분에 수정 사항을 즉시 확인할 수 있어 개발 생산성이 매우 높다.

② 모든 곳에 존재 (Everywhere)

• Frontend: React, Vue, Angular 등
• Backend: Node.js 환경의 서버 개발
• Mobile: React Native
• Desktop: Electron

③ 싱글 스레드와 비동기 (Single Thread & Async)

자바스크립트는 기본적으로 한 번에 하나의 일만 처리하는 싱글 스레드 방식이다. 하지만 이벤트 루프(Event Loop)라는 영리한 메커니즘 덕분에, 데이터를 불러오는 중에도 화면이 멈추지 않는 비동기 처리가 가능하다.