Search
K
Comment on page
📗

Editor

코드 에디터란, 텍스트 편집기라고 생각하시면 됩니다. 일반적으로 코드 에디터는 프로그래밍 언어들을 표현하고 읽기 쉽게 해주는 기능들이 많이 추가되어 있습니다. 예를 들면, 언어별 키워드 관련 기능, 들여쓰기 도움 기능, 내부 터미널 기능 등이 있습니다.
Visual Studio Code

Installation

기존에 사용하시는 에디터가 없다면 Visual Studio Code를 설치해주세요.

로컬 작업 환경이란?

지금까지 여러분은 codepen이라는 서비스를 사용해서 웹 상에서 자바스크립트 코드를 작성하고 실행시킬 수 있었는데요, 지금부터는 웹 환경이 아닌 로컬 작업 환경 에서 코드를 작성해보는 경험을 해 보려고 합니다. 로컬 작업 환경이란 여러분이 인터넷에 접속하지 않아도 관리할 수 있는, 오프라인 상의 컴퓨터 파일과 폴더 시스템을 의미합니다.

VSCode로 프로젝트 시작하기

터미널 명령어와 vscode를 사용해 프로젝트를 생성하고 코드를 작성할 준비를 해보겠습니다. 먼저, 터미널에서 vscode를 사용할 수 있도록 "code" 라는 명령어를 등록해야 합니다.
code 명령어 추가하기
code 명령어가 잘 등록되었다면 터미널에서 폴더를 만들고 그 폴더를 vscode로 열어보겠습니다.
code . 명령어는 “현재 경로를 vscode에서 열겠습니다” 라는 의미입니다. . 은 “현재 경로” 를 의미합니다.
code . 명령어로 프로젝트 열기
자, 로컬 작업환경에서 코드를 작성할 준비가 완료되었습니다!
코드를 작성하고 브라우저에서 확인해보겠습니다.
로컬 환경에서의 코드 작성
Visual Studio Code에는 확장 프로그램을 설치할 수 있습니다. 아래의 확장 프로그램들을 설치하여 사용하시기를 추천드립니다.

Web Editor

Web 상에서 간편하게 사용할 수 있는 에디터들도 존재합니다.