Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

20131012 nodejs

927 views

Published on

  • Be the first to comment

  • Be the first to like this

20131012 nodejs

  1. 1. Node.js で色々(続き 茨城でべろっぱコミュニティ @morinezumiiii #ibarakidc
  2. 2. 前回のおさらい • Node.js はサーバサイド JavaScript • でもただの JavaScript じゃない • 基本的に非同期型プログラミング →コールバックネストが地獄への階段
  3. 3. 前回のおさらい • MongoDB は NoSQL のひとつ • 他の KVS などと違いドキュメント指向 型 • これが上手い具合に RDB 脳にやさしい →と思った?残念!さやk  それやると痛い目に遭う
  4. 4. 前回のおさらい • Socket.IO は Node.js モジュールで 実装出来る WebSocket • WebSocket に対応していないクソい ブラウザでも Socket.IO が吸収 • 使い方によっては jQuery.Ajax の代わり になる(けど全部置き換える必要はな い?
  5. 5. おさらい終わり
  6. 6. 前回やったこと • Node.JS をインストール • MongoDB をインストール • express.js フレームワークをインストー ル • express.js で Socket.IO を使ったチャット アプリを作った
  7. 7. が、中途半端に 終わりました 終わりました
  8. 8. 今回はその続き
  9. 9. というか出来上がったものをサックリと解説
  10. 10. 作ったもの • Node.js + express.js + Socket.IO + MongoDB で jQuery は使うけど jQueryAjax を使わないで Socket.IO だけ でリアルタイムに MongoDB へのデータ 入出力と HTML へのレンダリングが出 来るを昨日 2 時間くらいでサクッと作 ったアプリ
  11. 11.  こんなんhttps://github.com/morinezumiiii/nodejs-sample-mongoose-socketio https://github.com/morinezumiiii/nodejs-sample-mongoose-socketio
  12. 12. つまり Node.jsNode.js Socket.IOSocket.IO MongooseMongoose MongoDBMongoDB WebWeb ブラウザブラウザ Socket.IOSocket.IO HTMLHTML JadeJade ユーザ操作ユーザ操作 jQueryjQuery
  13. 13.  いいからコード 見せろや 見せろや
  14. 14. 構成 • Node.js • express.js • Socket.IO • Mongoose
  15. 15. 構成 app.js package.json public/ └javascripts/ └client.js routes/ └index.js views/ ├layout.jade └index.jade models/ └users.js node_modueles/
  16. 16. 構成 app.js ←Node.js サーバ/リクエスト/ Socket.IO package.json public/ └javascripts/ └client.js routes/ └index.js views/ ├layout.jade └index.jade models/ └users.js node_modueles/
  17. 17. 構成 app.js package.json ← ほしい物リスト public/ └javascripts/ └client.js routes/ └index.js views/ ├layout.jade └index.jade models/ └users.js node_modueles/
  18. 18. 構成 app.js package.json public/ └javascripts/ └client.js ←New! クライアント側で使用する JavaScript routes/ └index.js views/ ├layout.jade └index.jade models/ └users.js node_modueles/
  19. 19. 構成 app.js package.json public/ └javascripts/ └client.js routes/ └index.js ←app.js がリクエストをここにルーティングしてくる views/ ├layout.jade └index.jade models/ └users.js node_modueles/
  20. 20. 構成 app.js package.json public/ └javascripts/ └client.js routes/ └index.js views/ ├layout.jade ←HTML ヘッダ部分 └index.jade models/ └users.js node_modueles/
  21. 21. 構成 app.js package.json public/ └javascripts/ └client.js routes/ └index.js views/ ├layout.jade └index.jade ←HTML ボデー部分 models/ └users.js node_modueles/
  22. 22. 構成 app.js package.json public/ └javascripts/ └client.js routes/ └index.js views/ ├layout.jade └index.jade models/ └users.js ←New! Mongoose を使ってコレクションをモデル化 node_modueles/
  23. 23. やってること • クライアントから index ページが呼び出される クライアント側に jQuery と client.js と socket.io.js が読み込まれる • setDataUsers ボタンを押す → users にドキュメントを追加 • getDataUsers ボタンを押す → users からドキュメントを取得し、 HTML 形式に整形して jQuery によって HTML を書換 え
  24. 24. mongoose モデル • mongoose には Schema と Model の機能がある • Schema :コレクションがどうあるべきか定義     ドキュメント作成時に値の validate や      default 値、型チェックも可能 • Model :用意した Schema と MongoDB     コレクションを紐付けてモデル化
  25. 25. exports と require • require() : Node モジュールをロード      自分で用意した js もロード可能      ※さっきの model や lib など • exports :外部に公開したい時に使用 • 例: models/users.js で exports.Users = mongoose.model('Users', UserSchema); したもの を、 app.js などで var Users = require('./models/users.js').Users すると、 app.js 内で Users.find() が使えるようになる
  26. 26. ちなみに • Mongoose にも便利なプラグインが沢山 • 例えば、 mongoose-file(mongoose-thumbnail) MongooseSchema に Plugin として set すること で save 時に画像ファイルのアップロードと MongoDB のドキュメント内にバイナリ保存 →これ自前で作るとめんどくさい
  27. 27. どうでもいいけど • 最近ジョジョを読み始めました
  28. 28.   Thanks!

×