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.

Nodeとフロントエンド − 知っておかなければならない、今と未来の話 −

14,518 views

Published on

2015-02-17に行われた社内勉強会の内容です。

Published in: Engineering
  • いま読むと間違いだらけで恥ずかしい。大枠で言いたいことは間違えてないつもりだけど、論調も粗雑だし。でも良いスライドだなーって懐かしみながら思う
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • 5ページ目で「リアルタイム」って出てきてるのは打ち消し線が消えちゃってるんですけど、「リアルタイムは関係ないよ」ってことを言いたかったのです...。あと、jQueryとAngularは「npmから使えるよ!」ってことを言いたかっただけで、Nodeでは使えません。
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Nodeとフロントエンド − 知っておかなければならない、今と未来の話 −

  1. 1. とフロントエンド 知っておかなければならない、今と未来の話 @axross
  2. 2. 話す人 Kohei Asai @axross Trifort, Inc. UI/UX design division Client-side JS, Node, React, AngularJS, express, etc..
  3. 3. Nodeとは
  4. 4. よくある勘違い 'Node.js' === 'リアルタイムに強いJavascriptサーバサイド処理系' // false まだこんな恥ずかしい勘違いしてる人、いませんよね?
  5. 5. (それなりに) 正しい認識 'Node.js' === ‘ノンブロッキングI/Oを持つJavascript CLI実行環境' • CLI、Google V8 • シングルスレッド+イベントループ • ノンブロッキングI/O • 高い次元でのモジューラビリティ • リアルタイム (関係ない)
  6. 6. どうでもいい知識 正式名称は「Node」です When referring to the software or the project in general, it's Node.js or simply Node. It is a proper noun, so capitalize it. The .js appears with the first use, to disambiguate from other things called "Node", and Node (without the .js) afterwards. One way to think of this is that Node.js is the full name, and Node is the more familiar first name.
  7. 7. なぜ フロントエンドエンジニアでも Nodeなのか
  8. 8. なぜ フロントエンドエンジニアでも Nodeなのか • NodeのAPIやエコシステムがクライアントサイドJSで も利用できる(ようになる)ケース増えてきた • Javascriptという既知の言語によるLLとしての利用 • Isomorphic Javascriptという未来
  9. 9. Nodeのノウハウが クライアントサイドJSでも 利用できるようになる
  10. 10. require()とか、 もう使ってるでしょ? CommonJSスタイルのモジュールの仕組み
  11. 11. npmでも npmに公開されているパッケージの中には、 NodeでもクライアントサイドJSでも 同じように使えるものが増えてきた
  12. 12. ネイティブAPIすらも Stream API (Nodeでファイルの流れを扱う) クライアントサイドJSにも実装すべく、 仕様策定中とのこと。 詳しい話はまた今度..
  13. 13. LLとしての利用
  14. 14. Javascript、得意でしょ? 我々はJavascriptとともに苦しみ、 時にはMicros●ftを罵り、 いろんな苦悩の末にやってきたはず もはやJavascriptは、自分の手足のように動かせる
  15. 15. 自動化したいことは たくさんある • API叩きまくってデータを取る • Webスクレイピング、サンプルデータの作成 • 設定の整備とか • 開発環境をよしなに
  16. 16. 僕らにもできる! RubyistやPythonista、 彼らはそういうタスクをコードで行っている 何で僕たちはできないのか?できるだろ?! そう、Nodeがある!
  17. 17. Isomorphic Javascript
  18. 18. Javascript Lv.999 Javascriptはもはや、 「装飾のためのスクリプト」ではない Ajaxの流行を境に、DOMを動かす立場に そしてもはや、DOMの世界の支配者とも言える
  19. 19. MVWな クライアントサイドWAFの隆盛 Bakcbone.js, Knockout.js, Ember.js, AngularJS, Vue.js, Aurelia, React.js(ちょっと違うけど), Riot.js(ちょっと違うけど) ..
  20. 20. Javascript Application それは、 すべてのDOM操作 HTTPリクエストの取り扱い すべてをJavascriptが行い、 アプリケーションを構成する未来
  21. 21. サーバサイドもNodeだったら クライアントサイドとサーバサイドの垣根を排除 いま2つに分かれてしまっている ビジネスロジックを1つにできる 再利用性! 保守性! スケーラビリティィィ!!! 僕たちのWebは元来、そういうものだったはずだ!
  22. 22. Isomorphicな例 • ValidatorやServiceの使い回し • 同じものをrequire()するだけ • 同じロジックが別の実装で2つあるってそもそも おかしいのでは • Model層の共通化 • サーバーとクライアントでインターフェースが 統一される • SEO的なアレ • JS Applicationのサーバーサイドレンダリング
  23. 23. 未来だ!!!!!!!1111
  24. 24. もはや言い訳は許されない
  25. 25. 逃げていたら、死ぬだけ
  26. 26. GitHubのデザイナーの話 デザイナーとデベロッパーが 分かれている時代は いずれ終わる
  27. 27. GitHubのデザイナーの話 (2) 僕の中では (勝手に) 有名な話 すべてを100%できろ、とは言わない クライアントサイド80%、サーバサイド20%でもいい お互いの分野を知り合うことが大事
  28. 28. GitHubのデザイナーの話 (3) もっとコミュニケーションはしやすくなる、 もっと速く作れるようになる もっとチャレンジングで もっとエキサイティングで 価値あるプロダクトに取り組めるようになる
  29. 29. さあ、Nodeをはじめよう
  30. 30. とはいえ、 急にそんなこと 言われても困る..
  31. 31. Node ワークショップ やります!!!!!! 適当なツール作ってNodeの基礎を学ぶ 近日予定、詳細未定、他ディヴィジョン歓迎 興味のある人はご一報ください => UI/UX div. 僕 まで
  32. 32. ご清聴 ありがとうございました

×