Upgrade to Pro — share decks privately, control downloads, hide ads and more …

React and Redux Love Web APIs

Avatar for Ricardo Torres Ricardo Torres
April 21, 2017
Programming
0
58

React and Redux Love Web APIs

A story about how we leveraged React and Redux + Web Audio API, Web Workers, WebSockets, TypedArrays and Streams to build a Live Commentary system for our live football matches at mycujoo.tv.
Avatar for Ricardo Torres

Ricardo Torres

April 21, 2017
Tweet

More Decks by Ricardo Torres

See All by Ricardo Torres
The Road to Serverless RESTish APIs
Avatar for Ricardo Torres rictorres
2
78
WebRTC - Comunicação na web em tempo real
Avatar for Ricardo Torres rictorres
1
190
Responsive Web Design @ Semcomp 2013
Avatar for Ricardo Torres rictorres
1
160
Responsive Web Design
Avatar for Ricardo Torres rictorres
1
99

Other Decks in Programming

See All in Programming
『自分のデータだけ見せたい！』を叶える──Laravel × Casbin で複雑権限をスッキリ解きほぐす 25 分
Avatar for AkitoTsukahara akitotsukahara
2
640
AIともっと楽するE2Eテスト
Avatar for Yohei Maeda myohei
6
2.6k
初学者でも今すぐできる、Claude Codeの生産性を10倍上げるTips
Avatar for Oikon s4yuba
16
11k
「テストは愚直&&網羅的に書くほどよい」という誤解 / Test Smarter, Not Harder
Avatar for Munetoshi Ishikawa munetoshi
0
170
AI時代のソフトウェア開発を考える（2025/07版） / Agentic Software Engineering Findy 2025-07 Edition
Avatar for Takuto Wada twada
PRO
87
29k
XP, Testing and ninja testing
Avatar for seki at druby.org m_seki
3
250
たった 1 枚の PHP ファイルで実装する MCP サーバ / MCP Server with Vanilla PHP
Avatar for Shohei Okada okashoi
1
260
レベル1の開発生産性向上に取り組む − 日々の作業の効率化・自動化を通じた改善活動
Avatar for kesoji kesoji
0
220
「Cursor/Devin全社導入の理想と現実」のその後
Avatar for Ryoichi Saito saitoryc
0
820
Modern Angular with Signals and Signal Store: New Rules for Your Architecture @enterJS Advanced Angular Day 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
220
AI駆動のマルチエージェントによる業務フロー自動化の設計と実践
Avatar for 岡本秀明 h_okkah
0
150
Team operations that are not burdened by SRE
Avatar for zosokh kazatohiei
1
310

Featured

See All Featured
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k
Fireside Chat
Avatar for paigeccino paigeccino
37
3.5k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
1
430
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
35
2.4k
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
357
30k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
512
110k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
7
740
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
31
1.3k
Building Flexible Design Systems
Avatar for Yesenia Perez-Cruz yeseniaperezcruz
328
39k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
51
8.5k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
179
9.8k

Transcript

  1. React and Redux Love Web APIs Ricardo Torres mycujoo.tv

  2. None
  3. None
  4. None

  5. What we use R E A C T A N

    D R E D U X L O V E W E B A P I S

  6. R E A C T A N D R E

    D U X L O V E W E B A P I S How it works

  7. Football Live Commentary R E A C T A N

    D R E D U X L O V E W E B A P I S

  8. git init R E A C T A N D

    R E D U X L O V E W E B A P I S

  9. Media

  10. None

  11. WebRTC R E A C T A N D R

    E D U X L O V E W E B A P I S

  12. WebRTC + Safari =

  13. WebSocket + Web Audio R E A C T A

    N D R E D U X L O V E W E B A P I S

  14. Host

  15. Listener

  16. React ❤ R E A C T A N D

    R E D U X L O V E W E B A P I S
  17. None
  18. None

  19. How can we share this? R E A C T

    A N D R E D U X L O V E W E B A P I S Who needs Live Commentary?

  20. R E A C T A N D R E

    D U X L O V E W E B A P I S Live Podcast

  21. R E A C T A N D R E

    D U X L O V E W E B A P I S http://bit.ly/live-podcast

  22. R E A C T A N D R E

    D U X L O V E W E B A P I S

  23. R E A C T A N D R E

    D U X L O V E W E B A P I S

  24. Thanks✌ We're hiring! https://github.com/rictorres https://github.com/mycujoo