diff --git a/books/manual/SUMMARY.md b/books/manual/SUMMARY.md index 7ef28da..3526b9b 100644 --- a/books/manual/SUMMARY.md +++ b/books/manual/SUMMARY.md @@ -32,6 +32,7 @@ - [ownCloud](dashboard/solutions/owncloud.md) - [Peertube](dashboard/solutions/peertube.md) - [Presearch](dashboard/solutions/presearch.md) + - [Static Website](dashboard/solutions/static_website.md) - [Subsquid](dashboard/solutions/subsquid.md) - [Taiga](dashboard/solutions/taiga.md) - [Umbrel](dashboard/solutions/umbrel.md) @@ -149,6 +150,7 @@ - [TFGrid Stacks](developers/grid_deployment/tfgrid_stacks.md) - [Full VM Grid Deployment](developers/grid_deployment/grid_deployment_full_vm.md) - [Grid Snapshots](developers/grid_deployment/snapshots.md) + - [Deploy the Dashboard](developers/grid_deployment/deploy_dashboard.md) - [Farmers](farmers/farmers.md) - [Build a 3Node](farmers/3node_building/3node_building.md) - [1. Create a Farm](farmers/3node_building/1_create_farm.md) diff --git a/collections/dashboard/deploy/applications.md b/collections/dashboard/deploy/applications.md index e3a5a2c..17a7e2c 100644 --- a/collections/dashboard/deploy/applications.md +++ b/collections/dashboard/deploy/applications.md @@ -18,6 +18,7 @@ Easily deploy your favourite applications on the ThreeFold grid with a click of - [ownCloud](owncloud.md) - [Peertube](peertube.md) - [Presearch](presearch.md) +- [Static Website](static_website.md) - [Subsquid](subsquid.md) - [Taiga](taiga.md) - [Umbrel](umbrel.md) diff --git a/collections/dashboard/solutions/solutions_staticwebsite.png b/collections/dashboard/solutions/solutions_staticwebsite.png new file mode 100644 index 0000000..33c51d6 Binary files /dev/null and b/collections/dashboard/solutions/solutions_staticwebsite.png differ diff --git a/collections/dashboard/solutions/static_website.md b/collections/dashboard/solutions/static_website.md new file mode 100644 index 0000000..4f57b07 --- /dev/null +++ b/collections/dashboard/solutions/static_website.md @@ -0,0 +1,53 @@ +

Static Website

+ +

Table of Contents

+ +- [Introduction](#introduction) +- [Prerequisites](#prerequisites) +- [Deployment](#deployment) + +--- + +## Introduction + +Static Website is an application where a user provides a GitHub repository URL for the files to be automatically served online using Caddy. + +## Prerequisites + +- Make sure you have a [wallet](wallet_connector.md) +- From the sidebar click on **Applications** +- Click on **Static Website** + +## Deployment + +![ ](./img/solutions_staticwebsite.png) + +- Enter an instance name + +- Enter a GitHub repository URL that needs to be cloned + +- Enter the title for the cloned repository + +- Select a capacity package: + + - **Small**: {cpu: 1, memory: 2 , diskSize: 50 } + - **Medium**: {cpu: 2, memory: 4, diskSize: 100 } + - **Large**: {cpu: 4, memory: 16, diskSize: 250 } + - Or choose a **Custom** plan + +- `Dedicated` flag to retrieve only dedicated nodes +- `Certified` flag to retrieve only certified nodes +- Choose the location of the node + - `Region` + - `Country` + - `Farm Name` +- Choose the node to deploy on + - Note: You can select a specific node with manual selection +- `Custom Domain` flag allows the user to use a custom domain +- Choose a gateway node to deploy your static website + +Once this is done, you can see a list of all of your deployed instances: + +![ ](./img/staticwebsite_list.png) + +Click on the button **Visit** under **Actions** to go to your static website! diff --git a/collections/dashboard/solutions/staticwebsite_list.png b/collections/dashboard/solutions/staticwebsite_list.png new file mode 100644 index 0000000..94fd8ab Binary files /dev/null and b/collections/dashboard/solutions/staticwebsite_list.png differ diff --git a/collections/developers/grid_deployment/deploy_dashboard.md b/collections/developers/grid_deployment/deploy_dashboard.md new file mode 100644 index 0000000..b126b8b --- /dev/null +++ b/collections/developers/grid_deployment/deploy_dashboard.md @@ -0,0 +1,139 @@ +

Deploy the Dashboard

+ +

Table of Contents

+ +- [Introduction](#introduction) +- [Prerequisites](#prerequisites) +- [Create an SSH Tunnel](#create-an-ssh-tunnel) +- [Editor SSH Remote Connection](#editor-ssh-remote-connection) +- [Set the VM](#set-the-vm) +- [Build the Dashboard](#build-the-dashboard) +- [Dashboard Public Access](#dashboard-public-access) +- [Set the Network](#set-the-network) +- [Questions and Feedback](#questions-and-feedback) + +*** + +## Introduction + +We show how to deploy the Dashboard (devnet) on a full VM. To do so, we set an SSH tunnel and use the VSCodium Remote Explorer function. We will then be able to use a source-code editor to explore the code and see changes on a local browser. + +We also show how to provide a public access to the Dashboard by setting a gateway domain to your full VM deployment. Note that this method is not production-ready and should only be used to test the Dashboard. + +## Prerequisites + +- TFChain account with TFT +- [Deploy full VM with WireGuard connection](../../system_administrators/getstarted/ssh_guide/ssh_wireguard.md) +- [Make sure you can connect via SSH on the terminal](../../system_administrators/getstarted/ssh_guide/ssh_openssh.md) + +In this guide, we use WireGuard, but you can use other connection methods, such as [Mycelium](../../system_administrators/mycelium/mycelium_toc.md). + +## Create an SSH Tunnel + +- Open a terminal and create an SSH tunnel + ``` + ssh -4 -L 5173:127.0.0.1:5173 root@10.20.4.2 + ``` + +Simply leave this window open and follow the next steps. + +If you use an IPv6 address, e.g. with Mycelium, set `-6` in the line above instead of `-4`. + +## Editor SSH Remote Connection + +You can connect via SSH through the source-code editor to a VM on the grid. In this example, WireGuard is set. + +- Add the SSH Remote extension to [VSCodium](https://vscodium.com/) +- Add a new SSH remote connection +- Set the following (adjust with your own username and host) + ``` + Host 10.20.4.2 + HostName 10.20.4.2 + User root + ``` +- Click on `Connect to host` + +## Set the VM + +We set the VM to be able to build the Dashboard. + +``` + +apt update && apt install build-essential python3 -y + +wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash + +export NVM_DIR="$HOME/.nvm" + +[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm + +[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # This loads nvm bash_completion + +nvm install 18 + +npm install -g yarn + +``` + +## Build the Dashboard + +We now build the Dashboard. + +Clone the repository, then install, build and run the Dashboard. Note that here it is called `playground`: + +``` + +git clone https://github.com/threefoldtech/tfgrid-sdk-ts + +cd tfgrid-sdk-ts/ + +yarn install + +make build + +make run project=playground + +``` + +You can then access the dev net Dashboard on your local browser. + +To stop running the Dashboard, simply enter ̀`Ctrl-C` on the terminal window. + + +## Dashboard Public Access + +> Note: This method is not production-ready. Use only for testing purposes. + +Once you've tested the Dashboard with the SSH tunnel, you can explore how to access it from the public Internet. For this, we will create a gateway domain and bind the host to `0.0.0.0`. + +On the Full VM page, [add a domain](../../dashboard/solutions/add_domain.md) to access your deployment from the public Internet. + +- Under `Actions`, click on `Manage Domains` +- Go to `Add New Domain` +- Choose a gateway domain under `Select domain` +- Set the port 5173 +- Click on `Add` + +To run the Dashboard from the added domain, use this instead of the previous `make run` line: + +``` +cd packages/playground +yarn dev --host 0.0.0.0 +``` + +You can then access the Dashboard from the domain you just created. + +## Set the Network + +You can set the network by running the configuration script. Simply set the network as the **MODE** (e.g. **main**, **test**, **dev**): + +``` +cd packages/playground/public +MODE=main ../scripts/build-env.sh +``` + +Once you've set the configuration file, you can build and run the Dashboard. + +## Questions and Feedback + +If you have any questions or feedback, please let us know by either writing a post on the [ThreeFold Forum](https://forum.threefold.io/), or by chatting with us on the [TF Grid Tester Community](https://t.me/threefoldtesting) Telegram channel. \ No newline at end of file diff --git a/collections/developers/grid_deployment/grid_deployment.md b/collections/developers/grid_deployment/grid_deployment.md index 2680eb5..ada1b79 100644 --- a/collections/developers/grid_deployment/grid_deployment.md +++ b/collections/developers/grid_deployment/grid_deployment.md @@ -6,4 +6,5 @@ The TFGrid whole source code is open-source and instances of the grid can be dep - [TFGrid Stacks](tfgrid_stacks.md) - [Full VM Grid Deployment](grid_deployment_full_vm.md) -- [Grid Snapshots](snapshots.md) \ No newline at end of file +- [Grid Snapshots](snapshots.md) +- [Deploy the Dashboard](deploy_dashboard.md) \ No newline at end of file