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.
Copyright © Virtual Technology, Inc
フロントエンドエンジニアが
主役のBaaSを作った話
2017/8/5 Builderscon Tokyo 2017 ⽵嵜 伸⼀郎(@stakezaki)
1
Copyright © Virtual Technology, Inc
⽵嵜 伸⼀郎 (たけざき しんいちろう)
twitter id:stakezaki
(有)バーチャルテクノロジー代表取締役
元⽇本IBM
元株式会社暮らしのデザインCTO
...
Copyright © Virtual Technology, Inc
ビジョン
”もうフルスタックエンジニアはいらない。
HTMLとJSの知識さえあればWebサービスを
開発できる。
そのような世界を私たちは⽬指しています。”
3
Copyright © Virtual Technology, Inc
お前はいったい何と戦ってるんだ
4
• ベンダーロックイン
• マイクロサービス
/サーバレスは糞
• どうビジネスするか
Copyright © Virtual Technology, Inc
ところでBaaSは今幻滅期ですよね?
• すべてが中途半端
• 独⾃ライブラリで、
ベンダーロックイン
• 機能改善が進まず、
負の遺産を抱え込んだ状態に
• もはや胡散臭...
Copyright © Virtual Technology, Inc
BaaSはモバイルとIoT向けが多い
• mBaaS
– ユーザ管理やプッシュ通知などのスマホアプ
リに必要な機能をまるごと提供
• IoT
– IoT機器で必要となるサー...
Copyright © Virtual Technology, Inc
ベンダーロックイン
7
「落ち着いて⾃分の運命を
受け⼊れるのです
チェック・アウトは⾃由ですが
ここを⽴ち去ることは
永久にできません」
ホテル・カリフォルニアの歌詞
Copyright © Virtual Technology, Inc
淀む⽔には芥(ごみ)溜る
8
フロントエンドは変化が激しく清流が常に流れ込んでいる状態
いつでも捨てられる覚悟が必要
うかつに独⾃ライブラリを混ぜてしまうと死亡フラグが⽴つ...
Copyright © Virtual Technology, Inc
神は細部に宿る
9
ソースコードに設定情報をハードコーディングしたゴミの例
細かいことが死亡フラグになっていく
Copyright © Virtual Technology, Inc10
By ダーウィン
変化に最も対応できる
⽣き物が⽣き残る
変化に対応できなければ死あるのみ
Copyright © Virtual Technology, Inc
vte.cx (ブイテックス)
• http://admin.1.vte.cx
11
2015/12 オープンβ
Copyright © Virtual Technology, Inc
敢えてフロントエンドの世界に⾶び込む
• HTML、CSS、JavaScriptなどのコーディングだ
けで本格的なWebシステムを作れるようにした
• サーバサイドのAPI...
Copyright © Virtual Technology, Inc
徹底的にゴミを排除
• システムのモダン化
– npmエコシステム
– Webpackの利⽤
• ライブラリを提供しない
– 設定より規約(CoC)
– ⾃由に作れるAPI...
Copyright © Virtual Technology, Inc
DEMO
14
Copyright © Virtual Technology, Inc
今注⽬のサーバレス アーキテクチャー
15
API	Gateway
Lambda
Cognito SNSDynamoDB
Cloud	Front
S3
clientmobi...
Copyright © Virtual Technology, Inc
サーバレスアーキテクチャーは
Webアプリに使えるか?
16
Copyright © Virtual Technology, Inc
サーバレスどころか設定地獄
• 静的コンテンツとAPIが異なるドメイン
– CORSの設定なんか画⾯からやりたくない
– CI/CD使えないじゃん!
– あとセッション管理...
Copyright © Virtual Technology, Inc
API以外の余計なことは考えたくない
18
適当に分散して勝⼿にスケールすることを期待
これが真のサーバレスではないのか!?
Copyright © Virtual Technology, Inc
vte.cxの3つのこだわり
• バックエンドの複雑さを隠蔽
– サーバ構成の都合をクライアントに押し付けない
– Microservicesでありがちな認証などの考慮をク...
Copyright © Virtual Technology, Inc
vte.cx の主な機能
• REST APIを直感的な規約で作成できる
• ユーザ・グループ管理、ACL管理
• ソフトスキーマ
• トランザクション管理
• サーバサイ...
Copyright © Virtual Technology, Inc21
• URLをフォルダに⾒⽴てて⾃由に設定・追加可能
• リソースを様々なフォーマットに変換可能
• XML、JSON、MessagePack等などのデータ
• HTML...
Copyright © Virtual Technology, Inc22
現在このイメージを表示できません。
Copyright © Virtual Technology, Inc23
Copyright © Virtual Technology, Inc24
Copyright © Virtual Technology, Inc25
Copyright © Virtual Technology, Inc
スキーマ
• シンプルなシンタックス
– 「項⽬名(型)= 正規表現」の形式で記述
– Indexを指定可能
– 正規表現でバリデーション
• ソフトスキーマ
– 項⽬の追...
Copyright © Virtual Technology, Inc
スキーマが必須である理由
• 任意のログをDBに突っ込んで分析に使う
といった⽤途にはスキーマレスがいい
• スキーマレスはお⼿軽だが⾃由に開発し
ていると後で酷い⽬にあう...
Copyright © Virtual Technology, Inc
1枚の紙≒トランザクションスクリプトパターン
• コンピュータがない時代、全部紙だったじゃないか。
28
受付
Copyright © Virtual Technology, Inc
トランザクション管理
• Feed(紙)単位のAtomicトランザクション
– 分離レベル:REPEATABLE READ
• かつ、Entry(明細)単位のバージョン⽐較...
Copyright © Virtual Technology, Inc
トランザクション管理があるから安全
例:「鏡+明細」で1トランザクション
30
<feed>
<entry>
<id>鏡,リビジョン</id>
</entry>
<entr...
Copyright © Virtual Technology, Inc
アーキテクチャの変遷について
31
Copyright © Virtual Technology, Inc
(再)BaaSを作った動機
• フロントエンドエンジニアだけで
本格的なWebアプリを作りたい。
• phpやrubyなどのサーバサイドをなくして、
javascript等...
Copyright © Virtual Technology, Inc
l
View Service Resource
2007年頃: Microservices
ECサイトをオンプレミスでスクラッチ開発
品質最悪
スケールしない
三重苦
管理...
Copyright © Virtual Technology, Inc
乗り越えなきゃいけない課題
• 運⽤管理を楽にする
• スケーラビリティを確保
• アプリの品質向上
• 可⽤性向上
34
Copyright © Virtual Technology, Inc
いろいろやめた
• RDBをやめKVSでシャーディング
• Microservicesをやめた
• PHPをやめてSPAに
– Thin Server Architectu...
Copyright © Virtual Technology, Inc
ポイント1: スケールさせるための
シャーディング戦略
36
困難は分割せよ
By ルネ・デカルト
Copyright © Virtual Technology, Inc
View Service
2011年頃: KVSでシャーディング
スケールアウトは可能になったが、
しかし、可⽤性と運⽤で問題が発⽣!
⼤規模帳票サービスをオンプレミスで開...
Copyright © Virtual Technology, Inc38
障害発⽣時の切替処理
Copyright © Virtual Technology, Inc
ポイント2:Microservicesをやめた
• 機能が増えたらその都度サービスを⽴てるのか?
• BaaSでは論理的にサービスを追加でき⾃由にAPI
を作ることができる...
Copyright © Virtual Technology, Inc
Enough with the microservices
”⾮⼲渉化と分散を混同してはいけません。⾮⼲渉
化は、明確に定義されたモジュールで構成され明
確に定義されたイン...
Copyright © Virtual Technology, Inc
ポイント3:Thin Server Architecture
41
・・・
REST
• クライアントからRESTでサーバリソースにアクセス
• サーバからはJSONやXM...
Copyright © Virtual Technology, Inc42
増えたフロントの責務
http://www.slideshare.net/fullscreen/sagawafumio/ss-38480894/6
Copyright © Virtual Technology, Inc
2013年頃: AngularJSでSPA
ビジネスロジックを含めほとんどの実装がクライアントに集中
開発⽣産性の⾯で問題が発⽣! 特殊すぎたAngularJS
Thin ...
Copyright © Virtual Technology, Inc
結局、解決できなかった
•開発⽣産性
•可⽤性
•運⽤容易性
44
Copyright © Virtual Technology, Inc
そこで、Kubernetes !!
•無停⽌メンテナンス
•可⽤性向上
•スケールアウト
•ログ⼀元管理
45
Copyright © Virtual Technology, Inc
Twelve-Factor App
46
APをステートレスにするなど12の要素に
準拠することでクラウドネーティブ化を図る
Copyright © Virtual Technology, Inc
BFF(Backend for Frontend)の導⼊
• クライアント偏重の是正
– ⾮同期コールバック地獄に陥りがちなクライアントより
サーバで処理実⾏した⽅が有利で...
Copyright © Virtual Technology, Inc
GraphQLではなくBFFで
• GraphQLが解決しようとしていること
– クライアントからリクエストを何度も発⾏する
必要がある(N+1問題)
– 提供されているA...
Copyright © Virtual Technology, Inc
型
• 型があれば10%〜20%のバグを減らすこ
とができるとの調査結果
• サーバサイドにおける動的型付け⾔語疲れ
49
Copyright © Virtual Technology, Inc
View Service Resource
2017年: クラウドネーティブ化とBFF
オンプレからクラウドGKE(kubernetes)に移⾏(※2017/12リリース予...
Copyright © Virtual Technology, Inc
課題を解決できた!
51
Node1 Node2
コンテナ コンテナ コンテナ
サービス
本番(Blue) 検証(Green)
ログ(集約)
Datastore Cloud...
Copyright © Virtual Technology, Inc
BaaSでどのようにビジネスするか
52
Copyright © Virtual Technology, Inc
リーンスタートアップ的アプローチ
• 『作れよ、されば顧客は来たらん』は
戦略ではなく、単なる神頼みだ
53
BY	Steve	Blank
Copyright © Virtual Technology, Inc
これまでの私達
54
フレームワーク
売ってまーす。
しーん
・ ・ ・
BaaS使いません
か?
Copyright © Virtual Technology, Inc
まずお客様を⾒つけて試す
• 特定のマーケットから始める
• ⼩さなものから初める
• 製品を作って失敗したら素早く軌道修正
55
ピボットを繰り返しながら
ビジネスモデル...
Copyright © Virtual Technology, Inc
リアルのビジネス
56
⾼可⽤性・
スケーラビリティ
早いし安いよ!
受注システム
作りたいなあ
WoW!
お客様
Copyright © Virtual Technology, Inc
想定しているお客様
• ⾃社でWebサービスを⽴ち上げたい
• 開発+サービスの運⽤もまかせたい
• SaaS/パッケージ製品では機能がフィット
しない。カスタマイズできる...
Copyright © Virtual Technology, Inc
ビジネス領域
58
所有
利⽤
特化 ⼀般
SaaS
IaaS
PaaS BaaS
パッケージSI フレームワーク+
カスタマイズ
オンプレミス
クラウド
• 圧倒的な パ...
Copyright © Virtual Technology, Inc
• Speed
– 早期にリリース
• Small Start
– 初期投資を抑える
• Scale Out
– 事業の成⻑に応じて拡⼤
• Seamless & DevO...
Copyright © Virtual Technology, Inc
まとめ
• フロントエンドエンジニアが主役になるためには
バックエンドを意識させないことが重要
– ロックインを避けJSのエコシステムを最⼤限活⽤する
– サーバレスアーキ...
Copyright © Virtual Technology, Inc
ここまでの話は
はっきりいってつまらない
61
早いし安いよ!
って売るのは邪道!
本質を⾒失ってる
Copyright © Virtual Technology, Inc
ドン・キホーテが戦っている本当の敵
• エンジニアの既存の⽂化と超えられない壁
– フロントエンドエンジニア
にサーバサイドを引き受け
させることの⼤変さ
– サーバサイド...
Copyright © Virtual Technology, Inc
ビジョン
”もうフルスタックエンジニアはいらない。
HTMLとJSの知識さえあればWebサービスを
開発できる。
そのような世界を私たちは⽬指しています。”
63
Copyright © Virtual Technology, Inc
8/23 React 勉強会やります!
https://vtecx.connpass.com/event/63341/
64
Copyright © Virtual Technology, Inc65
support@virtual-tech.net
パートナー募集中!
開発案件ください!
早いし安いよ!
Upcoming SlideShare
Loading in …5
×

of

Builderscon Tokyo 2017  Slide 1 Builderscon Tokyo 2017  Slide 2 Builderscon Tokyo 2017  Slide 3 Builderscon Tokyo 2017  Slide 4 Builderscon Tokyo 2017  Slide 5 Builderscon Tokyo 2017  Slide 6 Builderscon Tokyo 2017  Slide 7 Builderscon Tokyo 2017  Slide 8 Builderscon Tokyo 2017  Slide 9 Builderscon Tokyo 2017  Slide 10 Builderscon Tokyo 2017  Slide 11 Builderscon Tokyo 2017  Slide 12 Builderscon Tokyo 2017  Slide 13 Builderscon Tokyo 2017  Slide 14 Builderscon Tokyo 2017  Slide 15 Builderscon Tokyo 2017  Slide 16 Builderscon Tokyo 2017  Slide 17 Builderscon Tokyo 2017  Slide 18 Builderscon Tokyo 2017  Slide 19 Builderscon Tokyo 2017  Slide 20 Builderscon Tokyo 2017  Slide 21 Builderscon Tokyo 2017  Slide 22 Builderscon Tokyo 2017  Slide 23 Builderscon Tokyo 2017  Slide 24 Builderscon Tokyo 2017  Slide 25 Builderscon Tokyo 2017  Slide 26 Builderscon Tokyo 2017  Slide 27 Builderscon Tokyo 2017  Slide 28 Builderscon Tokyo 2017  Slide 29 Builderscon Tokyo 2017  Slide 30 Builderscon Tokyo 2017  Slide 31 Builderscon Tokyo 2017  Slide 32 Builderscon Tokyo 2017  Slide 33 Builderscon Tokyo 2017  Slide 34 Builderscon Tokyo 2017  Slide 35 Builderscon Tokyo 2017  Slide 36 Builderscon Tokyo 2017  Slide 37 Builderscon Tokyo 2017  Slide 38 Builderscon Tokyo 2017  Slide 39 Builderscon Tokyo 2017  Slide 40 Builderscon Tokyo 2017  Slide 41 Builderscon Tokyo 2017  Slide 42 Builderscon Tokyo 2017  Slide 43 Builderscon Tokyo 2017  Slide 44 Builderscon Tokyo 2017  Slide 45 Builderscon Tokyo 2017  Slide 46 Builderscon Tokyo 2017  Slide 47 Builderscon Tokyo 2017  Slide 48 Builderscon Tokyo 2017  Slide 49 Builderscon Tokyo 2017  Slide 50 Builderscon Tokyo 2017  Slide 51 Builderscon Tokyo 2017  Slide 52 Builderscon Tokyo 2017  Slide 53 Builderscon Tokyo 2017  Slide 54 Builderscon Tokyo 2017  Slide 55 Builderscon Tokyo 2017  Slide 56 Builderscon Tokyo 2017  Slide 57 Builderscon Tokyo 2017  Slide 58 Builderscon Tokyo 2017  Slide 59 Builderscon Tokyo 2017  Slide 60 Builderscon Tokyo 2017  Slide 61 Builderscon Tokyo 2017  Slide 62 Builderscon Tokyo 2017  Slide 63 Builderscon Tokyo 2017  Slide 64 Builderscon Tokyo 2017  Slide 65
Upcoming SlideShare
BPStudy20121221
Next
Download to read offline and view in fullscreen.

0 Likes

Share

Download to read offline

Builderscon Tokyo 2017

Download to read offline

Buildersconの資料です。(8/5 14:10- C フロントエンドエンジニアが主役のBaaSを作った話)

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to like this

Builderscon Tokyo 2017

  1. 1. Copyright © Virtual Technology, Inc フロントエンドエンジニアが 主役のBaaSを作った話 2017/8/5 Builderscon Tokyo 2017 ⽵嵜 伸⼀郎(@stakezaki) 1
  2. 2. Copyright © Virtual Technology, Inc ⽵嵜 伸⼀郎 (たけざき しんいちろう) twitter id:stakezaki (有)バーチャルテクノロジー代表取締役 元⽇本IBM 元株式会社暮らしのデザインCTO 2 この頃、Webサービス の啓蒙活動やっていた おめでとう!
  3. 3. Copyright © Virtual Technology, Inc ビジョン ”もうフルスタックエンジニアはいらない。 HTMLとJSの知識さえあればWebサービスを 開発できる。 そのような世界を私たちは⽬指しています。” 3
  4. 4. Copyright © Virtual Technology, Inc お前はいったい何と戦ってるんだ 4 • ベンダーロックイン • マイクロサービス /サーバレスは糞 • どうビジネスするか
  5. 5. Copyright © Virtual Technology, Inc ところでBaaSは今幻滅期ですよね? • すべてが中途半端 • 独⾃ライブラリで、 ベンダーロックイン • 機能改善が進まず、 負の遺産を抱え込んだ状態に • もはや胡散臭いものと思われている 5
  6. 6. Copyright © Virtual Technology, Inc BaaSはモバイルとIoT向けが多い • mBaaS – ユーザ管理やプッシュ通知などのスマホアプ リに必要な機能をまるごと提供 • IoT – IoT機器で必要となるサーバ側の仕組みをま るごと提供 6
  7. 7. Copyright © Virtual Technology, Inc ベンダーロックイン 7 「落ち着いて⾃分の運命を 受け⼊れるのです チェック・アウトは⾃由ですが ここを⽴ち去ることは 永久にできません」 ホテル・カリフォルニアの歌詞
  8. 8. Copyright © Virtual Technology, Inc 淀む⽔には芥(ごみ)溜る 8 フロントエンドは変化が激しく清流が常に流れ込んでいる状態 いつでも捨てられる覚悟が必要 うかつに独⾃ライブラリを混ぜてしまうと死亡フラグが⽴つ BaaSのライブラリは簡単に更新できないし捨てられない
  9. 9. Copyright © Virtual Technology, Inc 神は細部に宿る 9 ソースコードに設定情報をハードコーディングしたゴミの例 細かいことが死亡フラグになっていく
  10. 10. Copyright © Virtual Technology, Inc10 By ダーウィン 変化に最も対応できる ⽣き物が⽣き残る 変化に対応できなければ死あるのみ
  11. 11. Copyright © Virtual Technology, Inc vte.cx (ブイテックス) • http://admin.1.vte.cx 11 2015/12 オープンβ
  12. 12. Copyright © Virtual Technology, Inc 敢えてフロントエンドの世界に⾶び込む • HTML、CSS、JavaScriptなどのコーディングだ けで本格的なWebシステムを作れるようにした • サーバサイドのAPI (API設計とスキーマ)もフロ ントエンドエンジニアが⾃由に作れるようにした • JavaScriptのエコシステムを採⽤することでロッ クインを排除した(独⾃ライブラリを提供しない) 12
  13. 13. Copyright © Virtual Technology, Inc 徹底的にゴミを排除 • システムのモダン化 – npmエコシステム – Webpackの利⽤ • ライブラリを提供しない – 設定より規約(CoC) – ⾃由に作れるAPI • ソースコードには設定を 書かせない – ソースコードと設定を分離 13 清流に戻せ!
  14. 14. Copyright © Virtual Technology, Inc DEMO 14
  15. 15. Copyright © Virtual Technology, Inc 今注⽬のサーバレス アーキテクチャー 15 API Gateway Lambda Cognito SNSDynamoDB Cloud Front S3 clientmobile client だ、⼤丈夫かなあ!?
  16. 16. Copyright © Virtual Technology, Inc サーバレスアーキテクチャーは Webアプリに使えるか? 16
  17. 17. Copyright © Virtual Technology, Inc サーバレスどころか設定地獄 • 静的コンテンツとAPIが異なるドメイン – CORSの設定なんか画⾯からやりたくない – CI/CD使えないじゃん! – あとセッション管理どうすんの? • サービス利⽤には認証が必要 – CognitoのSecurity Token Service で設定 • サーバレスなのにサーバの設定が必要って どういうこと? 17
  18. 18. Copyright © Virtual Technology, Inc API以外の余計なことは考えたくない 18 適当に分散して勝⼿にスケールすることを期待 これが真のサーバレスではないのか!?
  19. 19. Copyright © Virtual Technology, Inc vte.cxの3つのこだわり • バックエンドの複雑さを隠蔽 – サーバ構成の都合をクライアントに押し付けない – Microservicesでありがちな認証などの考慮をクライア ントにさせない • Webアプリのことだけに集中させる – 重要なのはAPIとスキーマ設計(+ACL) – 静的コンテンツを含めSame Originで管理する • ローカル開発環境やCI/CD環境を提供 – JavaScriptエコシステムを利⽤したローカル開発環境 – 複数のブランチに対応したサービスを⾃由に作成可能 – CircleCIなどによる⾃動デプロイ 19
  20. 20. Copyright © Virtual Technology, Inc vte.cx の主な機能 • REST APIを直感的な規約で作成できる • ユーザ・グループ管理、ACL管理 • ソフトスキーマ • トランザクション管理 • サーバサイドJavaScript • EXCEL、PDF帳票出⼒機能 KVS Web スマホ オンライントランザクション処理 データ分析 ※2018年リリース予定
  21. 21. Copyright © Virtual Technology, Inc21 • URLをフォルダに⾒⽴てて⾃由に設定・追加可能 • リソースを様々なフォーマットに変換可能 • XML、JSON、MessagePack等などのデータ • HTMLやCSS、JavaScript、PDF、画像などの静的コンテンツ REST APIと直感的な規約
  22. 22. Copyright © Virtual Technology, Inc22 現在このイメージを表示できません。
  23. 23. Copyright © Virtual Technology, Inc23
  24. 24. Copyright © Virtual Technology, Inc24
  25. 25. Copyright © Virtual Technology, Inc25
  26. 26. Copyright © Virtual Technology, Inc スキーマ • シンプルなシンタックス – 「項⽬名(型)= 正規表現」の形式で記述 – Indexを指定可能 – 正規表現でバリデーション • ソフトスキーマ – 項⽬の追加が可能 – 運⽤中でも変更可 26
  27. 27. Copyright © Virtual Technology, Inc スキーマが必須である理由 • 任意のログをDBに突っ込んで分析に使う といった⽤途にはスキーマレスがいい • スキーマレスはお⼿軽だが⾃由に開発し ていると後で酷い⽬にあう • そもそもモデルを設計しないと業務アプ リは作れない • パフォーマンス向上やスケーラブルにす る為にはやはりスキーマ設計が必要 27
  28. 28. Copyright © Virtual Technology, Inc 1枚の紙≒トランザクションスクリプトパターン • コンピュータがない時代、全部紙だったじゃないか。 28 受付
  29. 29. Copyright © Virtual Technology, Inc トランザクション管理 • Feed(紙)単位のAtomicトランザクション – 分離レベル:REPEATABLE READ • かつ、Entry(明細)単位のバージョン⽐較 – 分離レベル:SNAPSHOT ISOLATION – 全てのEntryはURLとリビジョンで管理される – リビジョン=更新されると+1される 29 https://www.facebook.com/notes/virtual-technology/ bdbトランザクションとreflexworksの処理について/486790368009209 データの⼀貫性を確保しつつ⾼いスループットを実現 詳細:
  30. 30. Copyright © Virtual Technology, Inc トランザクション管理があるから安全 例:「鏡+明細」で1トランザクション 30 <feed> <entry> <id>鏡,リビジョン</id> </entry> <entry> <id>明細1,リビジョン</id> </entry> <entry> <id>明細2,リビジョン</id> </entry> ・・・・ </feed> 鏡 明細
  31. 31. Copyright © Virtual Technology, Inc アーキテクチャの変遷について 31
  32. 32. Copyright © Virtual Technology, Inc (再)BaaSを作った動機 • フロントエンドエンジニアだけで 本格的なWebアプリを作りたい。 • phpやrubyなどのサーバサイドをなくして、 javascript等のフロントエンド技術だけで webアプリケーションを作れないか? 32
  33. 33. Copyright © Virtual Technology, Inc l View Service Resource 2007年頃: Microservices ECサイトをオンプレミスでスクラッチ開発 品質最悪 スケールしない 三重苦 管理が⼤変
  34. 34. Copyright © Virtual Technology, Inc 乗り越えなきゃいけない課題 • 運⽤管理を楽にする • スケーラビリティを確保 • アプリの品質向上 • 可⽤性向上 34
  35. 35. Copyright © Virtual Technology, Inc いろいろやめた • RDBをやめKVSでシャーディング • Microservicesをやめた • PHPをやめてSPAに – Thin Server Architecture 35
  36. 36. Copyright © Virtual Technology, Inc ポイント1: スケールさせるための シャーディング戦略 36 困難は分割せよ By ルネ・デカルト
  37. 37. Copyright © Virtual Technology, Inc View Service 2011年頃: KVSでシャーディング スケールアウトは可能になったが、 しかし、可⽤性と運⽤で問題が発⽣! ⼤規模帳票サービスをオンプレミスで開発、50万伝票1/⽇、600TPS Resource KVS
  38. 38. Copyright © Virtual Technology, Inc38 障害発⽣時の切替処理
  39. 39. Copyright © Virtual Technology, Inc ポイント2:Microservicesをやめた • 機能が増えたらその都度サービスを⽴てるのか? • BaaSでは論理的にサービスを追加でき⾃由にAPI を作ることができる。それで⼗分では? 39 “ソフトウェアシステムの⼤多数は、 単⼀のモノリシックアプリケーション として構築されるべきである” by Martin Fowler
  40. 40. Copyright © Virtual Technology, Inc Enough with the microservices ”⾮⼲渉化と分散を混同してはいけません。⾮⼲渉 化は、明確に定義されたモジュールで構成され明 確に定義されたインターフェースを有するモノリ スを持つことで実現できますし、そうするべきで す。明確なインターフェースを有するモジュール を持つことで実現できる⾮⼲渉化の恩恵を得るが ためにアプリケーションを別個のサービスとして 分散する必要はないのです。” 40 (http://postd.cc/enough-with-the-microservices/) by Adam Drake 各モジュールは⾮⼲渉化してむしろ結合させた⽅がいい
  41. 41. Copyright © Virtual Technology, Inc ポイント3:Thin Server Architecture 41 ・・・ REST • クライアントからRESTでサーバリソースにアクセス • サーバからはJSONやXMLのデータを返すのみ データ
  42. 42. Copyright © Virtual Technology, Inc42 増えたフロントの責務 http://www.slideshare.net/fullscreen/sagawafumio/ss-38480894/6
  43. 43. Copyright © Virtual Technology, Inc 2013年頃: AngularJSでSPA ビジネスロジックを含めほとんどの実装がクライアントに集中 開発⽣産性の⾯で問題が発⽣! 特殊すぎたAngularJS Thin Server Architecture+SPAで業務システムを構築 サービスはほとんど 実装していない View Service Resource KVS
  44. 44. Copyright © Virtual Technology, Inc 結局、解決できなかった •開発⽣産性 •可⽤性 •運⽤容易性 44
  45. 45. Copyright © Virtual Technology, Inc そこで、Kubernetes !! •無停⽌メンテナンス •可⽤性向上 •スケールアウト •ログ⼀元管理 45
  46. 46. Copyright © Virtual Technology, Inc Twelve-Factor App 46 APをステートレスにするなど12の要素に 準拠することでクラウドネーティブ化を図る
  47. 47. Copyright © Virtual Technology, Inc BFF(Backend for Frontend)の導⼊ • クライアント偏重の是正 – ⾮同期コールバック地獄に陥りがちなクライアントより サーバで処理実⾏した⽅が有利であることに気づく • Thin Server Architectureを⾒直し – サーバサイドの開発はやはり必要 – Server Side Javascriptでビジネスロジック記述 • Isomorphic(Universal) – SSR、動的PDF出⼒ – ただしNode.jsは使わない 47 例えば、 鏡と明細の マージ編集
  48. 48. Copyright © Virtual Technology, Inc GraphQLではなくBFFで • GraphQLが解決しようとしていること – クライアントからリクエストを何度も発⾏する 必要がある(N+1問題) – 提供されているAPIが不⼗分だと、クライアント 側でテーブル結合する必要があるなど • そもそもAPI変更コストが⼤きいという前提がまずい – サーバ側の変更は基本的に⼤変なのでAPIはなるべく変更した くないという背景 – APIは最⼤公約数的なものになってしまいがち 48 結局はクライアントで頑張る発想から超えられないGraphQL ⼀⽅、柔軟にAPIを作成でき、かつ、開発コストも低い BFF(ServersideJS)があればGraphQLは不要ではないか!?
  49. 49. Copyright © Virtual Technology, Inc 型 • 型があれば10%〜20%のバグを減らすこ とができるとの調査結果 • サーバサイドにおける動的型付け⾔語疲れ 49
  50. 50. Copyright © Virtual Technology, Inc View Service Resource 2017年: クラウドネーティブ化とBFF オンプレからクラウドGKE(kubernetes)に移⾏(※2017/12リリース予定) 独⾃KVSをDatastoreなどのマネージドサービスに変更 JSON/XML MessagePack Datastore GCS Google Container Engine(GKE)
  51. 51. Copyright © Virtual Technology, Inc 課題を解決できた! 51 Node1 Node2 コンテナ コンテナ コンテナ サービス 本番(Blue) 検証(Green) ログ(集約) Datastore CloudStorage • 可⽤性の向上、さらにCI/CD(DevOps)の導⼊ • スケーラビリティ確保 • ⽣産性とパフォーマンス向上
  52. 52. Copyright © Virtual Technology, Inc BaaSでどのようにビジネスするか 52
  53. 53. Copyright © Virtual Technology, Inc リーンスタートアップ的アプローチ • 『作れよ、されば顧客は来たらん』は 戦略ではなく、単なる神頼みだ 53 BY Steve Blank
  54. 54. Copyright © Virtual Technology, Inc これまでの私達 54 フレームワーク 売ってまーす。 しーん ・ ・ ・ BaaS使いません か?
  55. 55. Copyright © Virtual Technology, Inc まずお客様を⾒つけて試す • 特定のマーケットから始める • ⼩さなものから初める • 製品を作って失敗したら素早く軌道修正 55 ピボットを繰り返しながら ビジネスモデルを探していく
  56. 56. Copyright © Virtual Technology, Inc リアルのビジネス 56 ⾼可⽤性・ スケーラビリティ 早いし安いよ! 受注システム 作りたいなあ WoW! お客様
  57. 57. Copyright © Virtual Technology, Inc 想定しているお客様 • ⾃社でWebサービスを⽴ち上げたい • 開発+サービスの運⽤もまかせたい • SaaS/パッケージ製品では機能がフィット しない。カスタマイズできるものがほしい 57 これって 機能追加できる? お客様 はい、 すぐにできます。 vte.cx開発者 BaaS
  58. 58. Copyright © Virtual Technology, Inc ビジネス領域 58 所有 利⽤ 特化 ⼀般 SaaS IaaS PaaS BaaS パッケージSI フレームワーク+ カスタマイズ オンプレミス クラウド • 圧倒的な パフォーマンス+スケーラビリティ を 低価格 で提供 • SaaSでは対応できない 特定顧客向けソリューション を素早く提供
  59. 59. Copyright © Virtual Technology, Inc • Speed – 早期にリリース • Small Start – 初期投資を抑える • Scale Out – 事業の成⻑に応じて拡⼤ • Seamless & DevOps – リリース後も継続的に改善 59 BaaSがもたらす4つのS
  60. 60. Copyright © Virtual Technology, Inc まとめ • フロントエンドエンジニアが主役になるためには バックエンドを意識させないことが重要 – ロックインを避けJSのエコシステムを最⼤限活⽤する – サーバレスアーキテクチャ、Microservicesは糞 • 運⽤管理やスケーラビリティ、⾼可⽤性などの課 題をkubernetesで解決 • サーバサイド(BFF)の再評価 – クライアントと同じJS技術 (Isomorphic)、型重要! • リーンスタートアップ的アプローチでビジネスモ デルを開拓。BaaSを活かした特定ソリューション 60
  61. 61. Copyright © Virtual Technology, Inc ここまでの話は はっきりいってつまらない 61 早いし安いよ! って売るのは邪道! 本質を⾒失ってる
  62. 62. Copyright © Virtual Technology, Inc ドン・キホーテが戦っている本当の敵 • エンジニアの既存の⽂化と超えられない壁 – フロントエンドエンジニア にサーバサイドを引き受け させることの⼤変さ – サーバサイドエンジニアは フロントエンド技術だけで すべてを置き換えようとは 思わない 私達の⽬指す世界感は到底、受け⼊れられない この敵を倒すというのが王道ではないのか!? 62
  63. 63. Copyright © Virtual Technology, Inc ビジョン ”もうフルスタックエンジニアはいらない。 HTMLとJSの知識さえあればWebサービスを 開発できる。 そのような世界を私たちは⽬指しています。” 63
  64. 64. Copyright © Virtual Technology, Inc 8/23 React 勉強会やります! https://vtecx.connpass.com/event/63341/ 64
  65. 65. Copyright © Virtual Technology, Inc65 support@virtual-tech.net パートナー募集中! 開発案件ください! 早いし安いよ!

Buildersconの資料です。(8/5 14:10- C フロントエンドエンジニアが主役のBaaSを作った話)

Views

Total views

5,217

On Slideshare

0

From embeds

0

Number of embeds

4,264

Actions

Downloads

1

Shares

0

Comments

0

Likes

0

×