TOAST UI

WebRTC는 웹을 통해 유저 간의 실시간 통신을 가능케 하는 기술이다. 물론 WebRTC 기술을 사용하지 않고도 이미 많은 서비스가 실시간 통신을 지원하고 있다. 하지만 비싼 영상/음성 기술을 사용해야 하고, 사용자는 네이티브 앱이나 플러그인을 설치해야 하는 등의 장벽이 존재한다.

토스트 드라이브 프로젝트에서 실제 구현해야 했던 명세 중 Generator 적용 효율이 제일 높았던 명세를 조금 수정했다. 파일 또는 폴더를 선택한 후 다른 폴더로 이동할 때의 명세다. 다음은 웹 기반 파일 시스템 구현 프로젝트의 일부 기능이다. 파일 목록에서 선택한 다수의 파일 및 폴더를 다른 폴더로 이동할 수 있다. 이때, 이동 대상 폴더에 이름이 같은 파일 및 폴더가 이미 존재할 경우 모든 건에 대해서 사용자에게 확인한다.

근래에 자바스크립트 프로그래밍의 패러다임에 큰 변화를 준 명세는 바로 Generator 명세다. 올해 2월 미국 샌프란시스코에서 열렸던 FORWARDJS4 콘퍼런스에서 유명 패널들이 무대에서 ES6와 ES7에 대한 이야기를 주고받는 시간이 있었다. (https://javascriptair.com/episodes/2016-02-10/) 이야기 중간에 패널들이 자신이 가장 좋아하는 명세가 무엇인지 이야기 했는데 이때 자바스크립트 강사로 유명한 Kyle Simpson은 Generator를 가장 좋아하는 명세로 선택했다. 비동기 프로그래밍의 패러다임을 바꾸었다는 이유였다. 다른 패널에 비해 강한 확신과 함께 길게 설명했는데 그때는 그저 ‘그 정도인가?’ 하고 말았다.

자바스크립트는 프로토타입 기반의 언어이며, 모든 것이 다 객체이다. 이런 언어에서는 객체 생성, 프로토타입 접근, 프로토타입 설정을 편하게 할 수 있다. 객체를 정의하는 것과 프로토타입을 설정 하는 일은 똑같은 작업이다. 그래서 프로토타입도 한 문장의 객체 리터럴 안에서 설정할 수 있어야 한다고 생각한다. 공교롭게도 객체 리터럴은 그런 면에서 간단하고 깔끔한 해결책이 될 수 없다. 그래서 'Object.create()'와 리터럴을 조합하여 프로토타입을 설정할 수 있다.

처음으로 웹어셈블리 (WebAssembly)에 대해 들었을 때 그것은 확실히 멋져 보였고 시도해 본다는 것에 매우 흥분했다. 그래서 곧바로 시작했지만 수많은 좌절을 겪게 되었다. 이 글의 목표는 당신에게 내가 겪었던 좌절의 일부만이라도 겪지 않게 하는 것이다.

클로저를 처음 접했을때 전혀 이해가 되지 않았던 기억이 난다. 클로저를 제대로 이해하려면 자바스크립트 코어에대한 지식이 적지 않게 필요하기 때문이다. 개인적으로는 자신이 사라지기전까지 스코프의 종결을 미루기에, 바꿔 말하면 자신의 사라지면 자신의 스코프도 종결해 버리기에 Closure(종결) 라고 한때 간단하게 정리 했었다.(뭐 틀린말은 아니다) 클로저에 관한 설명은 여기 링크에서 자세하게 알아 볼 수 있다. 참으로 훌륭한 글이다.

어떤 프로그램을 만들든지, 중복 코드는 자주 나타난다. React 또한 마찬가지로 각 React 컴포넌트에서 중복되는 로직과 라이프사이클을 만날 수 있다. 보통 JS에서 클래스 간 중복 로직은 mixin을 통해 해결하는 경우가 많은데, ES6 class문법에서 React는 mixin API를 지원하지 않는다. (물론 직접 class의 prototype을 수정하는 mixin을 구현하거나, React.createClass의 mixin을 이용할 수는 있다.) 그래서 이런 중복 코드를 다른 방식으로 풀어내고 해결하는 방법을 우선 먼저 찾아봐야 하는데, 그 전에 일단 왜, 도대체 왜 mixin을 지원하지 않는지부터 알아보자.

자바스크립트는 큰 특징 중 하나는 '단일 스레드' 기반의 언어라는 점이다. 스레드가 하나라는 말은 곧, 동시에 하나의 작업만을 처리할 수 있다라는 말이다. 하지만 실제로 자바스크립트가 사용되는 환경을 생각해 보면 많은 작업이 동시에 처리되고 있는 걸 볼 수 있다. 예를 들면, 웹브라우저는 애니메이션 효과를 보여주면서 마우스 입력을 받아서 처리하고, Node.js기반의 웹서버에서는 동시에 여러개의 HTTP 요청을 처리하기도 한다. 어떻게 스레드가 하나인데 이런 일이 가능할까? 질문을 바꿔보면 '자바스크립트는 어떻게 동시성(Concurrency)을 지원하는 걸까'?

웹사이트나 애플리케이션의 코드 줄 수가 증가하면 필연적으로 버그가 생긴다. 자바스크립트 뿐만 아니라 모든 언어가 버그 없이 무언가를 만드는것은 매우 어렵고, 불가능하다. 하지만 그것이 버그를 생기지 않도록 주의조차 할 수 없는 것을 의미하는 것은 아니다.

자바스크립트는 원형 객체로 새로운 객체를 생성하는 프로토타입(원형) 기반 언어다. 프로토타입 기반 언어란 무엇일까? 자바스크립트로 프로토타입 언어의 특징을 어떻게 구현할까? 이전에 접했던 자바스크립트에서의 프로토타입에 대한 글이 어려웠다면, 이 글을 통해서 조금이나마 쉽게 이해할 수 있기를 기대한다.