Visual Subnet Calculator
Find a file
Caesar Kabalan 9cd0059853
Switch from Base32 to Base36 for Efficient Saves
Found an edge case where /32 was returning '10' as the short
representation of the subnet size because base32 can store 0-31 as a
single digit. So switched to Base36 so 0-35 could be represented, though
we'll only need 0-32.
2024-10-15 15:45:54 -07:00
.github/workflows Iterate on GitHub Actions Config 2023-10-25 15:53:52 -07:00
dist Switch from Base32 to Base36 for Efficient Saves 2024-10-15 15:45:54 -07:00
src Update Dependencies 2024-10-15 15:45:53 -07:00
.dockerignore Adding Docker support (#6) 2023-10-25 14:52:56 -07:00
.gitignore Ignore MacOS DS_Store files 2024-10-15 15:45:53 -07:00
.nvmrc Cloud Subnet Sizing (#11) 2024-10-08 00:20:11 -07:00
.repopackignore Add NOTES, fix end of file lines, and add Repopack config 2024-10-15 15:45:53 -07:00
Dockerfile Add NOTES, fix end of file lines, and add Repopack config 2024-10-15 15:45:53 -07:00
LICENSE Add NOTES, fix end of file lines, and add Repopack config 2024-10-15 15:45:53 -07:00
NOTES.md Add NOTES, fix end of file lines, and add Repopack config 2024-10-15 15:45:53 -07:00
package-lock.json Cloud Subnet Sizing (#11) 2024-10-08 00:20:11 -07:00
README.md Update Dependencies 2024-10-15 15:45:53 -07:00
repopack.config.json Add NOTES, fix end of file lines, and add Repopack config 2024-10-15 15:45:53 -07:00

Visual Subnet Calculator - visualsubnetcalc.com

demo.gif

Visual Subnet Calculator is a modernized tool based on the original work by davidc. It strives to be a tool for quickly designing networks and collaborating on that design with others. It focuses on expediting the work of network administrators, not academic subnetting math.

Design Tenets

The following tenets are the most important values that drive the design of the tool. New features, pull requests, etc should align to these tenets, or propose an adjustment to the tenets.

  • Simplicity is king. Network admins are busy and Visual Subnet Calculator should always be easy for FIRST TIME USERS to quickly and intuitively use.
  • Subnetting is design work. Promote features that enhance visual clarity and easy mental processing of even the most complex architectures.
  • Users control the data. We store nothing, but provide convenient ways for users to save and share their designs.
  • Embrace community contributions. Consider and respond to all feedback and pull requests in the context of these tenets.

Building From Source

If you have a more opinionated best-practice way to lay out this repository please open an issue.

Build prerequisites:

  • (Optional but recommended) NVM to manage node version
  • node.js (version 20) and associated NPM.
  • sass (Globally installed, following instructions below.)

Compile from source:

# Clone the repository
> git clone https://github.com/ckabalan/visualsubnetcalc
# Change to the repository directory
> cd visualsubnetcalc
# Use recommended NVM version
> nvm use
# Change to the sources directory
> cd src
# Install Bootstrap
> npm install
# Compile Bootstrap (Also install sass command line globally)
> npm run build
# Run the local webserver
> npm start

The full application should then be available within ./dist/, open ./dist/index.html in a browser.

Run with certificates (Optional)

NB: required for testing clipboard.writeText() in the browser. Feature is only available in secure (https) mode.


#Install mkcert
> brew install mkcert
# generate CA Certs to be trusted by local browsers
> mkcert install
# generate certs for local development
> cd visualsubnetcalc/src
# generate certs for local development
> npm run setup:certs
# run the local webserver with https
> npm run local-secure-start

Cloud Subnet Notes

Standard mode:

  • Smallest subnet: /32
  • Two reserved addresses per subnet of size <= 30:
    • Network Address (network + 0)
    • Broadcast Address (last network address)

AWS mode :

  • Smallest subnet: /28
  • Five reserved addresses per subnet:
    • Network Address (network + 0)
    • AWS Reserved - VPC Router
    • AWS Reserved - VPC DNS
    • AWS Reserved - Future Use
    • Broadcast Address (last network address)

Azure mode :

  • Smallest subnet: /29
  • Five reserved addresses per subnet:
    • Network Address (network + 0)
    • Azure Reserved - Default Gateway
    • Azure Reserved - DNS Mapping
    • Azure Reserved - DNS Mapping
    • Broadcast Address (last network address)

Credits

Split icon made by Freepik from Flaticon.

License

Visual Subnet Calculator is released under the MIT License