GitHub Pages 를 통해 본 txt를 통한 컴퓨터와 상호작용.

Github Pages

GitHub Pages는 GitHub 저장소에 올린 파일들을 이용해 정적 웹 사이트를 만들어 주는 서비스이다.

이 과정의 중심에는 사람이 읽고 쓰는 text 파일이 있으며,

  • 컴퓨터는 이 text를 직접 이해하는 것이 아니라,
  • 정해진 규칙에 따라 단계적으로 처리한다.

동작 방식

사람은 Markdown과 같은 형식으로 내용(content)을 text file로 작성한다.

GigHub Pages는 Jekyll라는 S/W를 통해 이 text file을 입력(input)으로 읽어 들여,

  • 문법 규칙을 해석하고
  • HTML이라는 또 다른 text 파일로 변환한다.

여기까지의 결과물은

  • 여전히 웹페이지 소스 코드에 해당하는 text 파일이며,
  • 사용자가 보는 화면 자체는 아직 만들어지지 않은 상태이다.

참고: Markup Language

이후, 생성된 HTML과
기존에 사람이 설정한 내용을 담은 text파일(_conifg.yml)에 기반해 만들어진
CSS, JavaScript 파일(이들도 text file임)이
웹 브라우저(이 역시 S/W)로 전달되면, 웹브라우저는 다음과 같은 순서로 이를 처리한다.

  • HTML text를 읽어 문서의 구조를 표현하는 트리(DOM, Document Object Model) 생성
  • CSS text를 해석하여 각 요소의 색상, 크기, 위치 규칙 계산
  • DOM과 CSS 규칙을 결합하여 화면 배치(layout) 결정
  • 결정된 배치를 바탕으로 픽셀 단위의 화면 렌더링 수행

참고: Web Browser의 Rendering Engine

이 단계가 끝나면, 사용자는 더 이상 소스 코드(=text)를 보는 것이 아니라 완성된 시각적 화면을 보게 된다.

참고로, JavaScript text는 별도로 실행(처리하는 엔진이 다름)되어,

  • 버튼 클릭이나 입력과 같은 사용자 행동에 반응하여
  • 브라우저에서 해당 페이지의 DOM 상태를 변경한다.
  • 이 변경은 다시 위의 배치 계산과 렌더링 과정을 거쳐 즉시 화면에 반영된다.

참고: JavaScript 엔진

정리하면,

  • text 파일은 사람이 의도를 기록하는 입력이며,
  • Jekyll과 웹 브라우저는 그 text를 순차적으로 해석하여
  • 사람이 인식할 수 있는 시각적 결과로 변환하는 S/W이다.

또한 이들 S/W 자체도 예외가 아니다.

  • Jekyll 역시 Ruby 프로그래밍 언어로 작성된 소스 코드, 즉 text file로부터 만들어진 S/W이며,
  • 웹 브라우저 역시 C++, Rust와 같은 프로그래밍 언어로 작성된 소스 코드, 즉 text file로 만들어진 S/W이다.

즉 사람의 글에서 시작된 text는,
다른 text로부터 작성된 S/W (compile 등을 거쳐 S/W가 됨)를 거쳐 실행되고,
최종적으로 다시 사람이 인식할 수 있는 화면으로 되돌아오는 구조를 가진다.

Text 파일의 역할.

사람과 컴퓨터의 일은

  • 결국 사람이 이해할 수 있는 데이터를
  • 컴퓨터가 이해할 수 있는 데이터로 바꾸는 것이고,
  • 이는 text file에서 출발한다고 할 수 있음.

GUI와 같은 interface를 제공한다면,

  • 사람의 특정 행동(e.g. 버튼을 클릭)에 따라
  • 컴퓨터가 정해진 반응을 하는 방식이라
  • text file이 직접 관여하진 않으나,
  • GUI를 만드는 행위 자체도 text file 을 통해 이루어진다.

Text file vs. Binary file

구분 HTML / CSS / JavaScript Binary 실행 파일
파일 형태 text file binary file
사람이 직접 읽기 가능 사실상 불가능
주요 역할 구조 정의(HTML), 시각적 표현(CSS), 동작 규칙(JS) 실제 계산과 제어를 수행하는 실행 코드
해석 주체 웹 브라우저 엔진(HTML 파서, CSS 엔진, JS 엔진) 운영체제(OS)와 CPU
실행 방식 브라우저가 text를 읽어 해석 후 실행 CPU가 기계어 형태로 직접 실행
수정 및 배포 파일 수정 후 바로 반영 가능 다시 컴파일 또는 빌드 필요
플랫폼 의존성 낮음(브라우저만 있으면 동작) 높음(OS, CPU 아키텍처 의존)
대표 예시 .html, .css, .js .exe, ELF, Mach-O, 라이브러리 파일
  • 웹에서는 사람이 작성한 text를 브라우저가 해석하는 구조가 중심임
  • 일반 프로그램(S/W)에서는 text로 작성된 코드가 binary code로 변환되어 실행됨

text file이라고 해서 모두 같은 수준의 의미를 가지는 것은 아니다.
text file은 기계와의 거리에 따라 연속적인 스펙트럼 위에 놓여 있다고 볼 수 있다.

일반적인 메모용 text file은 사람 중심의 표현에 가깝고, Markdown이나 markup 언어는 사람이 읽기 쉬우면서도 기계가 해석할 수 있는 규칙을 일부 포함한다. 프로그래밍 언어로 갈수록 문법과 제약이 엄격해지며, 컴퓨터가 정확히 이해하고 실행할 수 있는 표현이 요구된다.

따라서 text file을 사용한다는 것은 단순히 글을 적는 행위가 아니라, 기계가 이해할 수 있는 규칙을 어느 수준까지 만족시키는가를 선택하는 행위라 볼 수 있다. 사용 목적에 따라, 사람에 가까운 text부터 기계에 가까운 text까지 적절한 위치의 표현을 선택하게 된다.

같이 보면 좋은 자료들