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
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Azusa Okamoto
February 27, 2022
Programming
0
100
VisualStudioCodeの拡張機能を作ってみた!
Azusa Okamoto
February 27, 2022
Tweet
Share
More Decks by Azusa Okamoto
See All by Azusa Okamoto
GraphQLでAPI開発 やってみよう!
azunyan
0
16
「わたし色」の見方で拓く世界
azunyan
0
21
ちゃんとSvelte, Hello Worldした!
azunyan
0
54
最近取り組んでいることについて喋ってみる
azunyan
0
16
フロントエンドエンジニアが関数型プログラミングに出会った話
azunyan
0
110
TECH WOMAN KANSAIの 取り組みと今後~2024年の振り返りと2025年へ~
azunyan
0
93
Go初心者が開発やってみた!
azunyan
1
560
デブサミウーマン2023 アウトプットって何が良いの?
azunyan
0
1.2k
個人的に楽しかった実装2022
azunyan
0
140
Other Decks in Programming
See All in Programming
CSC307 Lecture 07
javiergs
PRO
1
560
ぼくの開発環境2026
yuzneri
0
240
AIエージェント、”どう作るか”で差は出るか? / AI Agents: Does the "How" Make a Difference?
rkaga
4
2k
React Native × React Router v7 API通信の共通化で考えるべきこと
suguruooki
0
100
「ブロックテーマでは再現できない」は本当か?
inc2734
0
1k
開発者から情シスまで - 多様なユーザー層に届けるAPI提供戦略 / Postman API Night Okinawa 2026 Winter
tasshi
0
210
CSC307 Lecture 05
javiergs
PRO
0
500
【卒業研究】会話ログ分析によるユーザーごとの関心に応じた話題提案手法
momok47
0
200
Vibe Coding - AI 驅動的軟體開發
mickyp100
0
180
QAフローを最適化し、品質水準を満たしながらリリースまでの期間を最短化する #RSGT2026
shibayu36
2
4.4k
高速開発のためのコード整理術
sutetotanuki
1
410
AIで開発はどれくらい加速したのか?AIエージェントによるコード生成を、現場の評価と研究開発の評価の両面からdeep diveしてみる
daisuketakeda
1
2.5k
Featured
See All Featured
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
350
Optimizing for Happiness
mojombo
379
71k
Making Projects Easy
brettharned
120
6.6k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
66
37k
Game over? The fight for quality and originality in the time of robots
wayneb77
1
120
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
122
21k
Mind Mapping
helmedeiros
PRO
0
90
A designer walks into a library…
pauljervisheath
210
24k
How to build a perfect <img>
jonoalderson
1
4.9k
We Have a Design System, Now What?
morganepeng
54
8k
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
130
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
330
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のおかげで、環境構築の心配は不要なので、 機能開発・メソッドについての学習に集中できた!
ご清聴ありがとうございました!