@screenpipe/js
- for node.js environments (nextjs api routes, etc)@screenpipe/browser
- for browser environments
installation
node.js sdk
browser sdk
basic usage
search api
common usage patterns
fetching recent screen activity
searching for specific content
building a timeline of user activity
fetching website-specific content
vercel-like crons
you need to add apipe.json
file to your pipe folder with this config for example:
/api/log
route every 5 minutes.
check how the obsidian pipe implements this, route and pipe.json for a complete example.
we recommend using the CLI to add the update-pipe-config
server action to your pipe. this will allow you to update the pipe’s cron schedule using a server action.
realtime streams
react hooks sdk support ⚛️
screenpipe provides first-class support for React applications through custom hooks, enabling seamless integration with your React components. while you can manually create hooks using libraries like React Query, we recommend leveraging our built-in CLI to quickly add pre-built, optimized hooks to your pipes.using the cli to add hooks
the fastest way to integrate react hooks into your pipe is through our CLI:use-pipe-settings
: manage pipe-specific and global app settings.use-health
: monitor pipe health and status.use-ai-provider
: integrate seamlessly with ai providers.use-sql-autocomplete
: provide sql query assistance.
real-time meeting summarizer
⚠️ make sure to enable real time transcription in the screenpipe app settings or CLI args.real-time screen activity monitor
settings management
pipes can access and modify screenpipe app settings through the SDK. this is useful for storing pipe-specific configuration and accessing global app settings.quick start with CLI
the fastest way to add settings management to your pipe is using our CLI:use-pipe-settings
hook for react componentsget-screenpipe-app-settings
server action- required typescript types
manual setup
- create types for your settings:
- create server action to access settings:
- create react hook for settings management:
- use in your components:
best practices
- store pipe-specific settings under
customSettings.yourPipeName
in screenpipe app settings - use typescript for type safety
- provide default values for all settings
- handle loading and error states
- validate settings before saving
- use server actions for settings operations
- consider using shadcn/ui components for consistent UI