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
Visual Studio CodeでJavaScriptプログラミング
Search
echizenyayota
February 02, 2020
Programming
0
260
Visual Studio CodeでJavaScriptプログラミング
さくらクラブ 2020年2月号第7回 JavaScriptプログラミングもくもく勉強会の日
echizenyayota
February 02, 2020
Tweet
Share
More Decks by echizenyayota
See All by echizenyayota
日本語話者と英語話者のためのIT技術者交流コミュニティ_事始め_日本語_英語_.pdf
echizenyayota
0
350
外出自粛期間のおすすめ! オンラインサービスで 自由気ままな英語学習
echizenyayota
0
440
他人のソースコードをすばやく読むコツ 項とJavaScriptの演算子
echizenyayota
0
110
ドットインストールの質問回答サービスで身につくプログラミング学習法
echizenyayota
0
120
「Webパフォーマンス改善セミナー」 概要説明
echizenyayota
1
49
JavaScriptの正規表現で リファラースパムを退治した話
echizenyayota
0
110
JavaScriptの新しい文法を学習しよう
echizenyayota
1
320
さくらのVPSでプラグインを使わないWordPressのバックアップ
echizenyayota
0
1.3k
JavaScriptの新しい文法を学習しよう ~Reactで見るECMAScript2015のクラス構文~
echizenyayota
0
310
Other Decks in Programming
See All in Programming
ビット演算の話 / Let's play with bit operations
kaityo256
PRO
4
170
個人開発で使ってるやつを紹介する回
yohfee
1
690
ACES Meet におけるリリース作業改善の取り組み
fukucheee
0
130
RDBの世界をぬりかえていくモデルグラフDB〜truncus graphによるモデルファースト開発〜
jurabi
0
160
ファーストペンギンBot @Qiita Hackathon 2024 予選
dyson_web
0
220
tsconfig.jsonの最近の新機能 ファイルパス編
uhyo
6
1.5k
Iteratorでページネーションを実現する
sonatard
3
700
Pythonによるイベントソーシングへの挑戦と現状に対する考察 / Challenging Event Sourcing with Python and Reflections on the Current State
nrslib
3
960
CSC509 Lecture 03
javiergs
PRO
0
140
RemixとCloudflare Stack におけるFile Upload
ossamoon
1
120
Modern Functional Fluent CFML REST by Luis Majano
ortus24
0
140
Делим тесты между QA и разработчиком
mariyasaygina
0
520
Featured
See All Featured
Bootstrapping a Software Product
garrettdimon
PRO
304
110k
Bash Introduction
62gerente
608
210k
Why You Should Never Use an ORM
jnunemaker
PRO
53
9k
Learning to Love Humans: Emotional Interface Design
aarron
272
40k
In The Pink: A Labor of Love
frogandcode
139
22k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
663
120k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
249
21k
Being A Developer After 40
akosma
84
590k
GraphQLとの向き合い方2022年版
quramy
43
13k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.2k
StorybookのUI Testing Handbookを読んだ
zakiyama
26
5.1k
Designing Experiences People Love
moore
138
23k
Transcript
Visual Studio Codeで JavaScriptプログラミング 2020年2月2日(日) 2020年2月号第7回JavaScriptもくもく勉強会 @さくらインターネット本社
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/
Visual Studio Codeとは MicroSoftが開発している 無料エディタ
Visual Studio Code ダウンロード画面 https://azure.microsoft.com/ja-jp/products/visual-studio-code/
Visual Studio Codeの特徴 - Emmetが標準搭載されている
Emmetとは - HTML / CSS を効率的に書く記法
Visual Studio Codeを使うメリット - HTML / CSS を「爆速」でコーディング - JS
/ CSSファイルをワンクリックで作成
「爆速」コーディングの紹介 1. HTMLのコーディング 2. scriptタグの記述とJSファイルの作成 3. CSS用のlinkタグの記述とファイルの作成
1. HTMLのコーディング
“!” + tabキー
“!” + tabキー
“div#container” + tabキー
“div#container” + tabキー
“div.contents” + tabキー
“div.contents” + tabキー
“ul.colors>li*3” + tabキー
“ul.colors>li*3” + tabキー
2. scriptタグの記述とJSファイルの作成
“script:src” + tabキー
“script:src” + tabキー
フォルダ名とファイル名を記述
Follow link
3. CSS用リンクタグの記述とファイルの作成
“link:css” + tabキー
“link:css” + tabキー
Follow Link
Emmet Cheat Sheet https://docs.emmet.io/cheat-sheet/
ハッシュタグ #さくらクラブ
ご清聴ありがとうございました!
自己紹介タイム 1. 名前 2. 興味のある技術 3. 今日やりたいこと