|
1 | 1 | # stream-viz |
2 | 2 |
|
3 | | -[](https://img.shields.io/github/v/release/dgrah50/stream-viz) |
4 | | -[](https://github.com/dgrah50/stream-viz/actions/workflows/main.yml?query=branch%3Amain) |
5 | | -[](https://codecov.io/gh/dgrah50/stream-viz) |
6 | | -[](https://img.shields.io/github/commit-activity/m/dgrah50/stream-viz) |
7 | | -[](https://img.shields.io/github/license/dgrah50/stream-viz) |
| 3 | +A real-time streaming SQL visualization tool. Write SQL queries against a [Timeplus Proton](https://github.com/timeplus-io/proton) streaming database and instantly see results rendered as live-updating data grids and charts powered by [Perspective](https://perspective.finos.org/). |
8 | 4 |
|
9 | | -A web app for visualizing streaming data |
| 5 | +The app provides a split-pane interface: a SQL editor on top (with table/column autocomplete) and a Perspective data viewer on the bottom. Run a streaming query and watch the results flow in and update in real time -- including support for tumbling window aggregations and filtered streams. |
10 | 6 |
|
11 | | -- **Github repository**: <https://github.com/dgrah50/stream-viz/> |
12 | | -- **Documentation** <https://dgrah50.github.io/stream-viz/> |
| 7 | +## Architecture |
13 | 8 |
|
14 | | -## Getting started with your project |
| 9 | +- **Backend** (Python/FastAPI): WebSocket server that executes streaming SQL queries against Timeplus/Proton, manages query lifecycle (start/stop/restart), and feeds results into Perspective tables over a second WebSocket channel. |
| 10 | +- **Frontend** (React/TypeScript/Vite): CodeMirror-based SQL editor with schema-aware autocomplete, connected to Perspective viewers for live data grids and D3 charts. State managed with Zustand. |
15 | 11 |
|
16 | | -### 1. Create a New Repository |
| 12 | +## Prerequisites |
17 | 13 |
|
18 | | -First, create a repository on GitHub with the same name as this project, and then run the following commands: |
| 14 | +- Python 3.9+ |
| 15 | +- [uv](https://docs.astral.sh/uv/) (Python package manager) |
| 16 | +- Node.js 18+ |
| 17 | +- A running [Timeplus Proton](https://github.com/timeplus-io/proton) instance |
19 | 18 |
|
20 | | -```bash |
21 | | -git init -b main |
22 | | -git add . |
23 | | -git commit -m "init commit" |
24 | | -git remote add origin git@github.com:dgrah50/stream-viz.git |
25 | | -git push -u origin main |
26 | | -``` |
| 19 | +## Getting Started |
27 | 20 |
|
28 | | -### 2. Set Up Your Development Environment |
| 21 | +### Timeplus Proton |
29 | 22 |
|
30 | | -Then, install the environment and the pre-commit hooks with |
| 23 | +Start a Proton instance with Docker: |
31 | 24 |
|
32 | 25 | ```bash |
33 | | -make install |
| 26 | +docker run -d --name proton -p 8463:8463 -p 3218:3218 d.timeplus.com/timeplus-io/proton:latest |
34 | 27 | ``` |
35 | 28 |
|
36 | | -This will also generate your `uv.lock` file |
| 29 | +### Backend |
37 | 30 |
|
38 | | -### 3. Run the pre-commit hooks |
| 31 | +```bash |
| 32 | +# Install dependencies |
| 33 | +uv sync |
| 34 | + |
| 35 | +# Run the server |
| 36 | +uv run python -m stream_viz.main |
| 37 | +``` |
39 | 38 |
|
40 | | -Initially, the CI/CD pipeline might be failing due to formatting issues. To resolve those run: |
| 39 | +The backend runs on `http://localhost:8585` by default. |
| 40 | + |
| 41 | +### Frontend |
41 | 42 |
|
42 | 43 | ```bash |
43 | | -uv run pre-commit run -a |
| 44 | +cd frontend |
| 45 | +npm install |
| 46 | +npm run dev |
44 | 47 | ``` |
45 | 48 |
|
46 | | -### 4. Commit the changes |
| 49 | +### Configuration |
47 | 50 |
|
48 | | -Lastly, commit the changes made by the two steps above to your repository. |
| 51 | +Create a `.env` file in the project root: |
49 | 52 |
|
50 | | -```bash |
51 | | -git add . |
52 | | -git commit -m 'Fix formatting issues' |
53 | | -git push origin main |
| 53 | +```env |
| 54 | +TIMEPLUS_HOST=localhost |
| 55 | +TIMEPLUS_PORT=8463 |
| 56 | +DEBUG=true |
54 | 57 | ``` |
55 | 58 |
|
56 | | -You are now ready to start development on your project! |
57 | | -The CI/CD pipeline will be triggered when you open a pull request, merge to main, or when you create a new release. |
| 59 | +See `src/stream_viz/config.py` for all available settings. |
58 | 60 |
|
59 | | -To finalize the set-up for publishing to PyPI, see [here](https://fpgmaas.github.io/cookiecutter-uv/features/publishing/#set-up-for-pypi). |
60 | | -For activating the automatic documentation with MkDocs, see [here](https://fpgmaas.github.io/cookiecutter-uv/features/mkdocs/#enabling-the-documentation-on-github). |
61 | | -To enable the code coverage reports, see [here](https://fpgmaas.github.io/cookiecutter-uv/features/codecov/). |
| 61 | +## Development |
62 | 62 |
|
63 | | -## Releasing a new version |
| 63 | +```bash |
| 64 | +# Install dev dependencies and pre-commit hooks |
| 65 | +make install |
64 | 66 |
|
| 67 | +# Run linting and type checks |
| 68 | +make check |
65 | 69 |
|
| 70 | +# Run tests |
| 71 | +make test |
| 72 | +``` |
66 | 73 |
|
67 | | ---- |
| 74 | +## License |
68 | 75 |
|
69 | | -Repository initiated with [fpgmaas/cookiecutter-uv](https://github.com/fpgmaas/cookiecutter-uv). |
| 76 | +MIT |
0 commit comments