AbemaTV Developer Conference 2016 http://developer.abema.io/ で使用したスライドです。本編 20 分。
涪♳ך圫ղז⣛㶷ך鳞 אה'3&4)CZ"CFNB57ך鑧"CFNB57%FWFMPQFS$POGFSFODF!BIPNV"ZVNV4BUP
View Slide
ְս⣛㶷վշせ٥أ荈ո➭ךךח״ַַծח״ג䧭甧אֿהկ
‣ ـٓؐؠח㼎ׅ⣛㶷‣ 'MBTIח㼎ׅ⣛㶷‣ ٓ؎ـٓٔח㼎ׅ⣛㶷،آؑٝت
IUUQTBCFNBGSFTIUW'3&4)CZ"CFNB57
‣ *TPNPSQIJD"SDIJUFDUVSF‣ 3FBDU'MVYJCMFד443ה41"⚕甧‣ 'MBTIPS8FC垥彊䪮遭ז⹛歗فٖ؎َ٦‣ 8FC4PDLFUח״ٔ،ٕة؎يثٍحز䪮遭أةحؙ
IUUQTTQFBLFSEFDLDPNBIPNVDMJFOUTJEFPGGSFTI剢ח/PEF㷕㕦ד涪邌׃ת׃
ֿחכ!BIPNVדׅ
‣ ⡟谏娄ׁהֲ֮ײ‣ せ〢㾊ה幪靼䖂䗁⚥ך8FCؒٝآص،‣ 剑鵚ךꟼ䗰כXFCQFSGהBZ‣ 吳$ZCFS"HFOUַ 吳"CFNB57⳿ぢ⚥ "NFCB窟䭍䪮遭劤鿇8FC*OJUJBUJWF$FOUFS!BIPNV
Frontend WeeklyIUUQTGSPOUFOEXFFLMZUPLZP㕂ⰻ㢩ךؿٗٝزؒٝسꟼ鸬صُ٦أ嫣鹈ֶ㾈ֽًׅ٦ٕوؖآٝ
ـٓؐؠח㼎ׅ⣛㶷
Windows- Chrome latest- Firefox latest- Internet Explorer 11 w/Windows 7, 8.1, 10- Microsoft Edge last 2 versionsmacOS (OS X)- Chrome latest- Firefox latest- Safari last 2 versionsAndroid- Android Browser 4.1, 4.3, 4.4, 5-6.x (Chromium)iOS- Safari last 2 versions
‣ ـٓؐؠך珏겲‣ رغ؎أך堣珏‣ رغ؎أך䚍腉‣ أؙٔ٦ٝ؟؎ؤ‣ طحزٙ٦ؙך鸞䏝ـٓؐؠ⟃㢩ך䟝㹀勴⟝㢳ְ
➂➂➂➂➂➂➂➂➂➂➂➂➂խ؟ه٦زׅץֹ橆㞮ָ㢳ְխ:?:?:?:?:?:?:?:?:?:?:?:
暴חꨇ⭑׃גְךָ؟٦ؽأך欰ㄏ简
1MBZFSGPS)551-JWF4USFBNJOHأزٔ٦ىؚٝ⹛歗فٖ؎َ٦
ꞿ儗ⱄ欰דזהזֻ姺תֿהָ֮ծהַך切僳זⱄ植ָ暴חֹאְغٔؒ٦ءّٝذأزָאְ
‣ 姻䌢‣ 僥⫷ָؙؕאָֻ鏩㺁דֹ‣ 僥⫷ָؙؕאֻג؎ٓהׅ‣ 僥⫷ָ姺ת荈⹛䗁䌓‣ 僥⫷ָ姺ת宕⛉⨡姺‣ ⹛ַזְ➂⸂ذأزפך铬ꆃ
‣ 8FC垥彊ז植➿דـٓؐؠך䊴殯כ֮‣ ׃גFYCPY娤כ麐㖈ׅ‣ "OESPJE#SPXTFSחֶֽ)-4娤麐㖈ׅ‣ 8JOך*&ח.4& .FEJB4PVSDF&YUFOTJPOTכזְְײـٓؐؠ⣛㶷ך㉏겗
‣ *&דS"'3FBDUךWBMVF-JOLָ窃،ٖהַ‣ 4BGBSJװ&EHFָ稆ד)-4ⱄ欰׃ָاٖהַ‣ 〢ך7דObject.assignך갫䎷ָ،ٖהַ‣ &EHFדiframeָاٖהַ‣ mozRequestFull"S"creenהַMSFullscreenChangeהַ‣ 8JO*&ך暴㹀ؽٕسחꣲגխխխխխխnew Worker(URL.createObjectURL(blob));ָؒٓ٦הַ
$ISPNF'Yד⹛ְַׇֻד屘倖׃⽯娤ׅ⚅歲錁ߋʹɺ͋Δఔշదͳ Windows Ϛγϯৗඋ͠ͳ͍ͱײ͕֮ಷΔ
Ύ'MBTIח㼎ׅ⣛㶷
➂➂➂➂➂➂➂➂➂➂➂➂➂խ'MBTIָ$ISPNFד⹛ַזְխ:?:?:?:?:?:?:?:?:?:?:?:
،ً٦غؾؚךؐ؍آؑحزػ٦خ'3&4)ך&NCFEفٖ؎َ٦ 䔲儗˟➙כ"CFNB57ך姺歗⫷ח➿גְ
IUUQTIBWFMPHBZVNVTBUPDPNEFWFMPQPUIFSTFBVUPQMBZ@BE@BTIIUNM㼭ְׁ'MBTIⱄ欰ׇׁ㔐鼘䩛媮
'MBTIח㼎ׅ⣛㶷
‣ )551-JWF4USFBNJOHדׅ‣ ⹛歗أزٔ٦ىؚٝד崧ׅ鋉呓דׅ‣ '3&4)"CFNB57ְתךהֿ)-4‣ )-4ך鑫稢כծֿך䖓ךإحءַّٝխ3PPN"ך㨣ךإحءّٝ罋ח)-4הְֲך
‣ 畭涸ח8FC垥彊ז㹋鄲ׁٓ؎ـָ֮ٓٔײ橆㞮ד㸜㹀דֹקו卫גְזְ‣ 嫰鯰ׅה'MBTI㹋鄲כ㦩ח㸜㹀׃גְ‣ ׃$16כـٝ㔐ׁ‣ 军䨺䚍腉ָ넝ת'MBTI㹋鄲ד)-4ⱄ欰
鶕剑䖓ך㻢ⴻ
‣ $ISPNFהד媮ꥡ涸חـٗحؙ㨣‣ 4BGBSJכַ琎噰涸זـٗحؙ㨣‣ 'JSFGPYה&EHF媮ꥡ涸חـٗحؙך倯ꆙ‣ *OUFSOFU&YQMPSFSכ'MBTIהⰟח嶊ִײֻ㻢ⴻך傈ծ鹌䯴וֲדַׅ
IUUQTIBWFMPHBZVNVTBUPDPNEFWFMPQPUIFSTFSVJO@PG@BTIIUNM'MBTI⺪㔲笨ך植朐
膴'MBTI⣛㶷
‣ EBJMZNPUJPOIMTKT䱰欽‣ .FEJB4PVSDF&YUFOTJPOTⵃ欽鑫׃ֻכ SZ‣ $ISPNFה&EHFחぢֽג䲿⣘⚥‣ 'JSFGPY 4BGBSJכ갫如䲿⣘ծ*&כ'MBTI竰竲膴'MBTI鹌䯴׃גתׅ
Ώٓ؎ـٓٔח㼎ׅ⣛㶷
OQNהCSPXTFSJGZؕآُ،ٕז⣛㶷ך鍑犜
‣ 醱꧟ז㉏겗鸞װַח鍑寸דֹ‣ 044涸זㅷ颵䬐⥂劍䖉דֹ ⹛⡲㹋籐 堣腉鷄⸇ غؚ⥜姻FUD⣛㶷ךًٔحز
‣ ؝، SFBDU VYJCMF BOHVMBS‣ ِ٦ذ؍ٔذ؍ NPNFOU JNNVUBCMF SY‣ ؿ؋ؙٝءّٝ MPEBTI MFGUQBE‣ هٔؿ؍ٕ XIBUXHGFUDI FTQSPNJTF‣ 6*؝ٝه٦طٝز DBSPVTFM QBHJOBUFٓ؎ـٓٔ⣛㶷ךⴓ겲
‣ ًاحسךח⟒ղ׃ְٓ؎ـٓٔכ‣ +4ךغٝسٕ؟؎ؤ罋䣁ׅה㣐磛כ㔭‣ ًاحس׀החJNQPSUדֹה⸔ַ‣ ⢽ִל3Y+4Wהַכ孡黎גֻגְِ٦ذ؍ٔذ؍ך磛䏝
‣ Ⰵ䙀זㅷ颵ثؑحָؙ䗳銲‣ 3FBDU،حفر٦ز儗ח駈䒷䓸ָ‣ 暴婊銲⟝GPSLׅלוֲהדזָ‣ 穠㽷ؔ٦ت٦ً؎زה㢌זֻז䠬➭➂ך6*؝ٝه٦طٝز
⣛㶷خٔ٦搀꠹ח㣐ֹֻ׃זְ⸕⸂䗳銲
⣛㶷ٓ؎ـٓٔꟼ鸬ךزٓـٕءُ٦ذ؍ؚٝ
‣ *TPNPSQIJDזSPVUFד㣐ꆀךر٦ة《䖤‣ 䲽歗ׅץֹ銲稆ָ㢳ֻז⚺חٔأز禸‣ SFOEFS5P4USJOHָꅾֻז‣ ؙٓ؎،ٝزךד鹼䒀㹋遤ׅխխխխSPVUFⳢ椚鷄⸇׃ג鍑寸✮㹀3PVUFהSFOEFS5P4USJOH
// αόΫϥ྆ํͰϧʔςΟϯά࣌ʹ࣮ߦaction: (context, payload, done) {Promise.all([context.executeAction(ͳʹ͔େࣄͳσʔλऔಘ1),context.executeAction(ͳʹ͔େࣄͳσʔλऔಘ2)]).then(() => done()).catch((err) => done(err));},// ΫϥΠΞϯταΠυͷΈϧʔςΟϯάޙʹ࣮ߦdeferAction: (context, payload, done) {Promise.all([context.executeAction(Εͯྑ͍σʔλऔಘ1),context.executeAction(Εͯྑ͍σʔλऔಘ2)]).then(() => done()).catch((err) => done(err));}
‣ 4UPSFַ*NNVUBCMFז.BQװ-JTUָ䲿⣘‣ 䲿⣘ׁؔـآؙؑزכTUBUFד⥂䭯‣ SFOEFSⰻדTUBUFGPPUP+4 ‣ SFOEFSׅןחUP+4 ך؝أز넝ֺׅ娤*NNVUBCMFKTהSFOEFS
componentDidMount() {this.subscriptions.push(FooStore.foo$.subscribe(foo => {// foo: Immutable.Mapthis.setState({ foo });}));}render() {// render ͕܁Γฦ͞ΕΔͨͼʹ toJS ͕૬ͳ࣌ؒΛͱΔlet foo = this.state.foo.toJS();return ({foo.someProperty});}
IUUQTDIOFUQPTUTBCFNBUWSVOUJNFQFSGBVEJUIUNM"CFNB57ךٓٝة؎يػؿؓ٦وٝأך"VEJU
תה
‣ فٖ؎َ٦嗚鏾ְפ‣ 8JEOPXT⢪ֲֶ‣ 膴'MBTIָלֲ‣ ⣛㶷خٔ٦ך㣐ֹׁכ罋ִ״ֲ‣ 8FC涪ג嚂׃ְתה
$IFFSTIUUQBIPNV!BIPNVHJUIVCDPNBIPNV!"⌂