1. Codesandbox 접속하기
2. JavaScript 템플릿 사용하기
3. JS파일 실행(Code Runner)
1. Codesandbox 접속하기
로컬 환경에서는 JavaScript 환경을 설정하기 위해서는 Node.js 환경과 Npm을 설치해야 합니다. 하지만 Codesandbox은 설치가 필요 없이 클라우드 환경에서 개발 환경을 구축 할 수 있습니다.
Codesandbox으로 접속하면 회원가입 화면이 나옵니다.
회원가입은 GitHub 계정으로 연동이 가능합니다.
회원 가입 후 메인 화면이 나옵니다.
메인 화면이 나왔다면 원하는 템플릿을 사용해서 개발 환경을 구축 할 수 있습니다.
2. JavaScirpt 템플릿 사용하기
Codesandbox 회원가입 후 메인화면으로 접속을 하면 JavaScript 환경을 설정을 합니다.
JavaScript 환경 설정은 다음과 같습니다.
Create -> Vanilla 템플릿 선택하기
Vanilla(JavaScript) 템플릿을 선택하면 JavaScript환경을 자동으로 구성이 됩니다.
3. JavaScript 파일 실행하기
JavaScript 환경에는 package.json에 다음과 같은 설정이 되어 있습니다.
package.json
"scripts": {
"start": "parcel index.html",
"build": "parcel build index.html"
}
...package.json에는 npm 실행 하기 전 scripts에 npm 명령어를 설정 할 수 있습니다.
기본적으로 npm start는 JavaScript를 실행 할 수 있는 명령어로 설정 되어 있습니다.
JavaScript 환경이 설치가 되었다면 명령어 npm start를 실행합니다.
