Today I realized that I use Raycast quite a lot*.

In fact, I replaced the CMD+Spacebar¹ shortcut with Raycast!

What is Raycast and why do you use it?

Raycast is a tool for productivity, which can replace Spotlight on your Macbook; in fact, it replaces it and makes it better! You can use it to search files on your computer, but also to launch pretty much any automation in seconds without lifting fingers from your keyboard! Neat right?

Raycast is built so that you can re-use their platform and UI components to build an interface for your application.

In my case, I wanted to create a quick proof of concept extension to capture a Clip without having to navigate to the Dashcam app, meaning I can just run Raycast and click “Create clip” and the action will trigger Dashcam to create a clip

Behind the scenes, Raycast uses Electron, just like Dashcam to bring native desktop capabilities onto the Mac. Another advantage of using Electron with extensions is that it provides each extension its own isolated sandbox.

Extensions make Raycast, and you can install them from the marketplace, build them from scratch and share them!

Raycast extensions allow you to add custom functionality and features directly into the Raycast app. In this post, we’ll walk through building a simple extension for Dashcam!

Creating your first extension

Run the Create Extension command in Raycast

Choose the Template: Detail
Name your extension: Since we’re building the Dashcam extensions, let’s call this Dashcam
Extension Name: the command Create Clip
Location: anywhere that works for you, for me that is ~/projects/raycast-ext

If you scroll a little lower, you can specify what the name of your command will be and a description.

I picked Create a clip for the command name and Create a clip with a click for the description – you can always change these by editing package.json later on!

Now, click Create Extension (⌘+Return) – and you’re done with the setup phase

Let’s start coding

Navigate to the folder specified in the Location field and run npm install && npm run dev

This should now allow you to have your environment ready for building your Raycast extension using React!

Open up the index.tsx file and slap the following code in it:

import { closeMainWindow, Detail } from "@raycast/api";
import { runAppleScript } from "run-applescript";

export default function Command() {
  closeMainWindow();
  runAppleScript(`
    tell application "System Events"
        keystroke "r" using {command down, option down}
    end tell
  `);
  return <Detail markdown="## Opening Dashcam and capturing a clip" />;
}

This code utilizes Applescript to emulate pressing the shortcut to create a Dash clip with Dashcam! It also hides the Raycast UI after running that command, so it gets out of the way asap.

Then top the cake with a cherry by installing the Applescript dependency:

npm install run-applescript

This will let you run Applescript commands through Raycast!

Now you can run npm run dev and you can immediately test your newly created extension in Raycast in local mode!

What’s next?

This is a super simple extension; you can use this as a building block for a more complicated extension, for example, I could implement a whole video management console – so you can delete or keep specific Dashcam clips..but for now, we stop here!

1. more on and how I use it will be the topic of another blog post ↩︎