코드 놀이터

코드 놀이터 사용 방법

이 플레이그라운드는 HTML, CSS, JavaScript을 브라우저 안의 샌드박스 실시간 미리보기로 합쳐 주며, 로그와 오류를 잡아 내는 콘솔 패널도 갖추고 있습니다. 초안이 로컬에 저장되어 지난 작업을 이어서 할 수 있습니다.

1. HTML, CSS, JavaScript 패널을 각각 편집하세요. 모든 편집기에 줄 번호와 구문 강조가 있습니다.
2. 자동 실행이 켜져 있으면 입력에 따라 미리보기가 자동으로 새로 고침되고, 꺼져 있으면 실행 버튼을 누르세요(자동 실행을 끄고 수동으로 돌릴 수도 있습니다).
3. 미리보기 아래 콘솔 패널을 주목하세요. console.log 출력, 경고, 오류, 잡히지 않은 예외가 줄 번호와 함께 표시됩니다.
4. 초기화를 누르면 내장 데모로 돌아가고, .html 다운로드로 전체 내용을 하나의 독립 파일로 저장할 수 있습니다.
5. 새 창에서 열기를 사용하면 현재 문서를 별도 탭에서 전체 크기로 볼 수 있습니다.

콘솔은 실행할 때마다 비워지므로, 디버깅할 때 console.log를 마음껏 넣으세요. 브라우저의 실제 콘솔을 열지 않아도 출력이 즉시 나타납니다.