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
Webフロントエンドはなぜ複雑なのか
Search
ozaki25
February 16, 2021
Technology
1
120
Webフロントエンドはなぜ複雑なのか
ozaki25
February 16, 2021
Tweet
Share
More Decks by ozaki25
See All by ozaki25
20210526_a11y.pdf
ozaki25
0
160
20210525_react_next.pdf
ozaki25
0
120
utility first css
ozaki25
0
85
20201225_how_to_learn_technology.pdf
ozaki25
0
150
20201124_blitz.pdf
ozaki25
0
80
20200727_liff_app.pdf
ozaki25
1
630
20200721_web_vitals.pdf
ozaki25
0
96
20200624_web_otp_api.pdf
ozaki25
1
120
20200128_sentry.pdf
ozaki25
0
97
Other Decks in Technology
See All in Technology
IIWレポートからみるID業界で話題のMCP
fujie
0
790
Javaで作る RAGを活用した Q&Aアプリケーション
recruitengineers
PRO
1
100
製造業からパッケージ製品まで、あらゆる領域をカバー!生成AIを利用したテストシナリオ生成 / 20250627 Suguru Ishii
shift_evolve
PRO
1
130
Azure AI Foundryでマルチエージェントワークフロー
seosoft
0
180
「Chatwork」の認証基盤の移行とログ活用によるプロダクト改善
kubell_hr
1
150
GeminiとNotebookLMによる金融実務の業務革新
abenben
0
220
25分で解説する「最小権限の原則」を実現するための AWS「ポリシー」大全 / 20250625-aws-summit-aws-policy
opelab
9
1.1k
Amazon S3標準/ S3 Tables/S3 Express One Zoneを使ったログ分析
shigeruoda
3
470
米国国防総省のDevSecOpsライフサイクルをAWSのセキュリティサービスとOSSで実現
syoshie
2
1k
プロダクトエンジニアリング組織への歩み、その現在地 / Our journey to becoming a product engineering organization
hiro_torii
0
130
Amazon Bedrockで実現する 新たな学習体験
kzkmaeda
1
530
強化されたAmazon Location Serviceによる新機能と開発者体験
dayjournal
2
200
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
81
9.1k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
790
Faster Mobile Websites
deanohume
307
31k
RailsConf 2023
tenderlove
30
1.1k
The Language of Interfaces
destraynor
158
25k
Java REST API Framework Comparison - PWX 2021
mraible
31
8.6k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Producing Creativity
orderedlist
PRO
346
40k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Visualization
eitanlees
146
16k
The Pragmatic Product Professional
lauravandoore
35
6.7k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.2k
Transcript
8FCϑϩϯτΤϯυ ͳͥෳࡶͳͷ͔
͡Ίʹ w 8FCϑϩϯτΤϯυෳࡶʁ w ϥΠϒϥϦπʔϧ͕ཚཱͯ͠Α͘Θ͔ΒΜʂ w )5.-Λ࡞Δ͚ͩԿʹͳΜͰΊΜͲ͍͘͞ͷʁ
͡Ίʹ w 8FCϑϩϯτΤϯυෳࡶʁ w ϥΠϒϥϦπʔϧ͕ཚཱͯ͠Α͘Θ͔ΒΜʂ w )5.-Λ࡞Δ͚ͩԿʹͳΜͰΊΜͲ͍͘͞ͷʁ ˰͜ΕΒͷٙͷճͷҰ෦Λհ͠·͢
8FCϑϩϯτΤϯυෳࡶԽͷཁҼ
2ͳͥ8FCϑϩϯτΤϯυෳࡶ͔
"+BWB4DSJQU͕ॾѱͷࠜݯ
Ͱ+BWB4DSJQU͕ඞཁ͔ͩΒ ؤுΔ͔͠ͳ͍
+BWB4DSJQU͕ෆཁͳ໘Ͱ ෳࡶͰͳ͍8FCϑϩϯτΤϯυΛ ᨳՎ͢ΕΑ͍
41"ͱ.1"
41"ͱ.1" w .1"Ͱͳ͍ͳΒෳࡶͰͳ͍8FCϑϩϯτΤϯυͰ0, w 41"͕͍͍ͳΒؤுΔඞཁ͕͋Δ
.1"ͱʁ w αʔό͔Β৽͍͠ϖʔδΛऔಘͯ͠ϖʔδભҠ͢Δ w ᶃભҠઌͷ63-ʹΞΫηε w ᶄ63-ʹରԠ͢ΔϖʔδΛαʔόͰߏங w ᶅߏஙͨ͠ϖʔδΛΫϥΠΞϯτʹฦͯ͠දࣔ͢Δ
.1"ͱʁ w .1"ʹΑΔϖʔδભҠᶃ IPNF͕දࣔ͞Ε͍ͯΔ
.1"ͱʁ w .1"ʹΑΔϖʔδભҠᶄ ΫϦοΫ͢ΔͱIFMMPʹΞΫηε
.1"ͱʁ w .1"ʹΑΔϖʔδભҠᶅ ΫϦοΫ͢ΔͱIFMMPʹΞΫηε αʔό /hello
.1"ͱʁ w .1"ʹΑΔϖʔδભҠᶆ ΫϦοΫ͢ΔͱIFMMPʹΞΫηε αʔό /hello /helloͷHTMLΛߏங
.1"ͱʁ w .1"ʹΑΔϖʔδભҠᶇ αʔό /hello HTMLΛฦ٫ ΫϦοΫ͢ΔͱIFMMPʹΞΫηε
.1"ͱʁ w .1"ʹΑΔϖʔδભҠᶈ αʔό /hello HTMLΛฦ٫ IFMMP͕දࣔ͞ΕΔ
41"ͱʁ w +BWB4DSJQUΛͬͯϖʔδભҠ͢Δ8FCΞϓϦ w ᶃ+BWB4DSJQUͰ63-Λॻ͖͑Δ w ᶄ63-ͷมߋΛτϦΨʔʹ+BWB4DSJQUͰϖʔδΛॻ͖͑Δ
41"ͱʁ w +BWB4DSJQUʹΑΔϖʔδભҠͷ͔ͨ͠ᶃ IFMMP͕දࣔ͞Ε͍ͯΔ
41"ͱʁ w +BWB4DSJQUʹΑΔϖʔδભҠͷ͔ͨ͠ᶄ ΫϦοΫ͢Δͱ+BWB4DSJQUΛͬͯ 63-ΛIPNFʹॻ͖͑Δ
41"ͱʁ w +BWB4DSJQUʹΑΔϖʔδભҠͷ͔ͨ͠ᶅ 63-͕IPNFʹมΘΔ
41"ͱʁ w +BWB4DSJQUʹΑΔϖʔδભҠͷ͔ͨ͠ᶆ 63-ͷมߋΛݕͯ͠ϖʔδΛॻ͖͑ ඞཁʹԠͯ͡αʔό͔ΒσʔλΛऔಘͨ͠Γ͢Δ
41"ͱ.1"ͷಛ w 41" w +BWB4DSJQUͰϖʔδΛॻ͖ ͑ΔͷͰભҠ͕ߴ w +BWB4DSJQUΛ͍·͘Δ w σʔλ"1*ΞΫηεͰऔಘ
w .1" w ϖʔδભҠͷʹ௨৴͕ඞཁ w +BWB4DSJQUඞਢͰͳ͍ w +BWB4DSJQUΛ͍͗͢Δͱϝ ϯς͕ਏ͘ͳΔ
41"Λ͍͍ͨ໘ w ᶃΫϥΠΞϯτͰෳࡶͳಈ͖Λ࣮ݱ͍ͨ͠໘ w ϖʔδભҠͷύϑΥʔϚϯεΛٻ͍ͨ͠ w +BWB4DSJQUΛͬͨಈతͳ6*Λ࣮ݱ͍ͨ͠ w ΫϥΠΞϯτͷίʔυϝϯςφϒϧʹ͍ͨ͠ w
ᶄαʔόαΠυ͕ܰྔͳ໘ w ֎෦"1*ͷΞΫηε'BB4ͰࣄΓΔ w αʔόαΠυͷܰྔͳͷͰ41"ͰΫϥΠΞϯτͷ࣮ʹूத͍ͨ͠
+BWB4DSJQUΛ͏ͱͳͥෳࡶʹͳΔͷ͔
ϒϥβ্Ͱಈ࡞͢Δͱ͍͏੍ w 8FCΞϓϦϒϥβ্Ͱಈ࡞͢Δ w ͭ·Γ+BWB4DSJQUϒϥβ্Ͱ࣮ߦ͞ΕΔ ϒϥβ αʔό +BWB4DSJQUͬͪ͜Ͱಈ͘
ϒϥβ্Ͱಈ࡞͢Δͱ͍͏੍ w ࣮ߦڥ͕ϒϥβͱ͍͏͜ͱ ΫϥΠΞϯτͷڥʹΑ࣮ͬͯߦڥ͕ҟͳΔͱ͍͏͜ͱ
ϒϥβ্Ͱಈ࡞͢Δͱ͍͏੍ w +BWB4DSJQUͷόʔδϣϯ w ϒϥβʹΑͬͯαϙʔτ͍ͯ͠Δόʔδϣϯ͕ҟͳΔ w ͔ͱ͍ͬͯݹ͍ํʹ߹ΘͤΔͷφϯηϯε w ಉ࣌ଓͷ੍ݶ w
ϒϥβ͔Βಉ࣌ʹ௨৴Ͱ͖Δ͕ܾ·ͬͯΔʢ͍͍ͨͯຊʣ w ͳͷͰେྔͷϑΝΠϧΛಡΈࠐΉ͜ͱආ͚͍ͨ
ϒϥβ্Ͱಈ࡞͢Δͱ͍͏੍ w +BWB4DSJQUͷόʔδϣϯ w ϒϥβʹΑͬͯαϙʔτ͍ͯ͠Δόʔδϣϯ͕ҟͳΔ w ͔ͱ͍ͬͯݹ͍ํʹ߹ΘͤΔͷφϯηϯε ˰࠷৽ͷه๏Ͱॻ͍ͯݹ͍όʔδϣϯʹτϥϯεύΠϧ͢Ε͍͍ w ಉ࣌ଓͷ੍ݶ
w ϒϥβ͔Βಉ࣌ʹ௨৴Ͱ͖Δ͕ܾ·ͬͯΔʢ͍͍ͨͯຊʣ w ͳͷͰେྔͷϑΝΠϧΛಡΈࠐΉ͜ͱආ͚͍ͨ ˰ͭͷϑΝΠϧʹόϯυϧ͢Ε͍͍
ࢀߟ +BWB4DSJQUͷ༷ w +BWB4DSJQUͷ༷&$."4DSJQUͰఆΊΒΕ͍ͯΔ w &$."4DSJQUόʔδϣϯ·Ͱ࿈൪Ͱ͔Βຖ 761͍ͯ͠ΔͷͰྐྵ͕όʔδϣϯͱ͚ͯͭ͠ΒΕΔ w &$."4DSJQU&4ͱུ͞Εόʔδϣϯͱ߹ΘͤͯҎԼͷΑ͏ʹ ݺΕΔ
w FY&4 &4 &4
όʔδϣϯͷτϥϯεύΠϧ w ಈ࡞ڥʹԠͯ͡ݹ͍όʔδϣϯʹτϥϯεύΠϧ͍ͨ͠ χʔζ͕͋Δ w #BCFMΛ͏͜ͱͰ࣮ݱͰ͖Δ #BCFMΛͬͯ τϥϯεύΠϧ
+BWB4DSJQUϑΝΠϧͷόϯυϧ w ϞδϡʔϧόϯυϥʔͱݺΕΔπʔϧΛ͏͜ͱͰ +BWB4DSJQUͷґଘؔΛղܾͯͭ͠ͷϑΝΠϧʹ ·ͱΊΔ͜ͱ͕Ͱ͖Δ ผϑΝΠϧʹґଘ ֎෦ϥΠϒϥϦʹґଘ CVOEMFKT ͭͷϑΝΠϧʹ·ͱ·ͬ
ͨͷ͕ੜ͞ΕΔ ϞδϡʔϧόϯυϥʔΛ௨͢
+BWB4DSJQUϑΝΠϧͷόϯυϧ w ϞδϡʔϧόϯυϥʔͷॲཧͷதͰ#BCFMΛ࣮ߦ͢Δέʔεଟ͍ YYYKT YYYKT YYYKT CVOEMFKT #BCFMͰ چόʔδϣϯʹ
τϥϯεύΠϧ ґଘؔͷղܾ ϞδϡʔϧόϯυϥʔΛ௨͢
+BWB4DSJQUϑΝΠϧͷόϯυϧ w ϞδϡʔϧόϯυϥʔͷॲཧͷதͰ#BCFMΛ࣮ߦ͢Δέʔεଟ͍ YYYKT YYYKT YYYKT CVOEMFKT #BCFMͰ چόʔδϣϯʹ
τϥϯεύΠϧ ґଘؔͷղܾ ϞδϡʔϧόϯυϥʔΛ௨͢ ଞʹ͍Ζ͍ΖͳॲཧΛ ϞδϡʔϧόϯυϥʔͰ࣮ߦͰ͖Δ
͜͜·Ͱͷ͓͞Β͍
͜͜·Ͱͷ͓͞Β͍ w 8FCϑϩϯτΤϯυͷෳࡶ͞ͷࠜݯ+BWB4DSJQU w 41"Λ࠾༻͍ͨ͠߹͜ͷෳࡶ͔͞ΒಀΕΒΕͳ͍ w ϒϥβͰಈ࡞͢Δͱ͍͏ੑ্࣭ҎԼͷߟྀ͕ඞཁ w ݹ͍όʔδϣϯͰಈ࡞͢ΔΑ͏ʹ͍ͨ͠ w
ͭͷϑΝΠϧʹόϯυϧ͍ͨ͠ w Ϟδϡʔϧόϯυϥʔͱ#BCFMΛ͏ͱղܾͰ͖Δ
͜ΕҎ֎ʹ՝͕͍Ζ͍Ζ͋Δ
ͦΕΒΛղܾ͢ΔͨΊʹ ͍Ζ͍Ζग़ͯ͘Δ
5ZQF4DSJQUΛ͍͍ͨ
5ZQF4DSJQUͱ w +BWB4DSJQUͷ֦ுݴޠ w ͬͬ͘͟Γݴ͏ͱ੩తͳܕఆ͕ٛՃ͞Εͨ+BWB4DSJQU w ͦͷ··Ͱಈ͔ͳ͍ͷͰ+BWB4DSJQUʹτϥϯεύΠͯ͠͏ +BWB4DSJQU 5ZQF4DSJQU
5ZQF4DSJQUͷτϥϯεύΠϧ w 5ZQF4DSJQUΛ+BWB4DSJQUʹτϥϯεύΠϧ͢ΔॲཧϏϧυͷྲྀ ΕʹΈࠐΉ͜ͱʹͳΔ w τϥϯεύΠϧʹUTD UTMPBEFS #BCFMͷ͍ͣΕ͔Λ͏ YYYKT
YYYKT YYYUT CVOEMFKT #BCFMͰ چόʔδϣϯʹ τϥϯεύΠϧ ґଘؔͷղܾ ϞδϡʔϧόϯυϥʔΛ௨͢ 5ZQF4DSJQUΛ +BWB4DSJQUʹ τϥϯεύΠϧ
$PEF4QMJUUJOH͍ͨ͠
$PEF4QMJUUJOHͱ w શͯͷϑΝΠϧΛͭʹόϯυϧ͢ΔͱϑΝΠϧαΠζ͕࣍ୈʹ େ͖͘ͳͬͯ͘Δ w ϑΝΠϧαΠζ͕େ͖͍ͱಡΈࠐΈʹ͕͔͔࣌ؒͬͯදࣔ ͕Լͯ͠͠·͏
$PEF4QMJUUJOHͱ w શͯͷϑΝΠϧΛͭʹόϯυϧ͢ΔͱϑΝΠϧαΠζ͕࣍ୈʹ େ͖͘ͳͬͯ͘Δ w ϑΝΠϧαΠζ͕େ͖͍ͱಡΈࠐΈʹ͕͔͔࣌ؒͬͯදࣔ ͕Լͯ͠͠·͏ ˰ϑΝΠϧΛ͚ͯඞཁͳͷ͚ͩऔಘ͢ΔΑ͏ʹ͠Α͏
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IPNF IFMMP BCPVU શ෦Ͱϖʔδ͋Δͱ͢Δ
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IPNF IFMMP BCPVU +BWB4DSJQUΛׂͯ͠ੜ BCPVUKT IFMMPKT
IPNFKT NBJOKT
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IPNF IFMMP BCPVU શϖʔδڞ௨ͰΘΕΔίʔυ BCPVUKT IFMMPKT
IPNFKT NBJOKT
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IPNF IFMMP BCPVU ֤ϖʔδڞ͚ͩͰΘΕΔίʔυ BCPVUKT IFMMPKT
IPNFKT NBJOKT ֤ϖʔδڞ͚ͩͰΘΕΔίʔυ ֤ϖʔδڞ͚ͩͰΘΕΔίʔυ
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IPNF IPNFʹΞΫηε
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IPNF ඞཁͳϑΝΠϧ͚ͩऔಘ IPNFKT NBJOKT
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IPNF IPNFΛදࣔ IPNFKT NBJOKT
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IFMMP IFMMPʹΞΫηε IPNFKT NBJOKT
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IFMMP IPNFKT NBJOKT ՃͰඞཁͳ ϑΝΠϧ͚ͩऔಘ IFMMPKT
$PEF4QMJUUJOHͷΈ w ϖʔδ୯ҐͰׂ͢Δέʔε͕ଟ͍ IFMMP IPNFKT NBJOKT IFMMPΛදࣔ IFMMPKT
$PEF4QMJUUJOHͷ࣮ݱ w Ϟδϡʔϧόϯυϥʔͷػೳͱͯ͠$PEF4QMJUUJOHΛ࣮ݱͰ͖Δ YYYKT YYYKT YYYKT CVOEMFKT #BCFMͰ چόʔδϣϯʹ
τϥϯεύΠϧ ґଘؔͷղܾ ϞδϡʔϧόϯυϥʔΛ௨͢ $PEF4QMJUUJOH ͢Δ
·ͱΊ
·ͱΊ w +BWB4DSJQU༷ʑͳࣄ͔ΒίʔυʹखΛՃ͑Δχʔζ͕͋Δ w ͦͷͨΊʹ͍Ζ͍ΖͳπʔϧΛͬͯෳࡶʹͳ͍ͬͯΔ w ࠓճհ͍ͯ͠ͳ͍ࣄ·ͩͨ͘͞Μ͋ΔͷͰͱͯෳࡶ w ྫ͑։ൃதϗοτϦϩʔυ͍ͨ͠ͱ͔
͜ΕΒΛશ෦ཧղ͠ͳ͍ͱ 8FCϑϩϯτΤϯυͷ։ൃͰ͖ͳ͍ͷʁ
ͦΜͳ͜ͱͳ͍ʂ
εςοϓΞοϓͷ͔ͨ͠ w ηοτΞοϓࡁΈͷڥΛߏஙͰ͖ΔHFOFSBUPS͕ॆ࣮ͯ͠Δ w 3FBDUͳΒ$SFBUF3FBDU"QQɺ7VFͳΒ7VF$-*ͳͲͳͲ w ॳ৺ऀͷ͏ͪͦΕΒʹཔͬͯ։ൃΛਐΊΕ0, w HFOFSBUPSͷઃఆΛม͑ΔඞཁੑΛײ͖ͯͨ͡Β ͲΜͳ͜ͱΛ͍ͬͯΔͷֶ͔ͼ࢝ΊΕΑ͍
͋Γ͕ͱ͏͍͟͝·ͨ͠