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.
Riot.jsを用いたWeb開発
Takusuta TechConf #1
- ライブ配信サービス作ってみた -
INTRODUCTION
自己紹介
> 2015年 CyberAgent 新卒入社
> 学生時代にサンフランシスコ少しだけ留学
> 現在、ライブ配信動画サービス「Takusuta」を立ち上げ、運用中
今井啓介 (KEISUKE IMAI) EN...
キーワード
Gulp(Browserify)
Riot(←いちおうメイン)
Flux
Isomorphic(ServerSideRendering)
JWPlayer
現在のWEBに行き着くまで
拡散でweb必要じゃね?
React + SPA でさくっと
でもこれ重くね?てかSEO弱くね?
くっそ軽くてSEO強いやつあるらしいよ
を使おう. ←今ここ
Riot
A React-like user interface micro-library
Riot
● とにかく軽い
● カスタムタグ
● Isomorphic
WEBの構成
WEBの構成
ー 通常のアクセス APIサーバー
Node
APIサーバ
配信サーバ
ブラウザからのアクセス
HTML
WEBの構成
ー Botからのアクセス
Node
APIサーバ
配信サーバ
Botからのアクセス
HTML
APIサーバー
開発環境
開発環境
ソースコードの構成
ソースコードの構成
frontend backendapp
APP
app - FrontendとBackendの共通部分
Component
Action
Store
Utility
etc...
フロントエンド
フロントエンド
backendfrontend app
フロントエンド
Flux
フロントエンド ー Flux
ほんとにシンプル
https://facebook.github.io/flux/docs/overview.html
フロントエンド
コンポーネント
フロントエンド - コンポーネント
DOM + Style + Script
フロントエンド - コンポーネント
DOM
Style
Script
フロントエンド - コンポーネント
バックエンド
バックエンド
frontend backendapp
バックエンド
APIサーバー
+
HTML配信サーバー
(Isomorphic)
バックエンド
Isomorphic
(サーバサイドレンダリング)
バックエンド - Isomorphic
Player
Player
End
Riot.jsを用いたweb開発   takusuta tech conf #1
Upcoming SlideShare
Loading in …5
×

Riot.jsを用いたweb開発 takusuta tech conf #1

20,375 views

Published on

takusuta tech conf #1 で使用したスライドです。
Riot.jsを使ったweb開発に触れています。

Published in: Engineering
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Riot.jsを用いたweb開発 takusuta tech conf #1

  1. 1. Riot.jsを用いたWeb開発 Takusuta TechConf #1 - ライブ配信サービス作ってみた -
  2. 2. INTRODUCTION 自己紹介 > 2015年 CyberAgent 新卒入社 > 学生時代にサンフランシスコ少しだけ留学 > 現在、ライブ配信動画サービス「Takusuta」を立ち上げ、運用中 今井啓介 (KEISUKE IMAI) ENGINEER 株式会社 タクスタ 15年新卒 @ imakei #js #android #node.js ...
  3. 3. キーワード Gulp(Browserify) Riot(←いちおうメイン) Flux Isomorphic(ServerSideRendering) JWPlayer
  4. 4. 現在のWEBに行き着くまで 拡散でweb必要じゃね? React + SPA でさくっと でもこれ重くね?てかSEO弱くね? くっそ軽くてSEO強いやつあるらしいよ を使おう. ←今ここ
  5. 5. Riot A React-like user interface micro-library
  6. 6. Riot ● とにかく軽い ● カスタムタグ ● Isomorphic
  7. 7. WEBの構成
  8. 8. WEBの構成 ー 通常のアクセス APIサーバー Node APIサーバ 配信サーバ ブラウザからのアクセス HTML
  9. 9. WEBの構成 ー Botからのアクセス Node APIサーバ 配信サーバ Botからのアクセス HTML APIサーバー
  10. 10. 開発環境
  11. 11. 開発環境
  12. 12. ソースコードの構成
  13. 13. ソースコードの構成 frontend backendapp
  14. 14. APP app - FrontendとBackendの共通部分 Component Action Store Utility etc...
  15. 15. フロントエンド
  16. 16. フロントエンド backendfrontend app
  17. 17. フロントエンド Flux
  18. 18. フロントエンド ー Flux ほんとにシンプル https://facebook.github.io/flux/docs/overview.html
  19. 19. フロントエンド コンポーネント
  20. 20. フロントエンド - コンポーネント DOM + Style + Script
  21. 21. フロントエンド - コンポーネント DOM Style Script
  22. 22. フロントエンド - コンポーネント
  23. 23. バックエンド
  24. 24. バックエンド frontend backendapp
  25. 25. バックエンド APIサーバー + HTML配信サーバー (Isomorphic)
  26. 26. バックエンド Isomorphic (サーバサイドレンダリング)
  27. 27. バックエンド - Isomorphic
  28. 28. Player
  29. 29. Player
  30. 30. End

×