Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
お盆にポータルサイトをSPAでリリースした
Search
hatappi
August 24, 2016
Technology
0
1.5k
お盆にポータルサイトをSPAでリリースした
Angular2とRails5 api modeで作成したポータルサイトの話
hatappi
August 24, 2016
Tweet
Share
More Decks by hatappi
See All by hatappi
RubyではじめるGraphQL
hatappi
0
810
RubyでChainerつくってます!!
hatappi
2
1.4k
TDDな個人開発
hatappi
0
280
できるだけ楽して楽しくRails開発しよう
hatappi
2
310
EKSにRailsをのせた
hatappi
1
1.1k
RubyとApache Arrow
hatappi
0
2.3k
Red Chainerを なぜ作って今後どうするのか
hatappi
2
2.3k
Fargateで夢は見られるのか
hatappi
1
2.1k
個人サービスをFargateに移行したよ
hatappi
1
640
Other Decks in Technology
See All in Technology
Aurora PostgreSQLがCloudWatch Logsに 出力するログの課金を削減してみる #jawsdays2025
non97
1
250
ExaDB-XSで利用されているExadata Exascaleについて
oracle4engineer
PRO
3
300
LINE NEWSにおけるバックエンド開発
lycorptech_jp
PRO
0
390
アジリティを高めるテストマネジメント #QiitaQualityForward
makky_tyuyan
1
400
手を動かしてレベルアップしよう!
maruto
0
260
AI自体のOps 〜LLMアプリの運用、AWSサービスとOSSの使い分け〜
minorun365
PRO
9
1.1k
Amazon Q Developerの無料利用枠を使い倒してHello worldを表示させよう!
nrinetcom
PRO
2
120
【内製開発Summit 2025】イオンスマートテクノロジーの内製化組織の作り方/In-house-development-summit-AST
aeonpeople
2
1.1k
Amazon Athenaから利用時のGlueのIcebergテーブルのメンテナンスについて
nayuts
0
120
サイト信頼性エンジニアリングとAmazon Web Services / SRE and AWS
ymotongpoo
7
1.9k
プルリクエストレビューを終わらせるためのチーム体制 / The Team for Completing Pull Request Reviews
nekonenene
3
1.5k
Oracle Database Technology Night #87-1 : Exadata Database Service on Exascale Infrastructure(ExaDB-XS)サービス詳細
oracle4engineer
PRO
1
220
Featured
See All Featured
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.7k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
Unsuck your backbone
ammeep
669
57k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
Typedesign – Prime Four
hannesfritz
41
2.5k
The Pragmatic Product Professional
lauravandoore
32
6.4k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.2k
Scaling GitHub
holman
459
140k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.2k
The Language of Interfaces
destraynor
156
24k
Why Our Code Smells
bkeepers
PRO
336
57k
Transcript
͓ຍʹϙʔλϧαΠτΛϦϦʔεͨ͠ 2016/08/17 @Speee LTେձ
ࣗݾհ • @hatappi (yusaku.hatanaka) • ذෞग़ • ࠷ۙAngular2Λॻ͍ͨΓRailsॻ͍ͨ Γͯ͠·͢
ੈͷதʹ͋Γ;ΕΔ֤ۀքͷϙʔλϧ αΠτ
ͳΜ͔୳͠ʹ͍͘ɾɾɾ
࡞Ζ͏ʂʂ
࡞ͬͨ!! • ͨ͠ͷ༁͋ͬͯݟͤΒΕ·ͤΜ
·ͣڝ߹ͷੳ͔Β
None
None
ٕज़બఆɹ • Rails5 api mode • Angular2.rc4 • GCP
Rails5 api mode ݩʑgemͩͬͨrails-api͕RailsʹϚʔδ͞Εͨ • helperassets, views͕ͬͦ͝Γফ͑ͯΔ • cookieͱ͔session storeͷఆٛͳ͚Εassetsͳ͍
Angular2 GoogleͷJSϑϨʔϜϫʔΫ ݩʑ͋ͬͨAngular1ͷޙܧ͕ͩޓੑ΄ͱΜͲͳ͍ͱͷ͜ͱ! ਖ਼ࣜϦϦʔε͞Ε͓ͯΒͣ࠷৽rc5 rc6͕ग़ΔΒ͍͕͠େ͖ͳΞοϓσʔτrc5ͰऴΘΓΒ͍͠
GCP • railsͱangularʹؔͯ͠GCE(AWSͰ͍ ͏EC2) • ը૾ͷ৴ʹؔͯ͠GCS(AWSͰ͍͏ ͱ͜ͷS3)ʹ͓͖ɺͦͷ··CDNͱ͠ ͯ͏ • GCElet's
encryptͰূ໌ॻΛͱͬͯɺ http/2Ͱఏڙ
ࠓճRailsͱ͍͏͔JSONΑΓͷ
Έͳ͞ΜRailsͰJSONͷϨεϙϯε Λฦ͢͜ͱ͕͋Γ·͔͢ʁ
༻్༷ʑ • ΞϓϦͱ͔Ͱ༻͢ΔAPIαʔόʔͷߏங࣌ • AJAXͰ௨৴Λ͢Δ࣌ • etc...
RFC4627,7159ʹJSONͷ༷͕͔͔Ε ͍ͯΔ • arrayͷ։࢝ʹ [ ɺऴྃʹ ] • ͷ۠Γʹ ,
• string " Ͱғ͏ • etc...
RFC4627,7159ʹJSONͷ༷͕͔͔Ε ͍ͯΔ • arrayͷ։࢝ʹ [ ɺऴྃʹ ] • ͷ۠Γʹ ,
• string " Ͱғ͏ • etc... ༷कͬͯ͋Εޙࣗ༝
/users { "result":[ { "id":1, "name":"yusaku.hatanaka" }, { "id":2, "name":"hoge.taro"
} ] }
/users { "response":{ "status":200, "users":[ { "id":1, "name":"yusaku.hatanaka" }, {
"id":2, "name":"hoge.taro" } ] } }
ϑΥʔϚοτ͕ఆ·Βͳ͍!
ϑϩϯτܹ͓͜! • API͝ͱʹϨεϙϯεͷܗ͕ࣜҟͳΔͷͰɺͦΕͧΕͰύʔαʔ Λॻ͔ͳ͍ͱ͍͚ͳ͍
ੈͷதʹJSONͷϑΥʔϚοτΛఆ Ίͨͷ͕͋Δ
HAL
{ "_links": { "self": { "href": "/comments/1" } }, "id":
1, "message": "LTେձʹࢀՃͯ͠·͢", "_embedded": { "user": { "_links": { "self": { "href": "/users/7" } }, "id": 7, "name": "yusaku.hatanaka" } } }
JSON:API
{ "data":{ "id":"1", "type":"users", "links":{ "self":"http://hoge.com/users/1" }, "attributes":{ "name":"yusaku.hatanaka" },
"relationships":{ "comments":{ "links":{ "self":"http://hoge.com/users/1/relationships/comments", "related":"http://hoge.com/users/1/comments" }, "data":{ "type":"comments", "id":"8" } } }, "included":[ { "id":"8", "type":"comments", "links":{ "self":"http://hoge.com/comments/8" }, "attributes":{ "context":"LTେձʹࢀՃͯ͠·͢" }, "relationships":{ } } ] } }
JSON:APIͱHAL • HAL • intergent draftʹೖ͍ͬͯΔ • AWSͷAPIGatewayͰ༻͞Ε͍ͯΔ࣮ • JSON:API
• error࣌ͷϨεϙϯεͳͲͷݴٴ͋Δ • ձࣾͷϓϩμΫτͰ༻͞Ε͍ͯΔ࣮ • GET͚ͩͰͳ͘ɺPOSTDELETEͳͲCRUDͷݴٴ͋Δ
ͦΕͧΕͷϑΥʔϚοτͰϨεϙϯε Λฦ͘͢͢͠Δgem͋Δ • HAL => apotonick/roar • JSON:API => cerebris/jsonapi-resources
·ͱΊ • ෳਓͰ։ൃ͢ΔࡍʹJSONͷϑΥʔϚοτΛ͖Ί͓ͯ͘ͱɺ ϑϩϯτͱྑ͘ͳΕΔʢ͔͠Εͳ͍ʣ • νʔϜͰܾΊͯྑ͍͕ɺάμάμʹͳΒͳ͍Α͏ʹ
࠷ޙʹ
None
ΞΫηε·ͩ·ͩ
index1݅ɾɾɾɾ ͜͜·༷ͩࢠݟ ͔ͨ͠͠ΒSPAͰ࡞ͬͨ͜ͱʹΑΓbot͕͏·͘ճ༡ग़དྷͯͳ͍ ͔͠Εͳ͍
໘indexΛ૿͍ͯ͘͠