@diyawanna/lan-bridge

LAN-based Peer Communication Bridge for JavaScript & TypeScript Projects

Communicate between devices over the same local Wi-Fi/LAN network using WebSockets with zero backend hosting. Ideal for React, Angular, Vite, or any frontend projects.

🧠 Idea & Concept

If you're building a project that runs on multiple devices (mobile, laptop, etc.) on the same Wi-Fi or LAN, this module lets those devices:

• 🔍 Detect each other through a WebSocket server
• 📡 Send and receive data (text, images, files) in JSON format
• 🔁 Handle real-time communication in both directions
• 🧑‍💻 Assign and identify devices by code (name(IP address) style)

Use this in Vite, React, Angular, or any modern frontend stack.

🚀 Features

• 📡 LAN WebSocket Server & Client
• 🔒 Private & local-only communication (no internet required)
• 📨 Send/Receive typed JSON payloads
• ⚡ Instant peer-to-peer-like messaging
• 🧰 Written in clean TypeScript with type definitions

📦 Installation

Install via npm:

npm install @diyawanna/lan-bridge

⚙️ Tools Used

| Tool/Library | Purpose | |---|---| | TypeScript | Strongly-typed development | | ws | WebSocket server/client | | tsup | Modern TypeScript bundler | | npm | Package publishing |

🧱 Project Structure

lan-bridge/
├── src/
│   └── index.ts         # Core logic (server/client)
├── dist/                # Compiled output (built with tsup)
├── tsup.config.ts       # Build config
├── tsconfig.json        # TypeScript config
└── package.json

🌐 How It Works

Start a LAN WebSocket server on one device (e.g. your laptop).

Connect from multiple devices (e.g. phone/tablet) using the LAN IP.

Use simple APIs to send/receive data in JSON format.

✍️ Usage Example

Start Server (on laptop):

import { startServer } from '@diyawanna/lan-bridge';

startServer(9000); // Opens ws://<local-ip>:9000

Connect Client (on phone or other devices):

import { connectClient, send } from '@diyawanna/lan-bridge';

const socket = connectClient('ws://192.168.1.10:9000', (msg) => {
  console.log('Received:', msg);
});

// Send data
send(socket, {
  from: 'my-phone',
  type: 'text',
  payload: 'Hello from phone!'
});

🧠 Tip: You can find your local IP address from your Vite dev server logs (➜ Network: http://192.168.x.x:5173).

🧪 Supported Message Types

The module currently supports:

• text
• image (as base64)
• file (as base64 or metadata)

Message Format:

type Message = {
  from: string;
  type: 'text' | 'image' | 'file';
  payload: any;
};

📋 API Reference

startServer(port?: number): void

Starts a WebSocket server listening on all interfaces (0.0.0.0) at the specified port.

connectClient(url: string, onMessage: (msg: Message) => void): WebSocket

Connects to the LAN server and starts listening for messages.

send(socket: WebSocket, message: Message): void

Sends a message through an open WebSocket connection.

🌍 Example Use Cases

• Send a file from your mobile to your PC by scanning a QR code.
• Display a live shared whiteboard across multiple devices on LAN.
• Instantly sync user actions between devices in a local event or classroom.

🔐 Security Note

This module uses raw WebSocket communication over LAN without encryption. Do not use on public or unsafe networks.

📦 Publishing

This package is published to:

👉 npmjs.com/package/@diyawanna/lan-bridge

Published under MIT License by @diyawanna.

📜 License

MIT

✉️ Contact / Feedback

Created by @diyawanna Open issues or suggestions on GitHub!

Would you like me to:

• Generate the full GitHub repo structure (.gitignore, LICENSE, etc.)?
• Add a QR code feature for easier LAN access?
• Help set up image/file sending via blob/base64 encoding?

Let’s get this package awesome and user-friendly!