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
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
2
790
螺旋階段のように上がるEMの次のキャリア
yug1224
1
440
ルールを書いて終わらせないハーネスエンジニアリング
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
IBM Bob Dojo #1 仕様駆動開発入門
oniak3ibm
PRO
0
370
Verilogで学ぶCPU自作入門
uyuki234
8
4.1k
Simple Storage Service(S3) is not simple
iwatsukayura
0
250
気持ちぃ〜角丸 Squircle
ryu1013
0
200
RAG の “R” を Swift で覗いてみる 〜「意味から探す」検索の仕組み〜
nao_randd
0
130
UnityでSystem.Net.WebSocketsなWebSocketサーバが動かないのでUnity Monoのコードを覗いてみた / about implementing websocket server with unity mono
drumath2237
1
580
ハーネス設計入門 〜 基礎知識の整理から実務へのステップアップ 〜
kinopeee
22
22k
速習iPhone Duo対応
yuukiw00w
2
980
GemmaをJevのように使ってみる / Use Gemma like Jev
kishida
5
760
APNsからLive Activityを開始する話
yumnumm
0
160
mrbgem 三角測量 開発
ogom
0
230
更なる可用性を求めて、5年間運用したKotlinのアプリケーションをGoでリプレイスする話
ken_tunc
0
470
Featured
See All Featured
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
980
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
2
360
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
akashhashmi
0
520
Product Roadmaps are Hard
iamctodd
55
13k
How to Ace a Technical Interview
jacobian
280
24k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
7k
Design in an AI World
tapps
1
350
Navigating Team Friction
lara
192
16k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.3k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.8k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.6k
A designer walks into a library…
pauljervisheath
211
25k
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