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
React+TypeScriptで拡張機能が開発できるRaycastのススメ / 20221027_Raycast
Search
Yuji Yamaguchi
October 27, 2022
Programming
1
790
React+TypeScriptで拡張機能が開発できるRaycastのススメ / 20221027_Raycast
Yuji Yamaguchi
October 27, 2022
Tweet
Share
More Decks by Yuji Yamaguchi
See All by Yuji Yamaguchi
強みを伸ばすキャリアデザイン
yug1224
1
270
インターンと盛り上げる全社員参加型Advent Calendarの作り方 / 2024-02-22-QiitaNight
yug1224
1
70
2022ランキング圏外から2023ランキング入りを実現したテックブログ運営について / 2023-07-28-QiitaEngineerFesta
yug1224
0
80
Qiitaいいね数をGASで計測している話 / 2023-07-24-HRBrainFlyHigh
yug1224
1
670
HRBrainの生態系を支えるフロントエンドチームの取り組み / 2023-06-22-AwEngineerMeetup
yug1224
0
31
明日使えるかもしれないGitテクニック / Gunma.web#47
yug1224
0
230
DX向上委員会 / 20220922_dxhacklt
yug1224
1
170
n8nでワークフローを自動化した話 / 20220914_n8n
yug1224
1
1.5k
インシデントゼロを支える技術 / 20220315_devtestlt
yug1224
0
1.7k
Other Decks in Programming
See All in Programming
12年前の『型システム入門』翻訳の思い出話
mame
11
1.2k
Trial
cairolibrary720
1
130
From Spring Boot 2 to Spring Boot 3 with Java 22 and Jakarta EE
ivargrimstad
0
1.9k
CSC307 Lecture 08
javiergs
PRO
0
330
Rubyのパフォーマンスプロファイリングの改善 / Enhancing performance profiling for Ruby
osyoyu
1
410
Folding Cheat Sheet #7
philipschwarz
PRO
0
150
CSC307 Lecture 12
javiergs
PRO
0
220
Google's Recipe for Scaling (Web) Security – LocoMocoSec 2024
lweichselbaum
0
170
Architectures with Lightweight Stores: New Rules and Options
manfredsteyer
PRO
0
100
はしめてのプログラミングとロボット制御
watawatavoltage
0
290
わかりやすい正解を捨てて、コトに向き合う - スクラムフェス金沢2024 スポンサーセッション
yusukekokubo
0
170
Temporalを取り巻く仕様を整理する
sajikix
0
110
Featured
See All Featured
How to Think Like a Performance Engineer
csswizardry
4
590
Fireside Chat
paigeccino
25
2.8k
Adopting Sorbet at Scale
ufuk
71
8.8k
Pencils Down: Stop Designing & Start Developing
hursman
118
11k
The Pragmatic Product Professional
lauravandoore
29
6.1k
In The Pink: A Labor of Love
frogandcode
139
22k
Designing for Performance
lara
604
67k
Building Effective Engineering Teams - LeadDev
addyosmani
47
2.2k
RailsConf 2023
tenderlove
16
720
How To Stay Up To Date on Web Technology
chriscoyier
784
250k
Navigating Team Friction
lara
181
13k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
26
2.1k
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