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
開発上の様々な依存のつらみと FRESH! by AbemaTV の話
Search
Ayumu Sato
October 15, 2016
Programming
18
9.7k
開発上の様々な依存のつらみと FRESH! by AbemaTV の話
AbemaTV Developer Conference 2016
http://developer.abema.io/
で使用したスライドです。本編 20 分。
Ayumu Sato
October 15, 2016
Tweet
Share
More Decks by Ayumu Sato
See All by Ayumu Sato
Web 開発の長距離走と持続可能性 - TechFeed Experts Night#31 〜 フロントエンドアーキテクチャの現状と未来
ahomu
1
180
控えめな App Router と持続可能な開発 - PWA Night vol.59
ahomu
11
2.8k
GPT 生成物の評価、運用 toC 企画でのハードルと勘所
ahomu
0
270
副業をきっかけに 切り拓くキャリア形成
ahomu
1
130
Webフロントエンドと アーキテクチャ事情の持論を喋る
ahomu
2
1.7k
SPA/MPA 議論の俯瞰と 現代における設計のポイント - #tfcon 2022 フロントエンド設計
ahomu
4
3.6k
#TECHPLAY Talk - 理想的な Web のため MUST 駆動で主語が大きくなったキャリア
ahomu
0
250
最近の Web パフォーマンス改善について知っておきたいコト
ahomu
50
19k
Web フロントエンドで大切なことはすべて Audits が教えてくれた
ahomu
1
600
Other Decks in Programming
See All in Programming
Writing documentation can be fun with plugin system
okuramasafumi
0
120
チームリードになって変わったこと
isaka1022
0
210
2024年のWebフロントエンドのふりかえりと2025年
sakito
3
260
プログラミング言語学習のススメ / why-do-i-learn-programming-language
yashi8484
0
140
XStateを用いた堅牢なReact Components設計~複雑なClient Stateをシンプルに~ @React Tokyo ミートアップ #2
kfurusho
1
930
Java Webフレームワークの現状 / java web framework at burikaigi
kishida
9
2.2k
WebDriver BiDiとは何なのか
yotahada3
1
150
Conform を推す - Advocating for Conform
mizoguchicoji
3
700
Bedrock Agentsレスポンス解析によるAgentのOps
licux
3
860
Pythonでもちょっとリッチな見た目のアプリを設計してみる
ueponx
1
580
Introduction to kotlinx.rpc
arawn
0
720
法律の脱レガシーに学ぶフロントエンド刷新
oguemon
5
740
Featured
See All Featured
Being A Developer After 40
akosma
89
590k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
10
1.3k
Statistics for Hackers
jakevdp
797
220k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
The Invisible Side of Design
smashingmag
299
50k
YesSQL, Process and Tooling at Scale
rocio
172
14k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.7k
Designing for humans not robots
tammielis
250
25k
We Have a Design System, Now What?
morganepeng
51
7.4k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.4k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
193
16k
Transcript
涪♳ך圫ղז⣛㶷ך鳞 א ה '3&4)CZ"CFNB57ך鑧 "CFNB57%FWFMPQFS$POGFSFODF !BIPNV"ZVNV4BUP
ְ ս⣛㶷վ շせ٥أ荈ո➭ךךח״ַַծ ח״ג䧭甧אֿהկ
‣ ـٓؐؠח㼎ׅ⣛㶷 ‣ '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 Weekly IUUQTGSPOUFOEXFFLMZUPLZP 㕂ⰻ㢩ךؿٗٝزؒٝسꟼ鸬صُ٦أ嫣鹈ֶ㾈ֽًׅ٦ٕوؖآٝ
ـٓؐؠח㼎ׅ⣛㶷
Windows - Chrome latest - Firefox latest - Internet Explorer
11 w/Windows 7, 8.1, 10 - Microsoft Edge last 2 versions macOS (OS X) - Chrome latest - Firefox latest - Safari last 2 versions Android - Android Browser 4.1, 4.3, 4.4, 5-6.x (Chromium) iOS - Safari last 2 versions
‣ ـٓؐؠך珏겲 ‣ رغ؎أך堣珏 ‣ رغ؎أך䚍腉 ‣ أؙٔ٦ٝ؟؎ؤ ‣ طحزٙ٦ؙך鸞䏝
ـٓؐؠ⟃㢩ך䟝㹀勴⟝㢳ְ
➂➂➂➂➂➂➂➂➂➂➂➂➂ խ؟ه٦زׅץֹ橆㞮ָ㢳ְխ :?:?:?:?:?:?:?:?:?:?:?:
暴חꨇ⭑׃גְךָ ؟٦ؽأך欰ㄏ简
None
1MBZFSGPS)551-JWF4USFBNJOH أزٔ٦ىؚٝ⹛歗فٖ؎َ٦
ꞿ儗ⱄ欰דזהזֻ姺תֿהָ֮ծהַך切僳זⱄ植ָ暴חֹאְ غٔؒ٦ءّٝذأزָאְ
‣ 姻䌢 ‣ 僥⫷ָؙؕאָֻ鏩㺁דֹ ‣ 僥⫷ָؙؕאֻג؎ٓהׅ ‣ 僥⫷ָ姺ת荈⹛䗁䌓 ‣ 僥⫷ָ姺ת宕⛉⨡姺
‣ ⹛ַזְ ➂⸂ذأزפך铬ꆃ
‣ 8FC垥彊ז植➿דـٓؐؠך䊴殯כ֮ ‣ ׃גFYCPY娤כ麐㖈ׅ ‣ "OESPJE#SPXTFSחֶֽ)-4娤麐㖈ׅ ‣ 8JOך*&ח.4& .FEJB4PVSDF&YUFOTJPOT כזְ
ְײـٓؐؠ⣛㶷ך㉏겗
‣ *&דS"' 3FBDUךWBMVF-JOLָ窃،ٖהַ ‣ 4BGBSJװ&EHFָ稆ד)-4ⱄ欰׃ָاٖהַ ‣ 〢ך7דObject.assignך갫䎷ָ،ٖהַ ‣ &EHFד<use xlink:href>
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⺪㔲笨ך植朐
None
None
膴'MBTI⣛㶷
None
None
None
‣ 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.Map this.setState({
foo }); }) ); } render() { // render ͕܁Γฦ͞ΕΔͨͼʹ toJS ͕૬ͳ࣌ؒΛͱΔ let foo = this.state.foo.toJS(); return ( <div> <h1>{foo.someProperty}</h1> </div> ); }
IUUQTDIOFUQPTUTBCFNBUWSVOUJNFQFSGBVEJUIUNM "CFNB57ךٓٝة؎يػؿؓ٦وٝأך"VEJU
תה
‣ فٖ؎َ٦嗚鏾ְפ ‣ 8JEOPXT⢪ֲֶ ‣ 膴'MBTIָלֲ ‣ ⣛㶷خٔ٦ך㣐ֹׁכ罋ִ״ֲ ‣ 8FC涪ג嚂׃ְ
תה
$IFFST IUUQBIPNV !BIPNV HJUIVCDPNBIPNV ! " ⌂