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
フロントエンドわからないけど画面つくることになって
Search
irof
February 17, 2017
Programming
1
880
フロントエンドわからないけど画面つくることになって
[関ジャバ] フロントエンド初心者勉強会 in 大阪のLTです。
https://kanjava.connpass.com/event/49104/
irof
February 17, 2017
Tweet
Share
More Decks by irof
See All by irof
バッチを作らなきゃとなったときに考えること
irof
0
350
SpringBoot3.4の構造化ログ #kanjava
irof
3
1k
自分ひとりから始められる生産性向上の取り組み #でぃーぷらすオオサカ
irof
8
3.3k
役立つログに取り組もう
irof
33
12k
Javaのリリースモデル変更 その後
irof
0
110
プールにゆこう
irof
2
330
Javaマルチバージョンビルディング
irof
1
410
データ/データベースパターン
irof
0
190
勉強会で話すハードルを下げてみる
irof
0
390
Other Decks in Programming
See All in Programming
ARA Ansible for the teams
kksat
0
150
『GO』アプリ バックエンドサーバのコスト削減
mot_techtalk
0
150
プログラミング言語学習のススメ / why-do-i-learn-programming-language
yashi8484
0
140
sappoRo.R #12 初心者セッション
kosugitti
0
260
ソフトウェアエンジニアの成長
masuda220
PRO
12
2k
CSS Linter による Baseline サポートの仕組み
ryo_manba
1
130
Grafana Cloudとソラカメ
devoc
0
180
DROBEの生成AI活用事例 with AWS
ippey
0
140
社内フレームワークとその依存性解決 / in-house framework and its dependency management
vvakame
1
570
GitHub Actions × RAGでコードレビューの検証の結果
sho_000
0
270
pylint custom ruleで始めるレビュー自動化
shogoujiie
0
120
Ruby on cygwin 2025-02
fd0
0
150
Featured
See All Featured
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
27
1.9k
Docker and Python
trallard
44
3.3k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.4k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
7
630
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
133
33k
The Language of Interfaces
destraynor
156
24k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.5k
Unsuck your backbone
ammeep
669
57k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
4
350
Practical Orchestrator
shlominoach
186
10k
Transcript
ϑϩϯτΤϯυΘ͔Βͳ͍ ͚Ͳը໘࡞Δ͜ͱʹͳͬͯ <ؔδϟό>ϑϩϯτΤϯυॳ৺ऀษڧձJOେࡕ 5 !JSPG
എܠͱͯࣗ͠ݾհ w ͍Ζ;Ͱ͢ɹɹɹɹɹɹɹ͜Εˠ w େن4*FSͰੜ͖ͯ·ͨ͠ w αʔόʔαΠυ+BWBͳਓͰ͢ w +BWB4DSJQUͨ·ʹ͚ͩͲ*&ҎԼུ w
)5.-ͱ͔$44ͱ͔ԿͦΕ
എܠͱͯ͠ܦҢ ʮը໘దʹ࡞ͬͯɻ ɹ"ENJO-5&ͱ͔ͬͯɻʯ ͓ɺ͓͏ʜʜ ʮదͰ͍͍͔ΒXXXʯ ͋ɺ͍ʜʜ
ࢲͷϑϩϯτΤϯυྗ w #PPUTUSBQ5XJUUFS#PPUTUSBQͱ͔ ݴͬͯͨ͜Ζʹ৮ͬͨʢඇۀ w K2VFSZॻ͚ͱݴΘΕΔͱάάΔ w )5.-ͱ͔$44ͱ͔ݴ༿͚ͩͬ ͯΔʢ໊લग़ͨࠒʹ
Ͳͳ͍ͤʔͱʜʜ
ͱͳΔਓଟ͍ΑͶʂʁ ʢؔδϟόͩ͠ʂʂʣ
ରͷ֓ཁ w 4QSJOH.7$ 5IZNFMFBGΛ͏ w ը໘͖ʹͰ͖ΔˡԿܾ·ͬͯͳ͍ w ϢʔβʔਓʢإΛ֮͑ΕΔఔ w
͕࣌ؒͳ͍ˡ͍ͭͩͬͯ࣌ؒ༗ݶͩ͠
݅ͱํ w ͋Δఔݟӫ͑Λ͑Δඞཁ͋Δ w ࣗͰ+BWB4DSJQU$44ॻ͔ͳ͍ w "ENJO-5&ͱ͔ͬͯݴͬͯͨ͠ "ENJO-5&ͱ͔ݴ͏ͷΛ͓͏ʂ
ࢥ͍͍ͭͨબࢶ w ϓϩδΣΫτʹෲ࣋ͪ͢Δ w $%/Λ͏ w 8FC+BSTΛ͏ w 8FCQBDLΛ͏
ϓϩδΣΫτͰෲ࣋ͪ w μϯϩʔυͨ͠[JQղౚͨ͠ͷΛશ෦࣋ͬͯ ͓͘ܗ w தͷେΘͳ͍ʁʢEJTU͚ͩͰ͓Lʁ w ͚ͲɺͲΕ͕͍Δͷ͔Θ͔Βͳ͍ w ͱݴ͑ɺཁΒΜͷΛ4$.ʹೖΕͨ͘ͳ͍
ͳ͠झຯʹ߹Θͳ͍
$%/ w ͳΜ͔͍ͬͺ͍͋Δ w ͲΕ͍͍͔͑Θ͔Βͳ͍ w ͔ͯແྉͷຊ൪Ͱͬͯେৎʁ ͳ͠։ൃͷΈͰ͏
ͯ͜ͱͰೋ w 8FC+BST w l͡Ίͯͷ4QSJOH#PPUzͰݟͨʂ w 8FCQBDL w ͡Ί·ͯ͠ʢ୭ʁ
8FC+BST w .BWFO$FOUSBMͷ+4$44Λ͑Δ Α͏ʹͳΔͭ
8FC+BST .BWFO$FOUSBM /1. #PXFS ࢲͷΞϓϦέʔγϣϯ ͍͍ͨ+4$44 ࢲʹ͍͞͠ੈք ࢲͷΒͳ͍ੈք (SBEMF CVJMEHSBEMF
͜͜ʹདྷΕউͬͨΑ͏ͳͷ
w 8FC+BSTશʹϚελʔͨ͠
8FCQBDL w )5.-ʹAMJOLAͱ͔ATDSJQUAͱ͔ ฒͳͯ͘ࡁΉΑ͏ʹͳΔͭ w )5.-ͷ࠷ޙʹATDSJQUAΛҰͭॻ ͚ͩ͘ͰࡁΉ
8FCQBDLΛ͏ʹʜʜ w OQN͕લఏ w ͦͦOQN͠Βͳ͍
OQN w /PEFKT1BDLBHF.BOBHFSʁ w ·͋ґଘղܾͯ͘͠ΕΔͭͳΜͩ Ζ͏͖ͬͱʢଞʹ৭ʑͰ͖ΔΈͨ ͍͚ͩͲ
OQN ͍͍ͨ+4$44 /1. OQN OPEF@NPEVMFT QBDLBHFKTPO
w OQNશʹϚελʔͨ͠
8FCQBDL ·ͱΊͨ+BWB4DSJQU XFCQBDL OPEF@NPEVMFT XFCQBDLDPOGJHKT ΤϯτϦϙΠϯτͷKT
w 8FCQBDLશʹϚελʔͨ͠
ϓϩδΣΫτͰ࣋ͭͷ w ϑΝΠϧͰࡁΉͷ·ͣ·ͣ w ΤϯτϦϙΠϯτͷKTͱQBDLBHFKTPOʹ͏ϥΠϒ ϥϦΛ΄΅ಉ͡༰Ͱॻ͖ฒΔ͜ͱʹʢඇ%3:ʣ w Ϗϧυͷεςοϓ͕Ұͭ૿͑Δ ├── app
│ └── index.js ├── package.json └── webpack.config.js ͳ͠+4ॻ͔ͳ͍ͷͰա
ͯ͜ͱͰ w ࠓճ8FC+BSTͰʂ
͍͖ͳΓࠔͬͨ w ηϯτϥϦϧϙδτϦʹ͍͍ͨόʔ δϣϯ͕ͳ͍Αʜʜ
8FC+BST .BWFO$FOUSBM /1. #PXFS ࢲͷΞϓϦέʔγϣϯ ͍͍ͨ+4$44 ࢲʹ͍͞͠ੈք ࢲͷΒͳ͍ੈք (SBEMF CVJMEHSBEMF
͜Ε͠ͳ͍ͱ͑ͳ͍
ࣗͰσϓϩΠͰ͓L
w 8FC+BSTશʹϚελʔͨ͠ʢ࠶
ͱ͜ΖͰ w ࠓճͷؔδϟόʮϑϩϯτΤϯ υʯ͚ͬͯͨ͠ͲɺͲ͔͜Βϑϩ ϯτΤϯυͳͷ͔Α͘Θ͔Γ·ͤΜ