Javascript 스터디 – 002 여담: 옛날 Javascript를 보여주지…ㅡㅅㅡ

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

옛날 자바스크립트는 자바스크립트와 호환되지 않는 브라우저가 스크립트 부분을 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가 그냥 당연하게 이용되니깐. 타입스크립트 같은 경우에는 개발 환경 구성 단계에서 타입스크립트를 이용한다고 지정만되어있으면 그냥 그대로 사용되기도 하고….

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

Filesystem in Userspace와 AppImage

Filesystem in Userspace(FUSE)는 커널이 아닌 사용자 공간에서 파일 시스템을 구현할 수 있게 해주는 소프트웨어입니다. FUSE는 Linux 커널 모듈과 사용자 공간 라이브러리로 구성되어 있으며, 이를 통해 사용자는 자신만의 파일 시스템을 쉽게 만들 수 있습니다.

FUSE의 주요 특징은 다음과 같습니다.

  1. 사용자 공간에서 실행: FUSE는 파일 시스템 코드를 사용자 공간에서 실행할 수 있도록 해줍니다. 이는 파일 시스템 개발을 더 쉽게 하고, 커널 크래시 없이 개발 중인 파일 시스템을 테스트할 수 있게 합니다.
  2. 다양한 언어 지원: FUSE는 C, C++, Python, Java 등을 포함한 다양한 프로그래밍 언어를 지원합니다. 이는 개발자가 익숙한 언어를 사용하여 파일 시스템을 구현할 수 있게 합니다.
  3. 유연성: FUSE를 사용하면 다양한 종류의 파일 시스템을 쉽게 구현할 수 있습니다. 예를 들어, 원격 서버의 파일 시스템을 로컬에 마운트하거나, 데이터베이스를 파일 시스템으로 사용하는 등의 작업이 가능합니다.
  4. 보안: FUSE는 사용자 공간에서 실행되므로, 커널 공간에서 실행되는 전통적인 파일 시스템에 비해 보안상의 이점을 가질 수 있습니다. 이는 버그나 악성 코드로부터 시스템을 보호하는 데 도움이 됩니다.

FUSE의 동작 방식은 다음과 같습니다.

  1. 커널 모듈: FUSE는 먼저 커널 모듈을 통해 파일 시스템 호출을 인터셉트합니다.
  2. 사용자 공간 라이브러리: 인터셉트된 호출은 사용자 공간으로 전달되며, FUSE 라이브러리가 이를 처리합니다.
  3. 파일 시스템 구현: 사용자는 FUSE 라이브러리를 사용하여 파일 시스템의 동작을 정의합니다. 이는 파일 읽기, 쓰기, 삭제 등의 작업을 포함합니다.

FUSE는 특히 개발자들이 새로운 파일 시스템을 빠르고 쉽게 개발할 수 있도록 도와주는 강력한 도구입니다. 이를 통해 다양한 파일 시스템 실험과 구현이 가능해지며, 이는 Linux의 파일 시스템 확장성과 유연성을 더욱 강화합니다.

이렇게 좀 사전적인 의미로 FUSE를 설명해 드렸습니다. 근데 왜 이걸 이렇게 설명하냐면…. AppImage라는 형태의 프로그램들을 설명하기 위해서 그렇습니다.

요즘 제가 몇몇 프로그램을 받아서 리눅스에서도 써보고 있는데, AppImage라는 녀석으로 받을 경우에 어떻게 실행하라고는 쉽게 나와있습니다. Property에서 보면 이걸 프로그램으로 인식해서 실행하라고 체크박스가 있는데, 그걸 체크하여 설정한 후에 그냥 더블클릭하면 실행할 수 있습니다만, 이걸 왜 이렇게 해야 하는지에 대한 설명이 모자라더군요. 그 기반이 되는 녀석이 바로 FUSE입니다. 그리고 이녀석이 AppImage와 어떻게 연관되어있는지도 설명을 좀 사전적으로 해보겠습니다.

FUSE(Filesystem in Userspace)와 AppImage는 서로 다른 목적을 가진 두 가지 기술이지만, FUSE가 AppImage의 작동에 중요한 역할을 합니다. 이 두 가지가 어떻게 연결되는지 설명드리겠습니다.

AppImage

AppImage는 Linux 시스템에서 소프트웨어를 배포하는 포맷입니다. 이를 통해 하나의 실행 파일로 소프트웨어를 배포하고 실행할 수 있습니다. AppImage는 소프트웨어 설치를 필요로 하지 않으며, 단일 파일로 제공되어 사용자가 클릭하여 실행할 수 있습니다. 이는 특히 소프트웨어 배포를 간단하게 하고, 다양한 Linux 배포판에서의 호환성을 보장합니다.

FUSE와 AppImage의 연결

AppImage는 FUSE를 사용하여 파일 시스템을 마운트하고, 이를 통해 소프트웨어를 실행할 수 있습니다. 구체적으로, AppImage는 내부적으로 압축된 파일 시스템을 포함하고 있으며, 이를 FUSE를 통해 임시 마운트하여 소프트웨어를 실행합니다. 다음은 그 과정에 대한 자세한 설명입니다:

  1. AppImage 실행: 사용자가 AppImage 파일을 실행하면, 이 파일은 자체적으로 포함된 파일 시스템 이미지(압축된 파일 시스템)를 마운트하려고 시도합니다.
  2. FUSE 사용: AppImage는 FUSE를 사용하여 파일 시스템 이미지를 임시로 마운트합니다. 이를 통해 AppImage 내부의 모든 파일과 디렉토리가 접근 가능해집니다.
  3. 소프트웨어 실행: 마운트된 파일 시스템에서 소프트웨어를 실행합니다. 이 과정에서 필요한 라이브러리와 리소스는 모두 마운트된 파일 시스템 내에 포함되어 있어, 시스템에 추가적인 설치나 설정 없이 소프트웨어를 실행할 수 있습니다.
  4. 마운트 해제: 사용자가 소프트웨어를 종료하면, FUSE를 통해 마운트된 파일 시스템은 자동으로 해제됩니다. 이는 시스템에 잔여 파일이나 설정이 남지 않도록 합니다.

간단 요약

  • FUSE: 사용자 공간에서 파일 시스템을 구현하고, 안전하게 파일 시스템을 마운트 및 해제하는 기능을 제공합니다.
  • AppImage: FUSE를 사용하여 내부에 포함된 파일 시스템 이미지를 임시로 마운트하고, 이를 통해 소프트웨어를 실행합니다.

이러한 연결 덕분에 AppImage는 설치 과정 없이도 복잡한 소프트웨어를 쉽게 배포하고 실행할 수 있는 편리한 방법을 제공합니다.

자, 좀 간결하게 이해가 되었을까요? 이렇게 해서 AppImage로 배포되는 프로그램들이 조금씩 늘고 있고, 여러모로 사용되고 있습니다.

Javascript 스터디 – 001 개발도구와 개발 환경, 그리고 hello world

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

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

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

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

그냥 진짜 hello world.

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

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

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

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

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

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

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

Javascript 스터디 – 000 회기, 그리고 다시 정리

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

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

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

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

왜 안해봤어요? – 해볼 기회가 없었는데요?

되게 당연한 질문과 당연한 대답인데… 이상하게 들릴 때가 있다.

개발자 채용 시장에서나 그냥 잡소리 하다보면 이상하게 한번씩 나오는 말이다.

난 임베디드만 주로 했던 녀석이라 솔직히 웹을 건드릴 일이 없다. 그래서 웹쪽은 지원도 안했는데, 웹은 왜 안했냐고 물어보는 사람들이 간간히 있다. 대부분 개발 모르는 사람들이다.

옛날에는 진짜 임베디드에서 웹 페이지 넣는 거라고 해봤자 php 넣고 돌아갈 수준의 정말 작은 웹 서버 갖고 제어 컨트롤러 만들던 게 대부분이었다. 요즘은 그렇게는 안한다. 돌리는 하드웨어가 좋은 경우가 많아서 말이지.

요즘에 들어와서야 config 관련 작업들을 웹 인터페이스로 제공해 주는 곳들이 많으니 그런 곳들 좀 이용해야 한다면 나도 좀 해보지 않을까?