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
36
VisualStudioCodeの拡張機能を作ってみた!
Azusa Okamoto
February 27, 2022
Tweet
Share
More Decks by Azusa Okamoto
See All by Azusa Okamoto
Go初心者が開発やってみた!
azunyan
1
480
デブサミウーマン2023 アウトプットって何が良いの?
azunyan
0
940
TECH WOMAN KANSAIオンラインもくもく会の流れ
azunyan
0
46
個人的に楽しかった実装2022
azunyan
0
93
TestCaféでE2Eテスト!
azunyan
0
110
vanilla-extractを使ってみた!with React
azunyan
1
730
Next.js・microCMSで ポートフォリオサイトを作りかえて学んだこと
azunyan
0
2k
Other Decks in Programming
See All in Programming
見せてあげますよ、「本物のLaravel批判」ってやつを。
77web
7
7.9k
ActiveSupport::Notifications supporting instrumentation of Rails apps with OpenTelemetry
ymtdzzz
1
260
Remix on Hono on Cloudflare Workers
yusukebe
1
340
距離関数を極める! / SESSIONS 2024
gam0022
0
320
ふかぼれ!CSSセレクターモジュール / Fukabore! CSS Selectors Module
petamoriken
0
160
Contemporary Test Cases
maaretp
0
140
.NET のための通信フレームワーク MagicOnion 入門 / Introduction to MagicOnion
mayuki
1
2.3k
Amazon Bedrock Agentsを用いてアプリ開発してみた!
har1101
0
360
@nifty天気予報:フルリニューアルの挑戦 - NIFTY Tech Talk #22
niftycorp
PRO
0
110
WebフロントエンドにおけるGraphQL(あるいはバックエンドのAPI)との向き合い方 / #241106_plk_frontend
izumin5210
4
1.4k
Welcome JSConf.jp 2024
yosuke_furukawa
PRO
0
2.1k
Flutterを言い訳にしない!アプリの使い心地改善テクニック5選🔥
kno3a87
3
310
Featured
See All Featured
Embracing the Ebb and Flow
colly
84
4.5k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
93
17k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
26
2.1k
The Art of Programming - Codeland 2020
erikaheidi
52
13k
Music & Morning Musume
bryan
46
6.2k
Reflections from 52 weeks, 52 projects
jeffersonlam
346
20k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
506
140k
Building a Scalable Design System with Sketch
lauravandoore
459
33k
Rails Girls Zürich Keynote
gr2m
94
13k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
48k
How To Stay Up To Date on Web Technology
chriscoyier
788
250k
Designing Experiences People Love
moore
138
23k
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のおかげで、環境構築の心配は不要なので、 機能開発・メソッドについての学習に集中できた!
ご清聴ありがとうございました!