A comprehensive web application for network administrators and engineers, featuring advanced IP address management, subnet calculations, and network analysis tools. Built with modern web technologies including HTML5, CSS3, JavaScript ES6, and Bootstrap 5.
Try it now: https://glasspham.github.io/Support-Network/
The application is deployed and running live on GitHub Pages. You can access all features directly in your browser without any installation.
The Network Tools Suite is a powerful, browser-based application designed to simplify complex networking tasks. This project provides a suite of tools for:
- VLSM (Variable Length Subnet Masking) Calculator: Advanced subnet calculations with custom subnet sizes
- IP Address Validation & Analysis: Comprehensive IP address checking and validation tools
- IP Aggregation & Supernetting: Automatic route summarization and network aggregation
- Number Conversion Suite: Convert between CIDR, subnet masks, wildcard masks, and calculate host counts
- Binary/Decimal Conversion: Convert between different number representations for networking
- Subnet Planning: Plan and optimize network topologies with intelligent subnet allocation
- Network Range Analysis: Analyze IP ranges, calculate usable hosts, and determine network boundaries
- Network Engineers: Simplify daily subnet calculations and network planning
- System Administrators: Validate IP configurations and plan network expansions
- Students & Educators: Learn networking concepts with interactive tools
- IT Professionals: Quick reference for network troubleshooting and design
- No Installation Required: Browser-based tools accessible anywhere
- Real-time Calculations: Instant results with interactive interfaces
- Educational Value: Visual representations help understand networking concepts
- Professional Grade: Accurate calculations suitable for production environments
- Mobile Friendly: Responsive design works on all devices
- HTML5 - Modern semantic markup and structure
- CSS3 - Advanced styling with custom properties and animations
- JavaScript ES6+ - Modern JavaScript with modules and async/await
- Bootstrap 5 - Responsive UI framework and components
- Font Awesome - Professional icon library
- GitHub Pages - Free static site hosting and deployment
- Modern Web Browser (Chrome, Firefox, Safari, Edge)
- Internet Connection (for CDN resources)
- No installation required - runs entirely in the browser
Simply open the live demo: https://glasspham.github.io/Support-Network/
-
Clone the repository
git clone https://github.com/Glasspham/Support-Network.git cd Support-Network -
Open in browser
Note: use vscode 1. Install Live Server extension. 2. Open the index.html page. 3. Right click. 4. Select Open with Live Server If you use File Explorer, click directly on index.html
This project is automatically deployed to GitHub Pages at https://glasspham.github.io/Support-Network/
The project includes GitHub Actions workflow for automatic deployment:
- Push to main branch - Automatically triggers deployment
- Build process - Vite builds the project for production
- Deploy - Files are deployed to GitHub Pages
- Live site - Available at the GitHub Pages URL
root
├── js/ # Core networking logic modules
│ ├── binaryMap.js # Binary/decimal conversion utilities
│ ├── ipAggregator.js # IP aggregation and supernetting logic
│ ├── ipChecker.js # IP address validation and analysis
│ ├── uiHandler.js # User interface event handlers
│ ├── vlsmLogic.js # VLSM calculation algorithms
│ └── numberConverter.js # Multi-base number conversion (Binary, Octal, Decimal, Hex)
├── .github/ # GitHub Actions workflow
│ ├── workflows/
│ └── deploy.yml # Automated GitHub Pages deployment
├── .gitignore # Git ignore file
├── index.html # Main HTML file with Bootstrap integration
├── README.md # Project documentation (this file)
└── style.css # Custom styles and responsive design- Calculate optimal subnet sizes for given requirements
- Support for custom host requirements per subnet
- Automatic subnet allocation with minimal waste
- Binary and decimal representation of results
- Validate IP address format and ranges
- Check if IP is assignable within a subnet
- Identify network, broadcast, and usable IP ranges
- Support for both IPv4 validation
- Automatic route summarization
- Find longest common prefix for multiple networks
- Optimize routing tables with supernetting
- Calculate aggregate network addresses
- Convert between CIDR notation and subnet masks
- Binary to decimal and decimal to binary conversion
- Wildcard mask calculations
- Network address calculations
A comprehensive number base conversion tool supporting Binary, Octal, Decimal, and Hexadecimal.
The application includes several built-in examples and test cases:
- VLSM Scenarios: Test with different subnet requirements
- IP Validation: Try various IP formats and edge cases
- Aggregation Examples: Practice with multiple network ranges
- Binary Conversion: Verify calculations with known values
We welcome contributions! Please follow these steps:
- Fork the repository
- Create a feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
- Follow TypeScript best practices
- Add comments for complex networking algorithms
- Test calculations with known correct values
- Update documentation for new features
- Maintain consistent code style with ESLint
- Built with modern web technologies for optimal performance
- Inspired by the need for accessible networking tools
- Thanks to the open-source community for amazing libraries
- Deployed with GitHub Pages for easy accessibility
- Live Application: https://glasspham.github.io/Support-Network/
- GitHub Repository: https://github.com/Glasspham/Support-Network
- Issues & Feedback: GitHub Issues