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

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

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
91
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
59
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
48
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
1
25
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
34
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
1
200
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
730
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
140
61e8d2d797a37913aafaeb8e8b38c373?s=48 echizenyayota
0
410

Other Decks in Programming

See All in Programming
C44d9ff0fb47045ae04e3183694c7d68?s=48 wafuwafu13
0
290
0620564f0125b8b3b7f4fe40c10b8b4e?s=48 tattn
0
4.6k
8665aad8f35b1710df79e9aef52d6daa?s=48 alexandresalome
0
230
465a530291aedb53fff5a6333e3dedaa?s=48 bk_18
0
210
85caff7f89434c74e9c6b4287d3c8e05?s=48 yoseiyamagishi
2
190
9e64d2069945742c818421e884603b44?s=48 ushisantoasobu
4
140
72a2082c6a4dd79ad68befb3db911616?s=48 mraible
1
100
0aa238a274c2397214b20d6eed58939b?s=48 moomooya
2
400
0157a830bfaa0c5426422c45aa0b2637?s=48 bo0km4n
3
430
6d64a4d4ab6201f2ce57e3befc687785?s=48 yoshi0202
0
130
249b3122eee454c0a818bfe7851418e4?s=48 fromkk
1
280
87137598c23e3e90755e5d7476d21405?s=48 bastnic
1
330

Featured

See All Featured
9cde37f47e4a800ea081ea42de8d749a?s=48 dougneiner
55
5.3k
D8fc2580cfaca035f666d9e4ee79a7f7?s=48 mongodb
23
3.7k
25c7c18223fb42a4c6ae1c8db6f50f9b?s=48 mojombo
356
62k
7653c7c449918ff6542880a8c284f5e7?s=48 jponch
101
4.8k
A0517b08532aec8ab2aae3f65d40ad86?s=48 hannesfritz
26
870
245cee81a9c424266e5e401d844ea881?s=48 lara
169
9.2k
F68cb25ae3e5c2106997454b13b7737d?s=48 brad_frost
154
6.2k
D67fff74178013024d833b3eec6cf27f?s=48 lynnandtonic
266
16k
4394ceb8b277f35ee3da7030384efb5d?s=48 davidbonilla
68
3.4k
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
142
19k
1519587b1a0febb658c36c94f6272b0d?s=48 roundedbygravity
241
20k
44b54d2ffcb7857004071cc6795dde11?s=48 cassininazir
345
20k

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. 今日やりたいこと