Vtecx20151216

Copyright © Virtual Technology, Inc
フロントエンドエンジニアの価値を⾼める
BaaS(vte.cx)
〜フロントエンドだけで作るこれからのWebシステム開発〜
2015/12/16 有限会社バーチャルテクノロジー
1

•  ⽵嵜伸⼀郎（たけざきしんいちろう）
– vte.cx概要 (約20分)
•  ⽵⼭恵悟（たけやまけいご）
– Hands OnとDEMO (約40分)
•  （有）バーチャルテクノロジー
– 分散KVSのミドルウェア(ReﬂexWorks)開発
2

BaaSを作った３つの理由
1. BaaSの現状
2. ReflexWorks
3. SPA
3

BaaS は今、幻滅期
• すべてが中途半端
• 何でもかんでもAPIにした結果、
ベンダーロックイン
• 機能改善がなかなか進まず負の遺産を抱
え込んだ状態に
• USではもはや胡散臭いものと思われてい
るらしい
4

Copyright © Virtual Technology, Inc5
⼤規模 Web帳票システム by ReﬂexWorks
　APIのスループット
７万ユーザ/日 40万伝票/日　
　６００tps !
　　※ DBはその１０倍以上

SPA(Single Page Application)とは
•  優れたUXを提供することを⽬的とする
１つのWebページで提供されるアプリケーション
–  クライアントはXHR等でサーバにリクエストし、結果
をJSONなどのデータで受取る
–  ページの再読込せずにJavaScriptで動的に更新する
6

なぜSPA?
•  サーバーでHTMLを⽣成するよりも、
クライアントで動的に画⾯を更新する⽅が効率的
•  ユーザーの操作に応じてインタラクティブに動く
リッチクライアントを実現できる
7
これってネイティブアプリ？
お客様
いいえ、Webアプリです。
開発者
SPA

増えたフロントの責務と残る課題
h5p://www.slideshare.net/fullscreen/sagawafumio/ss-38480894/6
ここをどうするか？

極めて⾃由度の⾼いBaaSの要求
• サーバサイドのAPIもフロントエンジニア
が⾃由に作れるBaaSを作れないか？
• HTML、CSS、JavaScriptなどのフロント
エンドコーディングだけでWebシステム
を作れるようにならないか？
• 中途半端ではなくちゃんとしたWebアプ
リを作れないか？
9

vte.cx (ブイテックス) engine
KVS
Web
スマホ

•  Web(スマホ)システム向けBaaS(Backend as a Service)
–  CMS(Content Management System)機能
–  トランザクションサポート
–  ユーザ・グループ管理
–  サーバサイドJavaScript
–  EXCEL⼊出⼒機能
–  PDF帳票出⼒機能
オンライントランザクション処理データ分析
※ 2016年春リリース予定

vte.cxのトランザクション管理
•  Feed(Collection)単位のAtomicトランザクション
–  分離レベル：REPEATABLE READ
•  かつ、Entry単位のバージョン⽐較
–  分離レベル：SNAPSHOT ISOLATION
–  全てのEntryはURLとリビジョンで管理される
–  リビジョン＝更新されると＋１される
11
https://www.facebook.com/notes/virtual-technology/
bdbトランザクションとreﬂexworksの処理について/486790368009209
データの⼀貫性を確保しつつ⾼いスループットを実現
詳細：

•  リソースURLを⾃由に設定・追加
•  リソースを様々なフォーマットに変換
直感的なREST API

その他
• ユーザ管理・グループ管理
• CMS機能
17
h5p://reﬂexworks.jp/documentaOon.html

サーバサイドJavaScript
• GET /s/booking などで起動
• /booking.js の doGet() が呼ばれる (CoC)
• POST、PUT、DELETEも同様
• JSの関数内部で ReflexContext.xxx(url) を実
⾏することで実際にDBを読み書きする
18

開発のイメージ
• 管理画⾯でサービスを新規作成
• vtecxblankをclone
• コンテンツをGitHubにpushすることで
サーバにデプロイ
–  もしくは、gulpコマンド⼀発
• データをREST APIで操作
ただ、これだけ。
これですべてのWebシステムを開発できる
19

管理画⾯
• http://admin.1.vte.cx
20

Vtecxblankをclone
•  https://github.com/reflexworks/vtecxblank
21

CircleCI
22
GitHubにPushすることで⾃動的にサーバにデプロイ
※ 設定方法はQiita の13日目に記載

DEMO & Handson
23

vte.cxで期待できること
• Webアプリを超短期間で開発可能
• プロトタイピングでスモールスタート
–  初期投資をかけずに短期間で効果を検証
–  とりあえず作ってみて判断
24

ビジネスの話
• Webアプリの受託開発でvte.cxを活⽤
• オンプレミスvte.cx(ReflexWorks)の販売
• 将来的にBaaS vte.cxの有償版
25

Qiita 毎⽇更新中です
h5p://qiita.com/advent-calendar/2015/vtecx?share=true

ご清聴ありがとう
ございました
Blogも書いています
ぶいてく

Vtecx20151216

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (19)

Andere mochten auch

Andere mochten auch (18)

Ähnlich wie Vtecx20151216

Ähnlich wie Vtecx20151216 (20)

Mehr von Shinichiro Takezaki

Mehr von Shinichiro Takezaki (7)

Vtecx20151216