Your SlideShare is downloading. ×
20131012 nodejs
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

20131012 nodejs

650
views

Published on


0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
650
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

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