Node.js를 Heroku에 배포시 Port에 관하여

var server = app.listen(5000, function () {
    var host = server.address().address;
    var port = server.address().port;

    console.log('app listening at http://%s:%s', host, port);
});

var server = app.listen(5000, function () {

var host = server.address().address;

var port = server.address().port;

console.log('app listening at http://%s:%s', host, port);

});

평소 Node.js 로 작업을 할때 위와 같은 방식으로 주로 코딩을 하는데, 이경우 port때문에(5000번을 내맘대로 사용할수 없으므로) 문제가 발생한다. 꼭 process.env.PORT를 붙여서 헤로쿠 설정이 제공해주는 포트를 사용하도록 하자.

var server = app.listen(process.env.PORT || 5000, function () {
...

var server = app.listen(process.env.PORT || 5000, function () {

...

WebPack에서 Fetch API 적용하기

React를 WebPack으로 묶어서 프론트엔드를 개발하고 있는데, 백엔드와의 통신부분을 jQuery를 쓰다가 Fetch API로 바꾸게 되었다. (React Native와 코드 공유를 좀 더 높이기 위해서) 처음에 WebPack에 node-fetch를 붙이려고 했더니, 빌드에 문제가 생겨서 whatwg-fetch 패키지로 선회를 하게 되었다.

plugins: [
  new webpack.ProvidePlugin({
    'fetch': 'imports?this=&gt;global!exports?global.fetch!whatwg-fetch'
  })
]

plugins: [

new webpack.ProvidePlugin({

'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch'

})

]

사용하려면 webpack config 파일에서

React를 browserify로 빌드하기

react의 구동 환경은 브라우저임에도 불구하고 react 컴포넌트들을 다운받아 보면 var React = require(‘react’); 이와 같이 시작하고 있는 것들을 심심찮게 보게 된다. 물론 이런 문법이 바로 브라우저에서 돌아갈리는 만무하다. 그래서 이럴때 필요한게 바로 browserify나 webpack이다. 개인적으로 browserify를 사용하므로 이에 대해 알아보자.

자주쓰는 npm 명령어

npm은 node.js에서 의존성 관리를 위해 사용한다. 개인적으로 자주쓰는 npm에 대한 사용법을 정리한다.

$ npm install 모듈이름

1 2	$ npm install 모듈이름

현재 프로젝트 하위에 node_module 폴더를 만들어 해당 모듈을 설치한다. –save이나 –save-dev를 뒤에 붙이게 되면 package.json에도 설치하는 패키지를 같이 추가시켜준다. 프로젝트 디렉토리에서 단순히 npm install만 입력하게 되면 package.json에서

React Native 시작하기 – 설치

부제 : 자바스크립트로 아이폰과 안드로이드 네이티브 앱 동시에 만들기 글쓰는 시점의 React Native의 버전은 Mac OS X에서 구동을 합니다. (곧 릴리즈 될 RC버전에서 윈도우에 대한 지원이 추가될 예정입니다.) 1. Node.js 설치하기 React Native는 JavaScript로 프로그램을 작성하게 됩니다. JavaScript의 구동환경인 Node.js와

react-native init으로 새로운 프로젝트 생성시 실패할 때

$ react-native init ProjectName 위의 명령을 입력했다가 아래와 같은 상황에 마주쳤다

...

npm ERR! Darwin 13.4.0

npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install" "--save" "react-native"

npm ERR! node v4.0.0

npm ERR! npm v2.14.2

npm ERR! shasum check failed for /var/folders/zj/6kg3tgzj4tq59qkjby48f4cw0000gn/T/npm-6489-ef2af11b/registry.npmjs.org/which/-/which-1.1.2.tgz

npm ERR! Expected: 486c48af6dfecc7a7dcf9c655acf108d2dcbdf3d

npm ERR! Actual:   da39a3ee5e6b4b0d3255bfef95601890afd80709

npm ERR! From:     https://registry.npmjs.org/which/-/which-1.1.2.tgz

npmERR!

npm ERR! If you need help, you may report this error at:

npm ERR!     <https://github.com/npm/npm/issues>

npm ERR! Please include the following file with any support request:

npm ERR!     /Users/cesilphp/Downloads/react_app/npm-debug.log

`npm install --save react-native` failed

...

npm ERR! Darwin 13.4.0

npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install" "--save" "react-native"

npm ERR! node v4.0.0

npm ERR! npm v2.14.2

npm ERR! shasum check failed for /var/folders/zj/6kg3tgzj4tq59qkjby48f4cw0000gn/T/npm-6489-ef2af11b/registry.npmjs.org/which/-/which-1.1.2.tgz

npm ERR! Expected: 486c48af6dfecc7a7dcf9c655acf108d2dcbdf3d

npm ERR! Actual: da39a3ee5e6b4b0d3255bfef95601890afd80709

npm ERR! From: https://registry.npmjs.org/which/-/which-1.1.2.tgz

npmERR!

npm ERR! If you need help, you may report this error at:

npm ERR! <https://github.com/npm/npm/issues>

npm ERR! Please include the following file with any support request:

npm ERR! /Users/cesilphp/Downloads/react_app/npm-debug.log

`npm install --save react-native` failed

npm에 문제가 있었는지 아래와 같은 명령어를 실행해서 해결하였다. $ sudo chown -R $(whoami) “$HOME/.npm” $ npm -g install npm 출처 : https://github.com/npm/npm/issues/7555