https://github.com/electric-sql/shape-explorer
Playground for creating shapes
https://github.com/electric-sql/shape-explorer
Last synced: about 1 month ago
JSON representation
Playground for creating shapes
- Host: GitHub
- URL: https://github.com/electric-sql/shape-explorer
- Owner: electric-sql
- Created: 2025-01-28T21:13:50.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-04-17T17:37:22.000Z (12 months ago)
- Last Synced: 2025-06-23T09:48:47.013Z (9 months ago)
- Language: TypeScript
- Size: 156 KB
- Stars: 2
- Watchers: 6
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Electric Shape Explorer
A web interface for exploring Shape queries to your Electric server. This tool provides a simple way to query Electric and visualize the results.
`npx git-scaffold electric-sql/shape-explorer shape-explorer`
## Features
- **Simple Query Interface**: Enter table names and WHERE clauses to query your data
- **Real-time Results**: See your query results instantly
- **Keyboard Shortcuts**: Submit queries quickly with Cmd/Ctrl + Enter
- **Shareable URLs**: Share queries easily with URL-based state
## Use with Electric Cloud
Copy `.env.sample` to `.env` and then add your `SOURCE_ID` and `SECRET`.
## Why Electric SQL?
Electric SQL syncs subsets of your Postgres data into local apps and services. Here's what it solves:
### State Transfer
- Replaces data fetching with data sync
- Simplifies your code
- Eliminates loading spinners
### Cache Invalidation
- Replaces TTLs and expiry policies with realtime sync
- Automated invalidation
- No more stale data
### Scaling
- Takes query workload off your database
- Reduces compute workload on your cloud
- Lowers cloud bills
## Getting Started
1. Install dependencies:
```bash
npm install
```
2. Start the development server:
```bash
npm run dev
```
3. Open [http://localhost:3000](http://localhost:3000) to start exploring your Electric database
## Using Shape Explorer
1. Enter a table name in the "Table Name" field
2. Optionally add a WHERE clause to filter results
3. Click "Query" or press Cmd/Ctrl + Enter to execute
4. View results in the table below
## Environment Variables
- `ELECTRIC_URL`: Your Electric SQL service URL
- `ELECTRIC_SECRET`: Your Electric source secret
- `ELECTRIC_SOURCE_ID`: Your Electric source ID
## Learn More
- [Electric SQL Documentation](https://electric-sql.com/docs)
- [Shape API Reference](https://electric-sql.com/docs/api/shape)