Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/maietta/sk-bun-websockets

A SvelteKit example showcasing real-time WebSocket functionality with the Bun adapter.
https://github.com/maietta/sk-bun-websockets

bun pocketbase-realtime svelte svelte-adapter-bun websockets

Last synced: 20 days ago
JSON representation

A SvelteKit example showcasing real-time WebSocket functionality with the Bun adapter.

Host: GitHub
URL: https://github.com/maietta/sk-bun-websockets
Owner: maietta
Created: 2024-12-03T02:30:00.000Z (21 days ago)
Default Branch: main
Last Pushed: 2024-12-03T04:07:45.000Z (21 days ago)
Last Synced: 2024-12-03T05:17:54.442Z (21 days ago)
Topics: bun, pocketbase-realtime, svelte, svelte-adapter-bun, websockets
Language: TypeScript
Homepage:
Size: 24.4 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# **SvelteKit + Bun + WebSockets**

A SvelteKit demo showcasing real-time WebSocket functionality with the Bun adapter, assuming Bun is used as both the package manager for development and runtime in production.

---

## **Features**
- **Singleton PocketBase Instance**: Manages WebSocket updates for real-time UI changes.
- **Basic Group Chat Example**: Demonstrates routing messages from the frontend to the `broadcastToClients` method in the singleton class for live communication across all visitors.
- **Basic Docker Healthcheck**: A simple endpoint

---

## **Hosting Requirements**

This application uses `svelte-adapter-bun`, designed for long-running server environments. It is **not compatible** with serverless platforms.
A **Dockerfile** is included for customization to suit specific hosting requirements.

---

## **Development Setup**

To run the project in development mode, set up two servers:

1. **WebSocket Server**
Start the WebSocket server:
```bash
bun bunServer.ts
```

2. **SvelteKit Development Server**
Start the SvelteKit development server:
```bash
bun dev
```

---

## **Before You Start**
- Update `src/lib/pocketbase.ts` with your PocketBase connection URL and the name of a collection (table) you wish to monitor.
- Update `src/lib/singletonPocketBase.ts` to define the PocketBase collection to monitor in real time.

---

## **Additional Notes**
- Hosting has been tested with **Coolify** and **Caprover**, but will work any place you can run a Dockerfile like the one included.
- Compatible with proxies like **Traefik**, **Caddy**, and **Nginx**.
- For **Caprover**, enable WebSocket support in the app settings. If the **Caprover CLI** is installed, you can use the provided `deploy.sh` script for deployment.
- At the time of this writing, you can get a free instance of Pocketbase at https://pocketbase.io, or you can host your own copy of the MIT Licensed, Open Source software on your own server.
- The Dockerfile is far more verbose than needed, because it includes Node runtime as well. Some dependencies may require it, which is why It's included in my example to help keep you covered in those scenarios.
- This project was adapted from https://github.com/gornostay25/svelte-adapter-bun/tree/master/examples/e2e, but modernized to work with Svelte 5 and updated dependencies.

---

## **Modified or Added Files**

From the stock SvelteKit setup, the following files have been updated or added:

- **`src/lib/pocketbase.ts`**: Establishes the PocketBase connection.
- **`src/lib/singletonPocketBase.ts`**: Implements a shared PocketBase instance for efficient resource use and real-time database interaction.
- **`src/routes/+page.svelte`**: Demonstrates sample usage from the frontend.
- **`src/hooks.server.ts`**: Middleware handling WebSocket events for the long-running server.
- **`vite.config.ts`**: Configures a proxy server endpoint for development.
- **`svelte.config.ts`**: Updates the adapter to use `svelte-adapter-bun`.
- **`bunServer.ts`**: A helper websocket server for use during development.

Additionally, the following packages were installed:

- Runtime Dependencies: eventsource, pocketbase
- Development Dependencies: svelte-adapter-bun, @types/bun and @types/eventsource