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
VisualStudioCodeの拡張機能を作ってみた!
Search
Azusa Okamoto
February 27, 2022
Programming
0
70
VisualStudioCodeの拡張機能を作ってみた!
Azusa Okamoto
February 27, 2022
Tweet
Share
More Decks by Azusa Okamoto
See All by Azusa Okamoto
TECH WOMAN KANSAIの 取り組みと今後~2024年の振り返りと2025年へ~
azunyan
0
48
Go初心者が開発やってみた!
azunyan
1
510
デブサミウーマン2023 アウトプットって何が良いの?
azunyan
0
1k
TECH WOMAN KANSAIオンラインもくもく会の流れ
azunyan
0
62
個人的に楽しかった実装2022
azunyan
0
110
TestCaféでE2Eテスト!
azunyan
0
130
vanilla-extractを使ってみた!with React
azunyan
1
780
Next.js・microCMSで ポートフォリオサイトを作りかえて学んだこと
azunyan
0
2k
Other Decks in Programming
See All in Programming
CIBMTR振り返り+敗北から学ぶコンペの取り組み方反省
takanao
1
230
Generating OpenAPI schema from serializers throughout the Rails stack - Kyobashi.rb #5
envek
1
450
やっと腹落ち「スプリント毎に動くモノをリリースする」〜ゼロから始めるメガバンクグループのアジャイル実践〜
sasakendayo
0
230
iOSでQRコード生成奮闘記
ktcryomm
2
140
Jasprが凄い話
hyshu
0
200
JAWS Days 2025のインフラ
komakichi
1
370
Webフレームワークとともに利用するWeb components / JSConf.jp おかわり
spring_raining
1
150
はじめてのIssueOps - GitHub Actionsで実現するコメント駆動オペレーション
tmknom
5
1.5k
Expoによるアプリ開発の現在地とReact Server Componentsが切り開く未来
yukukotani
2
290
The Clean ArchitectureがWebフロントエンドでしっくりこないのは何故か / Why The Clean Architecture does not fit with Web Frontend
twada
PRO
62
20k
PromptyによるAI開発入門
ymd65536
1
100
クリーンアーキテクチャから見る依存の向きの大切さ
shimabox
5
1.2k
Featured
See All Featured
Visualization
eitanlees
146
15k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
270
Statistics for Hackers
jakevdp
797
220k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
13
1k
How GitHub (no longer) Works
holman
314
140k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
4
390
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7.1k
Navigating Team Friction
lara
183
15k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
45
9.4k
The Invisible Side of Design
smashingmag
299
50k
Transcript
Visual Studio Codeの 拡張機能を作ってみた!! 2/27 とにかくほめる!マウントなしのLT会 あずにゃん
自己紹介
2020.10 フルタイムアルバイト (運用・保守) 2021.10 現在の会社に 入社 自己紹介
自己紹介 お仕事では、フロントを主に担当。 最近は、PHPに興味があって、勉強中!! 趣味は、簡単な個人開発。
Twitterやってます。 Twitter:@azunyan_eng フォローして頂いてOKです! 自己紹介
開発した拡張機能について
開発した拡張機能について 「Greeting VSCode」
開発した拡張機能について VSCode起動時にメッセージが表示される! メッセージはランダム。
ココ!
開発したきっかけ
開発したきっかけ 積読の中にVSCodeの拡張機能開発について特集されている WEB+DB PRESSがあった。 自分でVSCodeを使うときに、何かメッセージが出てきたら嬉しい と思ったから。
VSCode拡張機能開発の始め方
VSCode拡張機能開発の始め方 ①YeomanとVS Code Extension Generator をインストール。 ②yo code 以下の2つを実行すると開発を始められる!!
Yeomanとは?
Yeomanとは? プロジェクトのひな型を作成するためのツール。 色々なテンプレートが用意されていて、 指定したテンプレートのひな型を作成してくれる。
VS Code Extension Generatorは、 VSCodeの拡張機能開発で使うテンプレート。 Yeomanとは?
ランダム出力について
ランダム出力について 出力予定のメッセージは、配列に格納しておく。 Math.random()を利用して、配列のインデックス番号を ランダムで出力するようにしている。
Math.random()
Math.random() 0以上1未満の浮動小数点数の疑似乱数が返ってくる。 ※疑似乱数と乱数はちょっと違う...? 疑似乱数 = 計算によって求められている乱数。 乱数 = 規則性のない数字。
Math.random()×配列の長さ
Math.random()×配列の長さ 最低:0 最高:配列の最後のインデックス番号 ...の範囲の疑似乱数を出力。
Math.random()×配列の長さ あとは、Math.floor()を使って整数に直すと、 インデックス番号として利用できるようになる。 配列のインデックス番号がランダムになり、 値もランダムに出現することになる!
やってみた感想
やってみた感想 Visual Studio Marketplaceに、 自分が開発した拡張機能が並ぶと感動✨ 公式ドキュメントで説明がしっかりされているので、 始めやすい! Yeomanのおかげで、環境構築の心配は不要なので、 機能開発・メソッドについての学習に集中できた!
ご清聴ありがとうございました!