누구나 쉽게 소스 코드를 작성하고 결과를 확인할 방법은?
프로그래밍 언어에 따라서 코드를 작성하고 테스트하기 위해서 설치해야 하는 프로그램의 종류도 굉장히 다양했고 환경을 설정해야 하는 부분 때문에 굉장히 불편했었습니다.
그래서 개인적으로 가장 간편하고 쉽게 바로 프로그래밍 코드를 작성하고 결과를 바로 확인해 볼 수 있는 게 어떤 게 있을까 생각을 해보니 JavaScript 언어를 통해서 가장 간편하고 쉽게 프로그래밍 코드를 작성하고 테스트해 볼 수 있었던 것 같습니다.
클라우드 개발 툴 같은 것을 이용해 자신이 원하는 언어의 환경을 웹상에서 세팅하여 코드를 테스트해 볼 수 있긴 합니다만 개인적으로 가장 쉬운 방법으로 Javascript 언어가 떠올랐습니다.
작성하는 기준은 윈도우 환경 기준이지만 어떠한 환경에서도 바로 프로그래밍 코드를 작성하고 테스트해볼 수 있습니다.
윈도우 환경이든 리눅스 환경이든 IOS 환경이든 새로운 문서 작성이 필요한 툴을 실행하시면 됩니다. 윈도우 기준으로는 메모장이 제일 간편하겠네요.
메모장에 아래와 같은 코드를 작성하면 바로 프로그래밍 코드를 테스트해 볼 수 있습니다. 어떠한 언어든 변수를 선언하고 반복문, 제어문 등을 사용하는 방식은 큰 차인가 없습니다. 그러니 자바스크립트로 코드를 통해 프로그래밍 소스 코드를 작성하고 연습하며 테스트해볼 수 있습니다.
<script>
for(var i=0; i<10; i++){
console.log("현재 반복되고 있는 숫자는 " + i + "입니다.");
}
</script>
메모장에서 코드 작성이 끝난 뒤에 .html 확장자로 파일을 저장해 주시면 됩니다. 파일 이름은 원하는 이름으로 저장하시면 됩니다. 핵심은 파일의 형태를 .html 형태로 변경해 주셔야 합니다.
작성한 일반 파일을 html 파일 형태로 저장하시고 더블 클릭으로 실행해 보시면 작성한 코드에 대한 실행 결과를 확인하고 볼 수 있습니다.
크롬, 익스플로러, 엣지, 파이어폭스, 사파리 등 F12 개발자 모드를 통해 Console이라는 영역을 선택하면 작성한 소스 코드를 통해 실행된 결과를 눈으로 보실 수 있습니다.
이러한 식으로 인터넷이 되지 않는 환경에서도 기본 내장으로 설치된 웹브라우저를 통해서 html 파일만 만들어 주면 간단히 프로그래밍 코드를 작성하고 테스트해 볼 수 있는 장점이 있습니다.
이렇게 작성을 하고 웹브라우저에서 개발자 모드에서 확인해야 하는 단점이 있긴 합니다만 이러한 부분은 HTML을 조금만 이해하시면 어렵지 않게 웹페이지에 작성한 프로그래밍 코드를 개발자 모드에서 확인해 보지 않아도 됩니다.
방금 작성한 HTML 파일을 메모장이나 편집이 가능한 편집기로 파일을 선택하고 열어 주시면 됩니다.
그리고 아래와 같은 소스 코드를 작성하시면 됩니다. HTML 언어의 경우는 완벽히 코드를 작성하지 않아도 문제 없이 실행이 됩니다.
HTML이 먼저 실행되고 script 구문에서 해당 HTML 구문을 찾아서 태그를 넣어주는 상황이기 때문에 부분을 하단에 위치해야 합니다.
물론 jQuery를 사용해 document. ready 같은 문구를 사용하게 되면 구문을 먼저 작성해도 문제는 없습니다. 결국엔 html이 먼저 실행되고 script가 순서대로 실행되는 형태로 생각하시면 편합니다.
소스는 HTML에 태그가 하나 있고 script 영역에서 생성된 html 태그 중 id가 result에 해당하는 녀석을 찾아 html 태그를 추가해 주는 코드입니다. 마찬가지로 작성한 파일을 저장하시고 html 파일을 실행해 보시면 됩니다.
<html>
<div id="result">
</div>
</html>
<script>
var html = document.getElementById("result");
for(var i=0; i<10; i++){
//console.log("현재 반복되고 있는 숫자는 " + i + "입니다.");
html.innerHTML += "<p>현재 반복되고 있는 숫자는" + i + "입니다.</p>";
}
</script>
그럼 작성한 소스 코드의 결과를 브라우저의 개발자 모드에서 확인하지 않아도 됩니다.
물론 배우고 싶은 특정 언어가 있을 수도 있고 웹 환경을 좋아하지 않는 분들도 꽤 많으실 거라고 생각됩니다. 하지만 간단히 프로그래밍 코드를 작성해 보고 테스트해 보기엔 Javascript로 작성된 코드를 통해 HTML 파일을 실행하는 형태가 간편하다고 생각합니다.
프로그래밍 언어를 작성하고 테스트해 보기 위해서 어떠한 프로그램을 설치할 필요도 없고 텍스트 편집만으로 HTML 파일을 만들어 작성한 소스 코드를 확인해 볼 수 있는 큰 장점이 있다고 생각합니다.
간단한 코딩의 기초들은 script 언어를 사용해 익숙해지시고 가끔 HTML 언어도 익히면 나쁘지 않다고 생각합니다. 모바일 웹, PC 웹, 애플리케이션 등 HTML과 Javascript 언어는 굉장히 많이 사용되고 있습니다.
개인적인 생각이긴 합니다만 가장 접근하기 쉽고 간편하며 평소에 많이 접할 수 있는 언어인 HTML과 SCRIPT 언어를 통해 프로그래밍 세계에 입문하는 것도 괜찮다고 생각합니다.
나름대로 가장 간단히 소스 코드를 작성하고 테스트해 볼 수 있는 내용에 대해 정리해 보았습니다. 프로그래밍 코드에 관심이 있으신 분들에게 흥미 있을 만한 내용이 되었기를 바랍니다.
