JavaScript개요

자바스크립트(JavaScript)

• 웹 브라우저에서 많이 사용되는 프로그래밍 언어
• 자바(Java)와 이름은 비슷하지만 완전히 다른 프로그래밍 언어

자바스크립트의 활용

• 2010년까지만 해도 자바스크립트는 웹 클라이언트 개발 이외의 용도로 사용할 수 없었음.
• 2010년부터 서버, 게임, 스마트폰 애플리케이션, 데스크탑 애플리케이션 개발 등에 활용.

웹 클라이언트 애플리케이션 개발

• 초기 웹은 변화하지 않는 정적인 글자로만 구성
  • 하이퍼링크라는 매개체로 웹 문서가 연결된 문서들의 집합
  • 자바스크립트가 나오고부터 웹 문서의 내용을 동적으로 바꾸거나 사용자가 사용자가 마우스를 클릭하는 것과 같은 이벤트를 처리 가능
  • 따라서 일반적인 웹 문서의 개념을 넘어 애플리케이션의 모습에 가까워짐 → 이를 “웹 애플리케이션”라고 부름.
  • 별도의 프로그램 설치 없이 웹 브라우저만으로 워드, 엑셀, 파워포인트와 같은 애플리케이션을 사용(마이크로소프트 오피스 온라이)

웹 서버 애플리케이션 개발

• 기존 웹 서비스 개발 형태
  • 웹 클라이언트 애플리케이션을 자바스크립로 개발
  • 웹 서버 애플리케이션을 C#, 자바, 루비, 파이썬 등의 프로그래밍 언어로 구현
• JavaScript의 확장으로 볼 수 있는 Node.js가 등장하면서 웹 서버 애플리케이션도 개발
  • 자바스크립트(JavaScript)로 클라이언트와 서버 애플리케이션 개발 가능
  • 예. Linkedin은 자바스크립트를 이용해 웹 서버 애플리케이션을 만들었음

자바스크립트의 활용

• 모바일 애플리케이션 개발
  • 자바스크립트는 안드로이드 폰과 아이폰에서 구동
    • 1개의 애플리케이션으로 두 운영체제에서 실행 가능
• 데스크탑 애플리케이션 개발
  • 모바일 애플리케이션을 자바스크립트로 만드는 일이 일반화 되자 다음과 같은 의견도 나왔음. “데스크탑 애플리케이션도 자바스크립트로 만들자!“
• 게임 개발
• 데이터 베이스 관리

개발 환경

• Visual Studio Code
• Chrome
• VS Code에서 HTML 파일을 브라우저에서 열기
  • 익스텐션 설치
    • 단계 1. Extentions에서 open in brower를 검색
    • 단계 2. Install 버튼 클릭
• 설치 후 재 시작
  • 실행 단축키 : Alt + b
• 오류 확인 방법
  • 콘솔
    • 인위적으로 코드에 에러
      • alert(‘Hello World!’)
    • 에러 확인 방법 1
      • PROBLEM 탭에서 확인
    • 에러 확인 방법 2
      • 크롬 브라우저에서 F12키
      • Console(콘솔)에서 확인 » 에러가 난 파일과 행 번호 확인