# Meshtastic Web Monorepo

[![CI](https://img.shields.io/github/actions/workflow/status/meshtastic/web/ci.yml?branch=main&label=Web%20CI&logo=github&color=yellow)](https://github.com/meshtastic/web/actions/workflows/ci.yml)
[![CI](https://img.shields.io/github/actions/workflow/status/meshtastic/js/ci.yml?branch=master&label=JS%20CI&logo=github&color=yellow)](https://github.com/meshtastic/js/actions/workflows/ci.yml)
[![CLA assistant](https://cla-assistant.io/readme/badge/meshtastic/web)](https://cla-assistant.io/meshtastic/web)
[![Fiscal Contributors](https://opencollective.com/meshtastic/tiers/badge.svg?label=Fiscal%20Contributors&color=deeppink)](https://opencollective.com/meshtastic/)
[![Vercel](https://img.shields.io/static/v1?label=Powered%20by&message=Vercel&style=flat&logo=vercel&color=000000)](https://vercel.com?utm_source=meshtastic&utm_campaign=oss)

## Overview

This monorepo consolidates the official [Meshtastic](https://meshtastic.org) web
interface and its supporting JavaScript libraries. It aims to provide a unified
development experience for interacting with Meshtastic devices.

### Projects within this Monorepo (`packages/`)

All projects are located within the `packages/` directory:

- **`packages/web` (Meshtastic Web Client):** The official web interface,
  designed to be hosted or served directly from a Meshtastic node.
  - **[Hosted version](https://client.meshtastic.org)**
- **`packages/core`:** Core functionality for Meshtastic JS.
- **`packages/transport-node`:** TCP Transport for the NodeJS runtime.
- **`packages/transport-deno`:** TCP Transport for the Deno runtime.
- **`packages/transport-http`:** HTTP Transport.
- **`packages/transport-web-bluetooth`:** Web Bluetooth Transport.
- **`packages/transport-web-serial`:** Web Serial Transport.

All `Meshtastic JS` packages (core and transports) are published both to
[JSR](https://jsr.io/@meshtastic). [NPM](https://www.npmjs.com/org/meshtastic)

---

## Stats

| Project        | Repobeats                                                                                                             |
| :------------- | :-------------------------------------------------------------------------------------------------------------------- |
| Meshtastic Web | ![Alt](https://repobeats.axiom.co/api/embed/e5b062db986cb005d83e81724c00cb2b9cce8e4c.svg "Repobeats analytics image") |

---

## Tech Stack

This monorepo leverages the following technologies:

- **Runtime:** Bun
- **Web Client:** React.js
- **Styling:** Tailwind CSS
- **Bundling:** Vite
- **Language:** TypeScript
- **Testing:** Vitest, React Testing Library

---

## Getting Started

### Prerequisites

You'll need to have [Bun](https://bun.sh/) installed to work with this
monorepo. Follow the installation instructions on their home page.

### Development Setup

1. **Clone the repository:**
   ```bash
   git clone [https://github.com/meshtastic/meshtastic-web.git](https://github.com/meshtastic/meshtastic-web.git) 
   cd meshtastic-web
   ```
2. **Install dependencies for all packages:**
   ```bash
   bun install
   ```
   This command installs all necessary dependencies for all packages within the
   monorepo.

### Running Projects

#### Meshtastic Web Client

To start the development server for the web client:

```bash
bun run --filter web dev
```

This will typically run the web client on http://localhost:3000 and requires a
Chromium browser

## Meshtastic JS Packages

While the js packages are primarily libraries, you can run their tests or
specific development scripts if defined within their package.json files. For
example, to run tests for a specific package:

```bash
bun run --filter core test
```

### Feedback

If you encounter any issues with nightly builds, please report them in our
[issues tracker](https://github.com/meshtastic/web/issues). Your feedback helps
improve the stability of future releases

### Why Bun?

Meshtastic Web uses Bun as its development platform for several compelling
reasons:

- **Fast Performance**: Bun is built from the ground up for speed, offering
  significantly faster package installation and bundling compared to other
  JavaScript runtimes.
- **TypeScript Support**: Native TypeScript support without additional
  configuration, enhancing code quality and developer experience.
- **Modern JavaScript**: First-class support for ESM imports, top-level await,
  and other modern JavaScript features.
- **All-in-One Tooling**: Built-in package manager, bundler, test runner, and
  transpiler eliminate the need for multiple third-party tools.
- **Node.js Compatibility**: Drop-in replacement for Node.js with better
  performance and built-in tooling.
- **Reproducible Builds**: Lockfile ensures consistent builds across all
  environments.

### Contributing

We welcome contributions! Here’s how the deployment flow works for pull
requests:

- **Preview Deployments:**\
  Every pull request automatically generates a preview deployment on Vercel.
  This allows you and reviewers to easily preview changes before merging.

- **Staging Environment (`client-test`):**\
  Once your PR is merged, your changes will be available on our staging site:
  [client-test.meshtastic.org](https://client-test.meshtastic.org/).\
  This environment supports rapid feature iteration and testing without
  impacting the production site.

- **Production Releases:**\
  At regular intervals, stable and fully tested releases are promoted to our
  production site: [client.meshtastic.org](https://client.meshtastic.org/).\
  This is the primary interface used by the public to connect with their
  Meshtastic nodes.

Please review our
[Contribution Guidelines](https://github.com/meshtastic/web/blob/main/CONTRIBUTING.md)
before submitting a pull request. We appreciate your help in making the project
better!