Visual Studio CodeでJavaScriptプログラミング

61e8d2d797a37913aafaeb8e8b38c373?s=47 echizenyayota
February 02, 2020
Programming
0
65

Visual Studio CodeでJavaScriptプログラミング

さくらクラブ 2020年2月号第7回 JavaScriptプログラミングもくもく勉強会の日

61e8d2d797a37913aafaeb8e8b38c373?s=128

echizenyayota

February 02, 2020
Tweet

More Decks by echizenyayota

See All by echizenyayota
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
16
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
110
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
61
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
48
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
1
26
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
35
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
1
200
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
760
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
150

Other Decks in Programming

See All in Programming
C302e84057a922dce0ecbe80207e3fcc?s=48 mu_zaru
1
130
9e9eb825c69d719f2d3c32bdd3bc971e?s=48 atp
1
180
A3db1cdacad2a1b5de5af000a1c94fda?s=48 xrxoxcxox
2
290
Eb44761e0fb3a5ec8e23ec28048dd7a5?s=48 stoitsev
1
120
D02d96057c4cd905d60d14549b00db0d?s=48 stvansolano
0
240
Beb422437c1dfb5366f197919e41ac50?s=48 lilobase
1
480
Bc142fbacf80354db09fe3dda44afcf1?s=48 nobonobo
0
130
B85111454fe19a425c375a28bc27996b?s=48 kitsuneeee
4
570
75cf8176bf14811428f77d8fe737f0d5?s=48 konstantin_diener
0
190
4578d99b560b2a470e05288ef6766ac2?s=48 paulk
0
640
3e049ed33195d00a8b745b16c63dce6e?s=48 leew
0
160
098d1adf6ec5b955e29e624b6cc9b6f9?s=48 totokit4
2
130

Featured

See All Featured
0c6fd6a08d0f898159cda7cafcacf07f?s=48 afnizarnur
176
14k
6804f1775cb4babfcc3851298566fbce?s=48 tanoku
85
8.4k
027d1ebf66cc039a0bd3b55eeadbe75d?s=48 sachag
447
36k
A60068bce2e73de3a37ca9d2dbe36092?s=48 bryan
100
11k
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
143
19k
C0b42577cfc2b321be3474618107e933?s=48 samanthasiow
56
6.2k
3ab1249be442027903e1180025340b3f?s=48 reverentgeek
26
1.8k
Aebc2d07a50011e2a30d38435fde564a?s=48 jrom
114
7k
15f2b8221f247985a27a627d2ece72f0?s=48 pauljervisheath
195
15k
A9179349dd2bdc67f377719f56d85656?s=48 garrettdimon
286
110k
64827b31aef81498662e8af4bd6d5157?s=48 jonrohan
1020
370k
D09fad3e36ae6841f54820be0e907f7a?s=48 rocio
155
11k

Transcript

  1. Visual Studio Codeで JavaScriptプログラミング 2020年2月2日（日） 2020年2月号第7回JavaScriptもくもく勉強会 @さくらインターネット本社

  2. About me 福井 洋（ふくい ひろし）（@echizenya_yota） （WordPress関連の個人事業主） http://e-yota.com/about_me/ https://speakerdeck.com/echizenyayota https://twitter.com/echizenya_yota コミュニティ活動

    さくらクラブJavaScriptプログラミングもくもく勉強会 管理人 https://saku-love.doorkeeper.jp/events/94737 WordCamp Osaka 2019 実行委員会(スポンサーチーム担当) https://2019.osaka.wordcamp.org/organizers/

  3. Visual Studio Codeとは MicroSoftが開発している 無料エディタ

  4. Visual Studio Code ダウンロード画面 https://azure.microsoft.com/ja-jp/products/visual-studio-code/

  5. Visual Studio Codeの特徴 - Emmetが標準搭載されている

  6. Emmetとは - HTML / CSS を効率的に書く記法

  7. Visual Studio Codeを使うメリット - HTML / CSS を「爆速」でコーディング - JS

    / CSSファイルをワンクリックで作成

  8. 「爆速」コーディングの紹介 1. HTMLのコーディング 2. scriptタグの記述とJSファイルの作成 3. CSS用のlinkタグの記述とファイルの作成

  9. 1. HTMLのコーディング

  10. “!” + tabキー

  11. “!” + tabキー

  12. “div#container” + tabキー

  13. “div#container” + tabキー

  14. “div.contents” + tabキー

  15. “div.contents” + tabキー

  16. “ul.colors>li*3” + tabキー

  17. “ul.colors>li*3” + tabキー

  18. 2. scriptタグの記述とJSファイルの作成

  19. “script:src” + tabキー

  20. “script:src” + tabキー

  21. フォルダ名とファイル名を記述

  22. Follow link

  23. 3. CSS用リンクタグの記述とファイルの作成

  24. “link:css” + tabキー

  25. “link:css” + tabキー

  26. Follow Link

  27. Emmet Cheat Sheet https://docs.emmet.io/cheat-sheet/

  28. ハッシュタグ #さくらクラブ

  29. ご清聴ありがとうございました！

  30. 自己紹介タイム 1. 名前 2. 興味のある技術 3. 今日やりたいこと