Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/netbirdio/dashboard
NetBird Management Service Web UI Panel
https://github.com/netbirdio/dashboard
react spa
Last synced: 6 days ago
JSON representation
NetBird Management Service Web UI Panel
- Host: GitHub
- URL: https://github.com/netbirdio/dashboard
- Owner: netbirdio
- License: bsd-3-clause
- Created: 2021-08-08T21:07:07.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2025-01-20T15:26:39.000Z (14 days ago)
- Last Synced: 2025-01-22T01:11:14.853Z (13 days ago)
- Topics: react, spa
- Language: TypeScript
- Homepage: https://app.netbird.io
- Size: 11.4 MB
- Stars: 279
- Watchers: 11
- Forks: 66
- Open Issues: 42
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Authors: AUTHORS
Awesome Lists containing this project
README
# NetBird Dashboard
This project is the UI for NetBird's Management service.
**Hosted version:** https://app.netbird.io/
See [NetBird repo](https://github.com/netbirdio/netbird)
## Why?
The purpose of this project is simple - make it easy to manage VPN built with [NetBird](https://github.com/netbirdio/netbird).
The dashboard makes it possible to:
- track the status of your peers
- remove peers
- manage Setup Keys (to authenticate new peers)
- list users
- define access controls
## Some Screenshots
## Technologies Used
- NextJS
- ReactJS
- Tailwind CSS
- Auth0
- Nginx
- Docker
- Let's Encrypt
## How to run
Disclaimer. We believe that proper user management system is not a trivial task and requires quite some effort to make it right. Therefore we decided to
use Auth0 service that covers all our needs (user management, social login, JTW for the management API).
Auth0 so far is the only 3rd party dependency that can't be really self-hosted.
1. Install [Docker](https://docs.docker.com/get-docker/)
2. Register [Auth0](https://auth0.com/) account
3. Running NetBird UI Dashboard requires the following Auth0 environmental variables to be set (see docker command below):
`AUTH0_DOMAIN` `AUTH0_CLIENT_ID` `AUTH0_AUDIENCE`
To obtain these, please use [Auth0 React SDK Guide](https://auth0.com/docs/quickstart/spa/react/01-login#configure-auth0) up until "Configure Allowed Web Origins"
4. NetBird UI Dashboard uses NetBirds Management Service HTTP API, so setting `NETBIRD_MGMT_API_ENDPOINT` is required. Most likely it will be `http://localhost:33071` if you are hosting Management API on the same server.
5. Run docker container without SSL (Let's Encrypt):
```shell
docker run -d --name netbird-dashboard \
--rm -p 80:80 -p 443:443 \
-e AUTH0_DOMAIN= \
-e AUTH0_CLIENT_ID= \
-e AUTH0_AUDIENCE= \
-e NETBIRD_MGMT_API_ENDPOINT= \
netbirdio/dashboard:main
```
6. Run docker container with SSL (Let's Encrypt):
```shell
docker run -d --name netbird-dashboard \
--rm -p 80:80 -p 443:443 \
-e NGINX_SSL_PORT=443 \
-e LETSENCRYPT_DOMAIN= \
-e LETSENCRYPT_EMAIL= \
-e AUTH0_DOMAIN= \
-e AUTH0_CLIENT_ID= \
-e AUTH0_AUDIENCE= \
-e NETBIRD_MGMT_API_ENDPOINT= \
netbirdio/dashboard:main
```
## How to run local development
1. Install [Node](https://nodejs.org/)
2. Create and update the `.local-config.json` file. This file should contain values to be replaced from `config.json`
3. Run `npm install` to install dependencies
4. Run `npm run dev` to start the development server
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
You can start editing by modifying the code inside `src/..`
The page auto-updates as you edit the file.
## How to migrate from old dashboard (v1)
The new dashboard comes with a new docker image `netbirdio/dashboard:main`.
To migrate from the old dashboard (v1) `wiretrustee/dashboard:main` to the new one, please follow the steps below.
1. Stop the dashboard container `docker compose down dashboard`
2. Replace the docker image name in your `docker-compose.yml` with `netbirdio/dashboard:main`
3. Recreate the dashboard container `docker compose up -d --force-recreate dashboard`