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
170
控えめな App Router と持続可能な開発 - PWA Night vol.59
ahomu
11
2.7k
GPT 生成物の評価、運用 toC 企画でのハードルと勘所
ahomu
0
260
副業をきっかけに 切り拓くキャリア形成
ahomu
1
120
Webフロントエンドと アーキテクチャ事情の持論を喋る
ahomu
2
1.6k
SPA/MPA 議論の俯瞰と 現代における設計のポイント - #tfcon 2022 フロントエンド設計
ahomu
4
3.6k
#TECHPLAY Talk - 理想的な Web のため MUST 駆動で主語が大きくなったキャリア
ahomu
0
240
最近の Web パフォーマンス改善について知っておきたいコト
ahomu
50
19k
Web フロントエンドで大切なことはすべて Audits が教えてくれた
ahomu
1
590
Other Decks in Programming
See All in Programming
今年のアップデートで振り返るCDKセキュリティのシフトレフト/2024-cdk-security-shift-left
tomoki10
0
330
PHPカンファレンス 2024|共創を加速するための若手の技術挑戦
weddingpark
0
120
MCP with Cloudflare Workers
yusukebe
2
280
Flatt Security XSS Challenge 解答・解説
flatt_security
0
630
rails newと同時に型を書く
aki19035vc
5
660
Fibonacci Function Gallery - Part 1
philipschwarz
PRO
0
270
Lookerは可視化だけじゃない。UIコンポーネントもあるんだ!
ymd65536
1
110
ATDDで素早く安定した デリバリを実現しよう!
tonnsama
1
1.3k
ドメインイベント増えすぎ問題
h0r15h0
2
550
コンテナをたくさん詰め込んだシステムとランタイムの変化
makihiro
1
180
各クラウドサービスにおける.NETの対応と見解
ymd65536
0
240
BEエンジニアがFEの業務をできるようになるまでにやったこと
yoshida_ryushin
0
100
Featured
See All Featured
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.1k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
7k
The Language of Interfaces
destraynor
155
24k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.1k
Code Review Best Practice
trishagee
65
17k
We Have a Design System, Now What?
morganepeng
51
7.3k
Build The Right Thing And Hit Your Dates
maggiecrowley
33
2.5k
The Pragmatic Product Professional
lauravandoore
32
6.4k
Embracing the Ebb and Flow
colly
84
4.5k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
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 ! " ⌂