본문 바로가기
Front-End/JavaScript

자바스크립트의 실행 방법과 실습 환경

by SoyeonCha 2022. 3. 27.

Javascript 파일 만들기

Windows 메모장에 코드 작성 → 저장 누름 → '파일 이름' 끝에 .html 붙임 → 파일 형식은 '텍스트 문서'가 아닌 '모든 파일'로 선택 → '인코딩'은 'UTF-8' 선택 → 저장

 

파일 실행

브라우저에서 'ctrl'+'O' 누름 → 열려는 파일 선택 → 실행됨

 

파일 만들지 않고 브라우저에 내장된 콘솔을 이용하여 Javascript를 실행하기

크롬 개발자 도구 이용

'F12' 눌러서(또는 맨오른쪽위에 '설정' 누르고 '도구 더보기'에서 '개발자 도구' 눌러서) 크롬 개발자 도구 엶 → 콘솔 창 엶 → 콘솔 창에 html 코드를 작성할 필요 없이 javascript 코드를 작성 → 코드 작성 후 'Enter' 누름 → 실행됨

(긴 코드는 파일 작성이 편리할 것)

콘솔 창에서 작성했던 코드 다시 작성하고 싶으면 커서 뜨게 하고 ↑방향키 누르면 됨

메모장에서 script 범위 안에 console.log('Hello world')를 작성하고 저장한 파일을 크롬에서 실행하면 알림창이 뜨는 게 아니라 크롬 개발자 도구 콘솔 창에 Hello world가 출력됨

 

Sublime Text(코드 작성 Editor)를 이용하는 방법도 있음

'Front-End > JavaScript' 카테고리의 다른 글

Learn JavaScript_Arrays  (0) 2022.07.20
Learn JavaScript_Conditionals  (0) 2022.07.14
Learn JavaScript_Introduction  (0) 2022.07.14
자바스크립트의 시작-웹과 Javascript  (0) 2022.03.27