do-community / bandwidth-tool

A tool to help calculate and explain bandwidth allowances for Droplets on DigitalOcean.

Bandwidth Calculator

A tool to help calculate and explain bandwidth allowances for Droplets on DigitalOcean.

---

Development/Building

To setup the build/develop environment, you will need to run npm i with Node 12+ installed. This will install the dependencies to allow you to build the project.

To develop for this tool run npm run dev. This will start a development server that will automatically reload the codebase when changes occur.

If you wish to host this tool on a service, simply run npm run build. This will run all the necessary build scripts automatically to build the tool.
You can then take the dist folder and put it on your web server/bucket.

GitHub Actions is setup to do this automatically for this repository to deploy to gh-pages.

Source Structure

src/bandwidth-tool

src/bandwidth-tool/scss

The scss directory contains the main SCSS styling file for the tool, which imports our do-bulma library and then adds tool-specific customisations.

src/bandwidth-tool/templates

This directory contains the Vue templates that are used to render the tool on the client-side. app.vue is the main Vue file that other templates are referenced into.

src/bandwidth-tool/utils

Utility functions that are used by the tool, such as determining the type of a Droplet from its slug, live inside this directory.

src/build

The build directory contains a special utility script that is used during the initial build of the tool both for deployments and in development. This script fetches all Droplet sizes, saving them to a local JSON file that the tool then uses.

Contributing

If you are contributing, please read the contributing file before submitting your pull requests.

bandwidth-tool's Issues

Add bandwidth FAQs to page

Feature request

Feature description

Originally part of #2 - add some bandwidth pooling/billing FAQs at the end of the page for the tool (below the Droplet picker).

How the feature is useful

Not everyone wants to read through the full docs for bandwidth, so having FAQs right on the page would be great.

app

Information

Details

Description

Steps to reproduce

Expected behavior

Screenshots

Add OSS footer text

Information

N/A

Details

Description

Footer currently has no text.

Steps to reproduce

Look at the page. Simple.

Expected behavior

Footer should have standard OSS footer text like other tools (https://do.co/glob-tool etc.)

Screenshots

N/A

K8s offering in #7 includes 2x SSD variants

Information

N/A

Details

Description

In PR #7, when the k8s toggle is enabled, under the General Purpose category there are 2x SSD variants available. These are not available via the Cloud UI.

Steps to reproduce

Use tool in PR #7
Enable the k8s toggle
View the General Purpose tab
Observe 2x SSD variants available

Expected behavior

K8s should use the lowest variant for each category if variants are availab.e

Screenshots

N/A

Text and style updates

Bandwidth Bars

• See what it looks like to put the allowance and consumption number and label on the bar itself.
  

Headers

• H1: Bandwidth Planner
• H2: Account Bandwidth Pool
• H2: Droplets

Updated Droplet View

• "Droplet will exist for" [INPUT] "(monthly)"
• "Outbound Data:" [INPUT] "(monthly)"
• Smaller, less red "Remove Droplet" button

Add Pricing FAQ Section at end - tbd on content

Move all strings to i18n

Feature request

Feature description

Like all other tools we have produced, the strings used in the app should live within i18n data as to provide easy access to updating them or potentially translating the tools in the future.

How the feature is useful

See above.