불꽃 튀게 빠르고 설정이 필요 없는 zero-configuration이며, 웹 애플리케이션 번들러인 Parcel에 대해 개념을 잡아보자.Parcel은 2017년에 나온 번들러로 릴리즈 된 지는 별로 되지 않았지만, 설정이 필요 없다는 강력한 장점이 있다. 그렇기 때문에 반대로 설정이 복잡한 Webpack과 비교 대상이 되기도 한다. 우리는 Parcel의 깊은 사용법보다는 먼저 이 포스트에서 Parcel에 대한 개념과 무엇이 Webpack과 다른지 먼저 알아보고 간단하게 Parcel을 설치하는 방법을 알아보자.
Parcel에 대해 알아가기 전 먼저 Webpack에 대해 알고 싶다면 Webpack 개념잡기과 Webpack 완전정복하기!! 포스트를 참고하도록 하자.

NVM을 사용하여 Windows 환경에서도 Node.js의 버전을 관리하고, 개발 환경에 따라 Node.js 버전을 변경하는 방법을 배워보자.NVM 은 Node Version Manager로써 Node.js의 도구이며 여러 Node.js를 설치하여 상황에 따라 버전을 변경해 가면서 사용하는 것을 말한다.
개발 환경에 따라 Node.js의 버전을 변경해야 하는 상황이 한 번쯤은 꼭 온다. 이런 환경에서 그때마다 Node.js를 재설치 및 삭제하는 방법으로는 한계가 있고 불편할뿐더러 잡아먹는 시간도 아깝다. 이런 상황에서 Node.js 버전을 상황에 따라 변경해 가면서 사용하게끔 도와주는 것이 NVM, 즉 Node Version Manager이다.
글쓴이의 경우에도 Hexo 기반의 블로그를 VuePress 기반의 블로그로 변경하려고 하였는데 Hexo의 경우 Node.js Version 12.0.0 보다 높으면 일부 문제가 발생하기 때문에 Node.js Version 12.0.0을 사용해야 하는데 VuePress의 경우 12.0.0에서 다른 문제를 야기했기에 더 높은 버전을 사용해야 하는 불편한 점이 많았다.

이번 섹션에서는 npm scope에 대해서 알아보고 이 scope 패키지를 통해서 어떻게 npm registry에 배포하는지 파악해보고 npm 패키지를 실제로 배포까지 해보도록하자.npm에는 scope라는 개념이 존재한다.
npm의 scope 개념은 조직 또는 그룹이다. 우리는 이 scope를 통해서 협업이 가능하며, 여러개의 분산된 패키지를 하나의 조직으로 관리 또는 배포 할 수 있다.

예제를 통하여 npm 패키지를 생성하고 생성된 npm 패키지를 NPM Repostory에 배포까지 배움으로 인해 오픈소스로서 NPM 생태계에 기여하는 방법을 배워보자.이번 포스팅에서는 npm 모듈 혹은 npm 패키지를 생성하여 실제로 NPM Registry에 업로드까지 하여 오픈소스로서 NPM 생태계에 기여하는 방법을 배워보자.
우리가 오픈 소스를 만들고 싶거나 관리를 하고 싶다면 git hub에 오픈소스를 올리는 것에는 한계가 있다. 우리가 오픈 소스를 만드는 목적은 공유와 제공이라 생각한다. 내가 만든 것을 남에게 공유하고 이런 오픈 소스가 필요한 사람에게는 쉽게 접해서 사용할 수 있게끔 하는 것이다. 그렇기 때문에 git hub에 올리는 것을 넘어서 npm 패키지로 모듈화하여 NPM Registry에 올리는 것이 필요하다. 지금부터 npm 패키지를 만들고 배포하는 방법을 배워보자.

Vue.js의 기본 개념을 익히고 기본적인 Vue.js Component를 생성해 보자. Vue.js의 Component 개념은 Vue.js Framework에서도 중요한 부분을 차지하고 어떻게 Vue.js Component를 생성하느냐에 따라 Vue.js의 개발속도와 코드의 가독성, 그리고 효율성이 현저히 차이가 난다.우리는 이번 포스트에서 Vue.js의 Component 생성 방법에 대해 알아보고 실제로 Vue.js의 Component를 직접 만들어보기로 하자. 이번 포스트는 공식 문서에 나와있는 컴포넌트 생성 방법의 여러 가지 방법 중에 어떤 것이 실무에서 효율적인지를 파악하는 Vue.js Tutorial이다.

Vue CLI 3는 Vue.js 개발을 위한 시스템으로 Vue.js Core에서 공식으로 제공하는 CLI이다. Vue CLI는 애플리케이션 개발에 집중할 수 있도록 프로젝트의 구성을 도와주는 역할을 하며, Vue 생태계에서 표준 툴 기준을 목표로 하고 있다. 이번 포스트에서는 Vue CLI의 개념부터 설치 그리고 Vue-CLI의 사용 방법까지 알아보도록 하자.Vue CLI의 사용은 선택사항이다. Vue 애플리케이션을 개발하기 전에 Vue CLI를 통해 프로젝트를 구성하고 구축하지 않는다 하더라도 애플리케이션에 영향을 주지는 않는다. 그저 Vue CLI는 앞에서 말했듯이 툴의 역할을 하고 스캐폴딩에 도움을 주는 역할만 한다.
Vue CLI를 사용하지 않아도 무방하지만 Vue.js와 관련된 오픈 소스들은 대부분 Vue CLI를 통해 구성이 가능하도록 구현되어 있고 굳이 Git으로 clone하지 않아도 Vue CLI를 통해 더욱더 손쉽게 설치가 가능하기 때문에 Vue CLI의 사용을 추천하는 바이다.
그럼 이제 Vue CLI에 대해서 알아보자. 해당 포스트에서는 Vue CLI 3.x에 관해서 설명을 하며 Vue CLI 2.x에 대한 내용은 Vue CLI 2를 참고하자.

웹 기술인 JavaScript, HTML, CSS를 이용하여 크로스 플랫폼 데스크탑 앱을 만들 수 있는 Electron의 활용성과 사례가 어떤지 알아보고, 개념부터 설치 그리고 데스트탑 앱을 한 번에 배우고 만들어보자. 이제는 JavaScript와 HTML 그리고 CSS를 활용하여 데스크탑 앱을 만들 수 있다. Electron은 다른 JavaScript Framework와도 접목해 개발이 가능하기 때문에 기존의 웹 기술을 가지고 있는 웹 개발자라면 한 번쯤은 도전해 볼 만한 Framework이다.

지금까지 우리는 webpack에 대한 개념을 먼저 살펴보았다. 이제 실제로 webpack을 설치해보고 사용해 보면서 하나하나 짚어나가 보자. 왜 webpack이 많이 사용되는지와 Gulp와의 차이점을 알았다면 이제 실제로 webpack을 설치해보고 사용해 보면서 하나하나 짚어나가 보자.webpack은 npm으로 쉽게 설치할 수 있다. 만약 이 포스트를 보는 당신은 npm이 무엇인지 모른다면 빠르게 배우는 Node.js와 NPM 설치부터 개념잡기 포스트를 참고하자. 자! 이제 설치를 해보자. 먼저 적당한 경로에 Webpack_Project라는 이름의 프로젝트 폴더를 생성하고 해당 폴더에서 명령 프롬프트를 실행하여 webpack을 설치하자.

Web front-end build tool에는 여러 가지가 있다. 이러한 build tool은 단순히 소스를 묶고 컴파일하고 압축하는 단순한 형태에서 벗어나 하나의 기술로 자리잡혔다. 이 build tool들을 활용함으로써 우리가 진행하는 프로젝트에 엄청난 시너지를 안겨 줄 수 있다. 수많은 build tool 중 이 포스트에서는 **떠오르는 build tool인 webpack**에 대한 소개와 프로젝트를 진행하면서 왜 Build Tool이 필요한지 포스팅하겠다.

node.js와 npm 기초 완벽 가이드!! node.js와 npm을 설치해보고 개념도 잡아보자. 그리고 더 나아가 IntelliJ에서 npm을 어떻게 사용하는지 알아보자. node.js와 npm은 웹 개발에 종사하고 있는 개발자라면 웬만해서는 알만큼 중요한 기술 중의 하나이다. 많이 들어보기도 했을 것이다. 이와 관련된 포스팅도 많고 정보도 많으니까. 그럼 node.js와 npm이 무엇인지 알아보고 설치를 진행해 보자.