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

ブラウザで一緒に音楽をつくる

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on.
Avatar for nishaya nishaya
March 30, 2018

 ブラウザで一緒に音楽をつくる

オンライン同期可能なシーケンサーを作る話

Avatar for nishaya

nishaya

March 30, 2018
Tweet

More Decks by nishaya

Other Decks in Technology

Transcript

  1. લճ·Ͱͷ͋Β͢͡ γϯηαΠβʔΛ࡞ͬͨ1-1 - ϒϥ΢βͰԻΛ໐Β͢ - ՝୊: Web Audio APIͷ੍ޚʹReact/ ReduxΛ࢖͏

    1-1 ReactͰγϯηαΠβʔΛ࡞ͬͨ࿩ - Speee DEVELOPER BLOG h4p:/ /tech.speee.jp/entry/2017/04/06/100000 3
  2. લճ·Ͱͷ͋Β͢͡ ύλʔϯγʔέϯα΋࡞ͬͨ1-2 - ϒϥ΢βʹԻָΛԋ૗͍ͤͨ͞ - ͍ͭͰʹαϯϓϥʔΛ಺ଂͨ͠ - ՝୊: λΠϛϯά੍ޚ 1-2

    ReactͰύλʔϯγʔέϯαΛ࡞ͬͨ࿩ - Speee DEVELOPER BLOG h5p:/ /tech.speee.jp/entry/2017/10/26/105100 4
  3. 11

  4. Cluod Firestore • ۂσʔλͷอଘઌ͸Cloud Firestore(2018/03/30࣌఺Ͱ͸ϕʔ λ൛) • ࠷ۙFirebaseʹ௥Ճ͞ΕͨɺReal9me Databaseʹ୅ΘΔ৽͍͠ σʔλϕʔε2-1

    2-1 σʔλϕʔεΛબ୒: Cloud Firestore ·ͨ͸ Real3me Database | Firebase h9ps:/ /firebase.google.com/docs/database/rtdb-vs-firestore 12
  5. Op#mis#c Updates • Firestore documentʹsnapshot listener Ληοτ • UIૢ࡞Λى఺ʹdocumentΛߋ৽ •

    onSnapshotͷίʔϧόοΫͰReduxͷ stateΛߋ৽ • componentͷpropsʹมߋ͕఻೻ • શ͕ͯऴΘͬͨޙɺඇಉظʹόοΫΤ ϯυ͕update͞ΕΔ 17
  6. 19