Post List

2016년 10월 18일 화요일

Walmart Electrode 시작하기 #02

1. Yeoman 과 Electrode Generator 설치하기

binrang@localhost ~]$ sudo npm install -g yo gulp generator-electrode
[sudo] password for binrang:
npm WARN deprecated cross-spawn-async@2.2.4: cross-spawn no longer requires a build toolchain, use it instead!
npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated minimatch@0.2.14: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated graceful-fs@1.2.3: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it in the tree.
npm WARN deprecated npmconf@2.1.2: this package has been reintegrated into npm and is now out of date with respect to npm
/usr/bin/gulp -> /usr/lib/node_modules/gulp/bin/gulp.js
/usr/bin/yo -> /usr/lib/node_modules/yo/lib/cli.js
/usr/bin/yo-complete -> /usr/lib/node_modules/yo/lib/completion/index.js

....
> yo@1.8.5 postinstall /usr/lib/node_modules/yo
> yodoctor

....
Everything looks all right!
/usr/lib
├─┬ generator-electrode@1.2.0
│ ├─┬ chalk@1.1.3
....
    ├─┬ taketalk@1.0.0
    │ ├── get-stdin@4.0.1
    │ └── minimist@1.2.0
    └── wrap-ansi@2.0.0


2. Electrode App 을 생성하기 위해 디렉토리를 만든 후 yo를 이용하여 프로젝트를 생성한다.

[binrang@localhost ~]$ mkdir ex-electrode-app
[binrang@localhost ~]$ cd ex-electrode-app/
[binrang@localhost ex-electrode-app]$ yo electrode
? ==========================================================================
We're constantly looking for ways to make yo better! 
May we anonymously report usage statistics to improve the tool over time? 
More info: https://github.com/yeoman/insight & http://yeoman.io
========================================================================== Yes

     _-----_     ╭──────────────────────────╮
    |       |    │      Welcome to the      │
    |--(o)--|    │ phenomenal Electrode App │
   `---------´   │        generator!        │
    ( _´U`_ )    ╰──────────────────────────╯
    /___A___\   /
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

? Application Name ex-electrode-app
? Description my first electrode app!!
? Project homepage url 
? Author's Name binrang
? Author's Email binrang@***.***
? Author's Homepage 
? Package keywords (comma to split) 
? GitHub username or organization *****
? Which license do you want to use? (Use arrow keys)
❯ Apache 2.0 
  MIT 
  Unlicense 
  FreeBSD 
  NewBSD 
  Internet Systems Consortium (ISC) 
  No License (Copyrighted) 

   create package.json
   create README.md
   create .editorconfig
   create .gitattributes
   create .gitignore
   create .babelrc
   create gulpfile.js
   create client/actions/index.jsx
   create client/app.jsx
   create client/components/home.jsx
   create client/reducers/index.jsx
   create client/routes.jsx
   create client/styles/base.css
   create config/default.json
   create config/development.json
   create config/production.js
   create config/production.json
   create server/index.js
   create test/client/components/home.spec.jsx
   create .travis.yml
   create LICENSE
   create server/plugins/webapp/index.html
   create server/plugins/webapp/index.js
   create server/views/index-view.js


I'm all done. Running npm install for you to install the required dependencies. 
If this fails, try running the command yourself.

npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated minimatch@0.2.14: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated graceful-fs@1.2.3: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it in the tree.
npm WARN deprecated to-iso-string@0.0.2: to-iso-string has been deprecated, use @segment/to-iso-string instead.
npm WARN deprecated jade@0.26.3: Jade has been renamed to pug, please install the latest version of pug instead of jade
npm WARN deprecated minimatch@0.3.0: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated tough-cookie@2.2.2: ReDoS vulnerability parsing Set-Cookie https://nodesecurity.io/advisories/130

> phantomjs@1.9.20 install /home/binrang/ex-electrode-app/node_modules/phantomjs
> node install.js

PhantomJS not found on PATH
Downloading https://github.com/Medium/phantomjs/releases/download/v1.9.19/phantomjs-1.9.8-linux-x86_64.tar.bz2
Saving to /tmp/phantomjs/phantomjs-1.9.8-linux-x86_64.tar.bz2
Receiving...

....
│   ├─┬ graceful-fs@3.0.11 
│   │ └── natives@1.1.0 
│   ├─┬ strip-bom@1.0.0 
│   │ ├── first-chunk-stream@1.0.0 
│   │ └── is-utf8@0.2.1 
│   ├── through2@0.6.5 
│   └─┬ vinyl@0.4.6 
│     └── clone@0.2.0 
└── lodash@4.16.4 

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.14: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})



3. 아래 명령어를 이용하여 서버를 구동시킨다.

[binrang@localhost ex-electrode-app]$ gulp dev
[11:54:13] Using gulpfile ~/ex-electrode-app/gulpfile.js
[11:54:13] Starting 'dev'...
[11:54:13] Starting '.webpack-dev'...
[11:54:13] Finished '.webpack-dev' after 311 μs
[11:54:13] Starting 'server-dev'...
[11:54:13] Starting 'server-watch-$deps$'...
[11:54:13] Starting '.init-bundle.valid.log'...
[11:54:13] Finished '.init-bundle.valid.log' after 446 μs
[11:54:13] Finished 'server-watch-$deps$' after 2.64 ms
[11:54:13] Starting 'server-watch'...
[11:54:13] Starting 'generate-service-worker'...
[11:54:13] Finished 'generate-service-worker' after 639 μs
[nodemon] 1.11.0
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: .etmp/bundle.valid.log /home/binrang/ex-electrode-app/server/**/* /home/binrang/ex-electrode-app/config/**/*
Entry point configuration is not found, using default entry point...                                   10% 0/1 build modules http://localhost:2992/webpack-dev-server/
webpack result is served from http://localhost:2992/js/
content is served from /home/binrang/ex-electrode-app            webpack bundle is now VALID                                
webpack report is served from http://localhost:2992/reporter
[nodemon] restarting due to changes...
[nodemon] starting `node server/index.js`

Register plugins is taking a while - If this takes longer than 10 seconds, then 
double check your plugins to make sure each one calls next() at the end.

Server will automatically abort after 20 seconds.

staticPaths Plugin: static files path prefix "dist"

Hapi.js server running at http://localhost.localdomain:3000


4. 아래와 같은 웹 화면이 뜨는지 확인한다.