Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
React+TypeScriptで拡張機能が開発できるRaycastのススメ / 202210...
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Yuji Yamaguchi
October 27, 2022
Programming
1k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
React+TypeScriptで拡張機能が開発できるRaycastのススメ / 20221027_Raycast
Yuji Yamaguchi
October 27, 2022
More Decks by Yuji Yamaguchi
See All by Yuji Yamaguchi
Oxlintはいいぞ(続)
yug1224
1
780
螺旋階段のように上がるEMの次のキャリア
yug1224
1
430
ルールを書いて終わらせないハーネスエンジニアリング
yug1224
5
2k
バラバラだった staleTime を、データの性質で4プリセットに集約する
yug1224
1
88
Oxcを導入して開発体験が向上した話
yug1224
5
570
EMからICへのキャリアチェンジの壁とその越え方
yug1224
5
400
Cursor Subagentsはいいぞ
yug1224
2
250
EMからICへ、二周目人材としてAI全振りのプロダクト開発で見つけた武器
yug1224
5
2.4k
Oxlintはいいぞ
yug1224
5
3.9k
Other Decks in Programming
See All in Programming
Java 27新機能 / Java 27 new features
kishida
2
200
仕様駆動開発による爆速プロダクト開発 / Bakusoku Spec Driven Development
kobakei
0
210
UPDATE をやめる — EF Core でマスタをバージョン管理する
panda728
PRO
0
1.1k
技術的負債を組織課題として解く-増えすぎたマイクロサービスとの戦い-
reimaru
1
2.9k
setup-vp GitLab対応の裏側
naokihaba
0
150
phperだってパンチカードでコーディングしたい
o0h
PRO
0
230
The Rails Doctrine Decade
koic
2
520
ジョジョの世界をXRで再現する
mofurune
0
140
dotNET_vulnclicker_intro.pdf
deka_morita
0
110
AWSに止められる覚悟してますか?
morizo_1984
2
520
APNsからLive Activityを開始する話
yumnumm
0
150
プロダクトコードからライブラリの境界を見つける
elmetal
PRO
0
110
Featured
See All Featured
Reality Check: Gamification 10 Years Later
codingconduct
0
2.3k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
123
22k
Paper Plane (Part 1)
katiecoart
PRO
2
11k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.6k
The Curious Case for Waylosing
cassininazir
1
560
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
1
570
Faster Mobile Websites
deanohume
310
32k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
320
Context Engineering - Making Every Token Count
addyosmani
9
1.2k
My Coaching Mixtape
mlcsv
0
340
Design in an AI World
tapps
1
350
Abbi's Birthday
coloredviolet
4
10k
Transcript
React+TypeScriptで 拡張機能が開発できる Raycastのススメ Yuji Yamaguchi/@yug1224 Reactをもっと語りたい!
▸ ヤマグチ ユウジ(34) ▸ Tw: @yug1224 ▸ フロントエンドエンジニア ▸ 三児の⽗
▸ 11歳、9歳、1歳 ▸ 最近の趣味 ▸ ホームオートメーション ⾃⼰紹介 2 ▸ 2011年04⽉ 通信系企業 ▸ Webコンテンツサービスの開発運⽤ ▸ 2016年01⽉ ネット広告系企業 ▸ 広告配信管理システムの開発運⽤ ▸ 2016年10⽉ ITサービス企業 ▸ 飲⾷店向け予約台帳システムの開発 ▸ 2021年10⽉ SaaS企業 ▸ 勤怠管理システムの開発 ▸ 2022年08⽉ HRTech企業 ▸ エンジニアリングマネージャー
3 ランチャーアプリを 使っていますか?🙋
ランチャーって何? ▸ ショートカットキーのキーボード操作やボタンクリックなどの操作で、 ファイルやアプリケーションソフトウェアを簡単に起動できる機能やツール ▸ 例えば... ▸ PowerToys (win)
▸ Spotlight (mac) ▸ Alfred (mac) ▸ Ueli (win/mac) ▸ Raycast (mac) 4
5
Raycastって何? ▸ Raycast is a blazingly fast, totally extendable launcher.
▸ AlfredやSpotlightに似たランチャーツール ▸ 設定や拡張機能が豊富で、 コマンドやスニペットをチームで共有することができる ▸ API・パッケージが公開されており、 拡張機能をReact+TypeScriptで開発することができる ▸ npmパッケージやNode.js標準モジュールも利⽤できる 6
7 DEMO
作ってみたもの ▸ AVERAGEを求める拡張 ▸ IPアドレスを求める拡張 8
まとめ ランチャーとは、 ショートカットキーのキーボード操作やボタンクリックなどの操作で、 ファイルやアプリケーションソフトウェアを簡単に起動できる機能やツールのこと Raycastは⾼速⾼機能なランチャーアプリで、 React+TypeScriptで拡張機能を開発することができる スタイルなどを⾃由に当てられるわけではないので、
表現できるUIには限りがある 9
10 EOF