[노마드 코더 Vanilla JS] 왜 Vanilla JS를 배워야 할까?

노마드 코더의 유튜브를 보던 중 Vanilla Js의 중요성 을 다룬 동영상을 보고 많은 공감을 할 수 있었다.

결국 React, Vue, Angular 등등 수많은 라이브러리들이 JS가 근간이 되는 라이브러리들이고 

그것을 이해하려면 JS의 근간이 되는 Vanilla JS에 대한 이해가 필요하다고 생각했다.

 

 

그래서 Vanilla JS에 대한 강의를 찾던 중 노마드 코더에 Vanilla JS 무료 강의 를 발견했고 곧장 듣기로 결정했다.

이 시리즈는 노마드 코더 강의를 따라가면서 중요하다고 느껴지는 부분을 기록하는 일지가 될것같다.

이번 포스트는 내가 왜 Vanilla JS에 대해서 공부해야겠다고 느끼게 된건지 말해보려고한다.

바닐라 JS로 크롬 앱 만들기

 

왜 JavaScript 인가?

우선 JavaScript의 일종인 Vanilla JS에 대해서 알아보기 전에 왜 JavaScript 가 중요한지 먼저 짚어봤다. 당연한 말이지만 현 시대에 인터넷에서 웹을 사용하지 않는 사람은 거의 없다. 그리고 JavaScript는 웹에 쓰이는 오직 한가지의 프로그래밍 언어이다. 그 뜻은 JavaScript는 전세계 거의 모든 사람들이 사용 하는 것을 만들고 보여주는 도구가 된다는 것이다. 그러므로 JavaScript는 모든 브라우저에 내장되어있고 (Vanilla JS) 세계 전역에 침투되어있다. 이것만으로도 프론트 엔드 개발에 있어서 JavaScript가 중요한 이유가 나에게는 충분히 납득이 되었다.

 

 

- ES5, ES6 ... ?

JavaScript에 대해서 찾아보거나 공부하면 많이 볼 수있는 것이 ES5, ES6 등등의 버전같아 보이는 것들이다. ES5, ES6 뿐 아니라 ES2016, ES2019 등등 상당히 많다. ES라는 것은 ECMAScript Specification의 줄임말이이고 이것들은 'Specification' 이라고 부르는 것의 버전이다. Specification 은 JavaScript에서 설명문 혹은 안내 메뉴얼 역할을 한다. 예를 들면 '이것을 적으면 컴퓨터에서는 이렇게 반응해, 저것을 적으면 컴퓨터에서는 이렇게 작동해' 를 설명해주는 것이다. 따라서 ES5, ES6, ES2019 와 같은 이름들은 JavaScript 안내 메뉴얼의 버전인 것이다.

 

 

Vanilla JS 는 왜 알아야 할까

 

Vanilla JS는 그래서 일단 뭘까?

 

 

아무런 맛이 추가되지 않은 기본 바닐라 아이스크림 같은 Vanilla JS 

 

맨 위에서 적었듯 JavaScript에서는 많은 라이브러리들이 존재한다. 이 Vanilla JS라는 것은 JavaScript의 한 종류로써 라이브러리가 없는 날것 상태의 JavaScript를 뜻한다. React가 화장을 한 JavaScript의 형태라면 Vanilla JS는 화장기 없는 맨얼굴의 JavaScript라는 것이다. 다음 사진을 보자.

 

Vanilla-js.com 이라는 패러디 사이트에서 가져왔다.

 

위의 사진은 Vanilla JS의 document.getElementByID('test-table') 이라는 코드를 각기 다양한 툴킷, JS, 라이브러리들의 코드로 꾸며낸 것이다.  즉, 위에 보이는 수많은 코드들의 본질은 document.getElementByID('test-table') 라는 Vanilla JS의 코드이고 각각 그들의 코드는 본질을 대체하는 껍데기에 불과하다는 것이다. 이것은 Vanilla JS라는 JS를 이해하게 되면 그 외의 대체하는 수많은 라이브러리, 툴킷 등을 이해하는데 훨씬 수월하다는 것이다. 예를 들어보자면, 노래를 하고 믹싱을 한다고 생각하면, 자신의 목소리의 음역대와 음정을 정확히 알고 목소리를 듣기 좋게 만들기 위해 이퀄라이저를 사용하거나, 오토튠을 사용하는 사람과 그렇지 않아서 이것저것 일단 발라놓고 보는 사람의 차이는 속도나 정확도면에서 차이가 확연할 것이다.

 

Vanilla Js를나를 포함한 수많은 사람들이 라이브러리를 사용하고 그 근간에는 Vanilla JS가 있는 것이다. 

 

 

 

그래서 ..

보통 강의를 들으면 왜 그것에 배워야 하는지 부터 시작한다. 그리고 나는 보통 그것을 들어도 대충넘기고 마는데 이번엔 나 스스로 확실히 그 당위성에 대해 수긍을 하려고 했고, 충분히 이해가 되었다. 어떤 것을 배울 때 그것이 왜 필요한지를 이해하는 것이 중요하다는 생각이 들었다. 사실 JavaScript 에 대한 이해를 먼저 충분히 하고 지금 하고있는 리액트 프로젝트로 넘어오는 것이 맞는 수순인 것 같지만 지금이라도 얼른 시작해 보려고 한다. 다음 포스트에는 강의 완전 첫번째인 Vanilla JS의 이론부분에 속하는 부분을 기록해볼 예정이다.