2014-09-27 ぼくのかんがえた さいきょうの angularjs+restfulアプリ 配信構成

Post on 14-Jun-2015

576 Views

Category:

Internet

4 Downloads

Preview:

Click to see full reader

TRANSCRIPT

ぼくのかんがえた さいきょうの

AngularJS+RESTfulアプリ 配信構成

2014年 9月27日 JAWS-UG沖縄 株式会社ディーワークス 西島

@k_nishijima

@k_nishijima http://about.me/k15a

あんた誰?

西島 幸一郎 / にしじま こういちろう

株式会社ディー・ワークス JAWS−UG沖縄の副代表

AWS 認定ソリューションアーキテクト

AWSサムライ2014拝命

@k_nishijima http://about.me/k15a

Twitterのハッシュタグ #jawsug

JAWS-UGのハッシュタグ

「#jawsug」

を付けてつぶやきましょう!

資料は後で公開します。

@k_nishijima http://about.me/k15a

当LTで話すこと

AngularJSを使ったアプリケーションの システム構成/配信方法を考えてみる。

※使い方なんかはきっと 別のLTでフォローしてくださるはずw

@k_nishijima http://about.me/k15a

AngularJS自体の勉強には

AngularJSリファレンスがオススメ。

今日持ってきてますので読んでみてください。

@k_nishijima http://about.me/k15a

AngularJS実戦投入例

https://www.connectbass.com/

Web問い合わせフォームのSaaS

GoogleAppsによる顧客情報共有

カスタマーサポートデスク

モバイル、タブレット、PCどれでも使える

@k_nishijima http://about.me/k15a

AngularJSのアプリケーション構成

HTML

JavaScript

CSS

image

AppServerHTTP(S)

Browser

@k_nishijima http://about.me/k15a

AngularJSのアプリケーション構成

HTML

JavaScript

CSS

image

AppServerHTTP(S)

Browser

えっ、今どきみんなこうでしょ??

@k_nishijima http://about.me/k15a

AngularJSのアプリケーション構成

HTML

JavaScript

CSS

image

AppServerHTTP(S)

Browser

まあ、そうなんだけどねorz

@k_nishijima http://about.me/k15a

AngularJSのアプリケーション構成

HTML

JavaScript

CSS

image

AppServerHTTP(S)

Browser

HTMLはテンプレートとして配信され、JavaScriptがレンダリングする

= サーバ側でビューは作らない

ってのがキモ。

@k_nishijima http://about.me/k15a

とにかくフロントがfatに

minifyもモチロンするんだけどね・・・

配信するファイルが大量

配信するファイルは全て静的

AngularJSのアプリケーション構成

@k_nishijima http://about.me/k15a

JavaScriptアプリの更新を加味しつつ高速配信

Gradleでidファイル名付きでビルド

CDN経由で配信

サーバはRESTっぽくてイミュータブルがいい

Dockerでデプロイするか・・・

では、どうやって配信するか

@k_nishijima http://about.me/k15a

フロントエンド

AngularJS + レスポンシブデザイン

バックエンド

Vert.x on Elastic Beanstalk

システム構成

@k_nishijima http://about.me/k15a

では おまちかねの システム構成図

@k_nishijima http://about.me/k15a

システム概要

@k_nishijima http://about.me/k15a

システム概要

キャッシュヘッダ調整

パススルー したり

しなかったり

Beanstalkによる ブルーグリーンデプロイ

共通サービスは VPCピアリングで 全システム共通

APサーバは Vert.xで爆速

ビルドはgradle デプロイは

Dockerfileとアプリを git aws.push

非同期JobWorkerも ebで管理

@k_nishijima http://about.me/k15a

細かく話しだすとこれだけで ご飯3杯行ける(違

!

が、今日はLTなので こんなところで。

@k_nishijima http://about.me/k15a

告知!#MA10 Mashup Hackathon 沖縄http://mashupawards.doorkeeper.jp/events/13546

10月12日(日)~13日(月) Mashup Awards10(MA10)の一次予選免除の権利をかけたハッカソンイベント。様々なAPIをマッシュアップするだけでも楽しい!

商品がとても豪華らしい!!

@k_nishijima http://about.me/k15a

告知!JAWS-UG沖縄 CMS祭り http://jaws-ug.jp/es/jaws-ug-okinawa-201410/

10月17日(金)~18日(土)WordPress/Movable Type/Drupalコミュニティ・ベンダーが沖縄に集合!前夜祭+勉強会+ビーチパーティ!!

ノベルティ争奪じゃんけん大会ありますので、是非!

@k_nishijima http://about.me/k15a

ありがとうございました!

top related