[카테고리:] 개발

내가 하나하나 진행하면서 글 쓰려고 했는데… 옛날에 자바 스크립트 쓰는 거 진짜 더러웠다고 하는데 안믿는 애들이 있어서 옛날에 쓰는 방식을 보여줬다. 그리고 그 내용을 여기서도 보여주려고 한다.

옛날 자바스크립트는 자바스크립트와 호환되지 않는 브라우저가 스크립트 부분을 html의 일부로 그냥 화면에 표시해 버리는 것이 빈번하게 존재했다. 그래서 반드시 head 태그 안에 script를 별도로 작성하였다. 그럼에도 불구하고 내부에 js 코드를 넣으려면 어떻게 했냐고? html 주석과 섞어서 처리했다.

<script>
<!-- 
document.write("hello");
-->
</script>

이런 식으로 처리해버리면 js가 처리되는 코드에서는 실행되고, 안그러면 그대로 html의 주석 처리가 되어서 실행되지 않는 것이다. ㅡㅅㅡ 게다가 noscript라는 태그도 존재한다. 이런 걸 이용해서 처리하면 js에 대응하지 않는 브라우저로는 별도의 표시가 되도록 하는 형식이다. 위에 것에서 추가한다면… 이런 것이다.

 <script>
<!-- 
document.write("hello");
-->
</script>
<noscript>
This browser dosen't corrspond to js.
</noscript>

….아 진짜.. 이거 생각하니 열받네. 이거 언제부턴가 head에서도 쓸 수 있게 되어있다. 그래서 이거 쓰는 건 좀 조심해야 한다. 게다가 여전히 xhtml에서는 이용 안된다.

근데 요즘은 js 동작 안할때를 위해서라면서 html 알려줄 때 알려주는 걸로 아는데, 요즘 브라우저에서 아직도 안되는 게 있나…? 싶을 정도이다. 뭐 써서 안전하다면 그냥 쓰던가. ㅡㅅㅡ

그리고 js의 옛날 특징이라고 하면… language, text를 별도로 지정해서 이용하였던 것이라고 생각한다. 바로 이런 식으로 말이다.

vs code가 암말도 안한다. 아직도 적용되는 녀석이라는 거다.

내가 배우기 이전에는 이렇게 해서 js1.2 지원 브라우저에서만 이용되게 하려고 이렇게 했었다고 한다.

근데 내가 배울 땐 이렇게는 안배웠고…. type로 배웠지. 이렇게 배운 사람들 장난 아니게 많을 것이다. 옛날부터 엄청 오래 써오던 CMS 시스템들이 아직도 이런 js 코드가 많이 남아있을텐데…

이렇게 처음으로 배운 분들 많을 것이다.

여기에 이벤트 핸들러(onClick 같은것들)에 기술한 스크립트에 대해서도 종류 지정을 할 수 있었기 때문에, html의 헤더에다가 meta를 지정해서 이용하는 것도 있었지…

이런 것들이 아직도 쓰이긴 하지만…. 요즘은 그나마 나아졌다고 생각한다. 이것 조차 불필요하게 되어서, 이젠 그냥 규정치로써 js가 그냥 당연하게 이용되니깐. 타입스크립트 같은 경우에는 개발 환경 구성 단계에서 타입스크립트를 이용한다고 지정만되어있으면 그냥 그대로 사용되기도 하고….

그래서 이런 이야기 하면서 세월 좋아졌다고 하면 나이 든 티가 날 것이다. ㅡㅅㅡ

진입장벽이 제일 낮은 곳 아닐까 하는 생각이 든다. 솔직히 그냥 메모장과 웹 브라우저만 있어도 가능하다. 대부분의 실행과 디버그는 웹 브라우저에서 다 진행할 수 있다.

뭐, 메모장은 그래도 좀 그러니깐 그냥 에디터를 이용하자고 하자. 웹은 각종 여러 언어들을 섞어서 개발하다 보니 IDE(통합 개발 환경)으로 나오는 경우가 별로 없다. 있어도 거의 대부분 플러그인 떡칠이다. 그럴꺼면 그냥 에디터 써도 될 정도다. 내 경우에는 주로 Visual Studio Code를 이용한 것을 보여줄 것이다. vim, emacs,인텔리, 에디트플러스 등등 그냥 편한 거 쓰면 된다. 뭐가 좋냐고 물으면 그냥 쓰기 편한 게 좋다고 할 것이다.

그리고 실행과 디버그 자체가 그냥 웹 브라우저를 이용하기만 하면 되기 때문에 그렇게 어려운 것이 없다. 직접 만든 코드를 웹 브라우저에서 돌려보기만 하면 되니깐.

그래서 바로 hello world를 만들어서 보여주려고 한다. code를 열어서 html 페이지를 아래와 같이 하나 만들었다.

그냥 진짜 hello world.

script라고 되어있는 곳에 옛날에는 자바스크립트라고 정의해주고 하는 내용을 넣고 해야 하는데… 요즘은 그냥 저렇게 해도 된다. js가 거의 표준 아닌가 싶을 정도로 널리 쓰이고 있으니깐… (타입 스크립트 이야기 하고 싶으면 나중에 다른 기회를 보자.)

그래서 저 html 파일을 실행하고, 브라우저의 개발자 모드를 보면 아래처럼 hello world가 표시될 것이다.

근데 지금 내가 hello world를 두 군데에 넣어서 뭐가 뭔지 몰겠다 싶으면, 코드 수정하고 저장해보자.

단순 무식한 구분 방법. ㅡㅅㅡ

이렇게 그냥 무식한 방법으로 구분이 되게 했으니 결과는… 무식하게 나온다.

무식하지만 효과는 좋게 나온다. 그래서 난 무식하게 알려주는 걸 좋아한다.

이제 하나하나 다시 시작해보자.

줄여서 js라고 하던데.. 만난 건 엄청 오래전이다. 근데 내가 쓸 때의 js는 진짜 그냥 웹 페이지를 동적으로만 만들어주고 하는 데 이용하던 스크립트 중 하나였다. 거의 2006~2008년부터 만나기 시작해서 알게 된 녀석인데….

이 때 이용자들은 알 것이다. 사이트가 동적으로 움직일 수 있다는 것만으로도 자바가 엄청나게 각광받고, js가 그 자리 안에서 조금씩 발전하고 있는데 각종 알 수 없는 warning 띄우고 할 때에 보면 꼭 이녀석이 난리치고 있던 것도 있고… 뭔가 html 코드 안에서 난잡하게 돌아가고 그런 것들. 그리고 사이트 느리게 만드는 주범 중 하나였고… (그때 뭐 알고 했나.) 그러면서 브라우저끼리 호환도 잘 안되던 과거가 있질 않나… 거기에 더해서 웹 사이트에서 복잡한 기능을 넣고 하질 않았기 때문에 js 코드들도 간단했기 때문에 js 하는 것 = 그냥 왕초보 이런 느낌이었던 시절이다.

근데 지금 와서 웹 하는 데 보면 죄다 js가 기본으로 깔려간다. 웹 클라이언트에서 js 빼고 이야기 못할 정도다. 언어 자체의 성능도 발전하고 jit도 도입되면서 실행 속도도 엄청 빠른 편이다.

게다가 요즘 웹 개발이 주를 이루고 그에 따라 엄청 복잡해지면서 수요도 엄청 늘고, 나같은 임베디드 하던 인간들도 최소한의 설정 작업 만드는 것도 이젠 웹 베이스로 만들어 줘야 하는데 이런 곳에서도 어느정도 알아는 둬야 협업이 된다. 그래서 요즘 웹 관련된 내용을 하나하나 다시 볼려고 한다.