본문 바로가기
개발/javascript

자바스크립트 기초 ep.0 - 코드 테스트 사이트

by 왼하루 2022. 4. 25.
반응형

리액트로 간단한 웹페이지를 구축하면서 자바스크립트를 기초부터 한번 정리할 필요가 있다는 생각이 들었습니다. 이를 위해 간단하게 코드를 작성한 후 테스트 해볼 수 있는 사이트를 먼저 소개하도록 하겠습니다.

 

 

자바스크립트 코드 테스트 사이트

자바스크립트 코드를 작성한 후 테스트를 하기 위해 웹서버를 띄우고 작업하는 일이 귀찮기 때문에, 간단히 웹사이트를 통해 익혀보도록 하겠습니다.

 

 

jsbin

아래 사이트는 별도의 설치나 웹사이트 구동 필요없이 간단히 html, css, javascript 를 테스트해 볼 수 있습니다. console 과 웹페이지 결과물을 확인할 output 이 제공됩니다.

 

https://jsbin.com/

 

JS Bin

Sample of the bin:

jsbin.com

 

자바스크립트의 기초를 먼저 학습하기 위해 자바스크립트와 콘솔 창을 활성화 하시면 됩니다. 코드 실행은 Run 버튼을 누르면 console 에 결과값이 나오고, clear 버튼을 누르면 console 내용이 지워집니다.

 

 

jsbin 자바스크립트 테스트

 

추후 HTML 내 script tag를 이용할 때는 html 코드를 작성하고, 콘솔과 결과를 함께 확인할 수 있습니다.  오른쪽 Auto-run JS가 체크되어 있으면 코드 작성이 될때마다 빌드 되기 때문에 불편하신 분은 체크 해제한 후, 필요할 때만 Run with JS 버튼으로 실행시켜주면 되겠습니다.

 

html 과 자바스크립트

 

 

마무리

자바스크립트 기초를 공부하기에 적절한 사이트로 생각됩니다. 

 

오늘도 행복한 코딩생활 되시기 바라겠습니다. 감사합니다.

댓글