angular도 한번 써보기로 했다. angular는 뭔가 또다른 세상이다. 처음보는 것들이 많다. 하나하나 알아가보기로 했다. concurrently의 활용 typescript를 하면서도 이런 코드를 봤는데 angular도 typescript를 base로 하고 있어서 그런지 concurrently를 사용하고 있었다. 막연히 watch 같은 건가보다 하고 있었는데 사용하는 것을 가만히 보니 npm start 와 npm run serve 를 param으로 넘겨주고 있었다. 그래서 궁금했다. 찾아보니 concurrently는 동시에 두개의 process를 처리해주는 것이었다. 그래서 watch와 서버를 동시에 실행하도록 하는 것이다. webpack-dev-server같이 이걸 동시에 해주는 대신 이걸 사용하..

예전엔 사용하지 않을 기술엔 관심도 두지 않았다. 그런데 오랜시간이 지난 뒤에 그 기술을 사용해야 할 때가 왔을때 너무 아무것도 몰라서 당황한 적이 한두번이 아니다. react를 처음 시작했을때 그랬고 node.js를 시작했을때 그랬다. react 이후로 나는 갈림길에 섰을때 적어도 뭔지는 모두 알아보고 선택하기로 했다. 이번에 알아볼 것은 TypeScript다. TypeScript는 Angular때문에 처음 알았다. 물론 구 Angular는 아니고 새로운 Angular다. (벌써 v4 나왔더라. v3은 건더뛴 듯) 사실 Angular를 알아보려고 했는데 TypeScript를 모르는채로 Angular를 알아보면 안될 것 같아 방향을 틀었다. TypeScript는 MS가 만든거라 그런지 굉장히 문서화도 잘..

그동안 React를 사용하다보니 새로운 프레임워크에 눈을 잘 못 돌렸는데 -아니 돌릴 필요가 없었는데- 요즘 Vue.js라는 것이 핫하다는 것을 들었다. 궁금해서 문서를 조금 보긴 했지만 구 angularjs와 비슷하다는 느낌만 받았을 뿐 특징같은 건 파악하지 못했다. 주말동안 혼자있는 시간이 많이 생겨서 이 기회에 Vue.js에 대해서 알아보기로 했다. comment-sample 이전에 angularjs와 handlebar로 댓글 sample code를 만들었는데 지금도 그런 방식으로 react와 vuejs를 비교해서 댓글 sample code를 만들기로 했다. (사실 react로도 이미 만들었지만 그 코드는 react를 잘 모를때 만들어서 너무 보기가 어려워 다시 만들기로 했다.) 만들려고 하는 샘플..

간단한 형태로라도 앱이 만들어졌으니 패키징하고 배포를 해보도록 한다. Electron을 패키지하는 방법은 소스코드를 asar로 압축해서 electron, node와 함께 실행파일로 묶으면 된다. 사실 개발하면서 electron .로 앱실행하는 거랑 별반 다를 것이 없다. 그럼 그냥 zip으로 압축해서 배포하면 되는거 아닌가 싶지만... 그렇게 하면 다운로드 받아서 실행하기 불편하기도 하고 모양새도 좋지 않다. 공식문서에 이에 대한 설명이 잘 나와있다. 이렇게 이걸 얼렁뚱땅 넘어가는 이유는 이 방법은 너무 복잡하고 어렵기 때문이다. 역시나 잘 만들어진 툴을 통해서 쉽게 해결하자. electron-builder 대표적인 패키지 라이브러리는 electron-packager와 electron-builder가 있..

Browser도 만들었고 OAuth 연결도 했으니 이제 UI를 만들어본다. UI는 당연하게도 html/css로 다 만들면된다. 물론 canvas로 그려도 되고 web-gl로도 그려도 된다. 중요한 것은 electron에서 사용하는 Chromium버전에만 동작하면 되니 다른 브라우저 신경쓰지 않고 맘껏 만들 수 있다는 점이다. 그동안 잉여력으로 테스트해온 Chromium의 극단을 끄집어낼 기회다. Electron으로 앱을 만들면서 가장 좋았던 점이 이 점이었다. polyfill도 필요없고 변환작업없이 ES6를 사용할 수도 있다. React 여러 UI 라이브러리 중에서 React를 선택했다. 이전에 사용해봐서 익숙하기도 하고 사용자가 많아서 귀찮은 작업을 대신해 줄 외부 라이브러리도 많다. 초반에 webpa..