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のススメ / 202210...
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
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
Oxcを導入して開発体験が向上した話
yug1224
4
290
EMからICへのキャリアチェンジの壁とその越え方
yug1224
5
280
Cursor Subagentsはいいぞ
yug1224
2
180
EMからICへ、二周目人材としてAI全振りのプロダクト開発で見つけた武器
yug1224
5
1.5k
Oxlintはいいぞ
yug1224
5
3.3k
Figma + Storybook + PlaywrightのMCPを使ったフロントエンド開発
yug1224
13
6.3k
メンバーの成長速度にバフをかける1on1ミーティング / 2024-12-06
yug1224
25
13k
強みを伸ばすキャリアデザイン
yug1224
3
580
インターンと盛り上げる全社員参加型Advent Calendarの作り方 / 2024-02-22-QiitaNight
yug1224
1
180
Other Decks in Programming
See All in Programming
並列実装の現場、2ヶ月間実務でAIを使い倒したAIもPCも私も限界が近い
ming_ayami
0
110
Make SRE Operations Easier with Azure SRE Agent
kkamegawa
0
4.3k
Semantic Version 単位で戦略を柔軟に変えて、パッケージアップデートを自動化する
daitasu
0
160
Lessons from Spec-Driven Development
simas
PRO
0
140
Spring Security 実践 ─ GraphQL APIで実務に役立つ 認証・認可 を学ぶ
wagyu
0
160
Spec-Driven Development with AI-Agents: From High-Level Requirements to Working Software
antonarhipov
2
460
AI時代の仕事技芸論 — ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ
kuranuki
1
620
ADKを使って簡単にAIエージェントを作ってみよう
k1mu21
0
230
Modding RubyKaigi for Myself
yui_knk
0
890
Old Dog, New Tricks: The Java 25 Reinvention - JNation
bazlur_rahman
0
150
開発体験を左右するライブラリの API 設計 - GraphQL スキーマ構築ライブラリから考える #tskaigi
izumin5210
2
1.6k
脅威をエンジニアリングの糧にして――現場編 / Turning Threats into Engineering Fuel — Field Edition
nrslib
0
250
Featured
See All Featured
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
350
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
150
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
220
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
62
54k
How GitHub (no longer) Works
holman
316
150k
Visualization
eitanlees
152
17k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
8.2k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
250
1.3M
The Mindset for Success: Future Career Progression
greggifford
PRO
0
350
4 Signs Your Business is Dying
shpigford
187
22k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
520
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.7k
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