The built-in set
Fifteen exercises ship with the tool, in three groups, and the picker adds Random as a fourth category. The picker is category-first: a pull-down names the category and a sentence under it says what that category is for, then the exercises of that category follow. The exercises are held in files/exercises.csv, the category sentences in files/categories.csv, and both are mirrored in the source, so they work whether the page is served or opened off a memory stick.
Exercises
The seven small-group problems, in escalating order. Each one teaches the next thing.
| ID | Allocation | Asks for | Teaches |
|---|---|---|---|
| E1 | 33.125.95.0/24 | Two equal parts | One cut. The midpoint is the only legal place it can go. |
| E2 | 58.97.123.0/24 | Four equal parts | Cutting the halves again. Four subnets cost a tax of 8. |
| E3 | 85.55.8.128/25 | Three networks, all the space, largest first | That a power of two splits into three pieces only as a half and two quarters. |
| E4 | 15.162.58.0/24 | 110, 52, 12, 8 hosts | Sizing from host counts, and that not all addresses need to be used. |
| E5 | 45.2.148.0/22 | Five sites: 32, 60, 28, 26, 17 hosts | The same skill one prefix up, where the octet stops being the unit. |
| E6 | 222.55.32.0/20 | Five departments: 12, 100, 228, 981, 1017 hosts | Counts that sit either side of a boundary. 981 and 1017 both need a /22. |
| E7 | 72.31.6.0/24 | 10 hosts plus 10% growth; 60 hosts plus a gateway; 100 hosts plus 15% growth plus a gateway | That the stated number is not always the number you size for. Clinic needs 11, Lab needs 61, Office needs 116. |
Walkthrough
The handout's five tables on 10.200.5.0/24, each loading already cut. Their purpose is the footer rows: step through W1 to W5 in front of a class and read the three numbers aloud each time.
| ID | Shape | Usable | N-2 tax |
|---|---|---|---|
| W1 | The whole /24 | 254 | 2 |
| W2 | Two /25 | 252 | 4 |
| W3 | /25 + /26 + /26 | 250 | 6 |
| W4 | Four /26 | 248 | 8 |
| W5 | /25 + /26 + /27 + /27 | 248 | 8 |
W4 and W5 are the pair worth pausing on: different shapes, same tax, because both have four subnets.
Check yourself
The study-guide questions. S1 splits 192.168.4.0/24 into four. S2 loads the same network already cut and starts a drill on the network number, the broadcast and the gateway, which is the "which address becomes the default gateway" question. S3 is the cheat-sheet recall prompt.
Posting a random code
Open Exercises, choose Random from the category pull-down, choose a tier, and press Roll until you like the look of it. The code appears as SN1-DPK7M3Q. Post that string, or post the link with #x=SN1-DPK7M3Q on the end.
The code fully determines the problem. Every student who opens it gets the same allocation, the same names and the same host counts. There is no answer key to distribute, because the tool grades in the browser, and there is nothing to leak, because the code is the problem.
Roll several codes at one tier and post different ones to different lab sections if you want them working different numbers at the same difficulty.
The tier ladder
| Tier | Allocation | Shape |
|---|---|---|
| A. Halves | /24 | Two equal parts. |
| B. Quarters | /24 | Four equal parts. |
| C. Three unequal | /24 or /25 | All the space, three networks, largest first. |
| D. Host counts in a /24 | /24 | Three or four LANs with host counts. |
| E. Sites in a /22 | /22 | Four or five city names with host counts. |
| F. Departments in a /20 | /20 | Five departments plus a two-host router-to-router link. |
Every host count is drawn so that exactly one prefix is the right answer: the number is always more than the next smaller block can hold and no more than its own block holds. At tier F the counts are pushed towards a boundary on purpose, so a student who rounds carelessly lands one prefix wrong. The link at tier F is always two hosts, which under the course rules is a /30.
Every generated problem is solvable. That is not a hope: the test suite generates 2400 of them, solves each one with the reference solver and runs the checker over the result.
Public and private space
By default a random allocation looks like public space, avoiding 0/8, 10/8, 100.64/10, 127/8, 169.254/16, 172.16/12, 192.168/16 and everything from 224 up. Tick Private address space and it comes from RFC 1918 instead. The choice is part of the code, so it travels with it.
Editing the exercise file
files/exercises.csv is an ordinary spreadsheet file. Nine columns:
| Column | Holds |
|---|---|
id | A short identifier. It appears in the picker and in share links as #x=. |
group | Exercises, Walkthrough or Check yourself: the category the exercise is listed under. The picker's categories, their order and their descriptions come from files/categories.csv, below. |
title | The short label in the picker. |
network | The allocation in CIDR form. It must be on a boundary for its own mask. |
constraints | Semicolon-separated tokens. See below. |
requirements | Semicolon-separated Name, Name:hosts, or Name:hosts+Static1|Static2. See below. |
solution | Optional. A division string that loads the exercise already cut. |
drill | Optional. std, or a semicolon list of net, bc, mask, usable, gw. |
text | The instruction shown in the left panel. |
A row that does not validate is dropped with a warning in the browser console rather than breaking the picker, so a typo costs you one exercise, not the tool.
Growth and the gateway
Two more modifiers make a need state something other than a bare number, so the student has to work the real size out rather than read it off:
| Token | Means | The student must size for |
|---|---|---|
Clinic:10+10% | 10 hosts, allow 10 percent growth | 11 usable, so a /28 |
Lab:60+gw | 60 hosts, the gateway is on top of that count | 61 usable, so a /26 |
Office:100+15%+gw | both, growth applied first | 116 usable, so a /25 |
Growth rounds up, because a fraction of a host is still a host: 12 plus 10 percent is 14, not 13. It is applied to the host count before the gateway is added, so the gateway never grows. Write it as a whole percentage; gateway works as a longer spelling of gw.
Every need with a host count states its gateway position in the panel, not only the ones that add it. A plain Sales:110 reads "gateway included", which is the reading the handout has always used: 110 IPs means 110 usable addresses, one of which the router takes. Nothing about the existing exercises changed.
The one collision worth knowing: a static named gw or gateway is read as the flag. That costs nothing, since neither is a device.
The size a need works out to is deliberately never shown beside it. The Check report is where the arithmetic appears, spelled out step by step, and only once the student has committed to a block.
Requiring static addresses
A requirement may name the devices that must get a fixed address, after a plus sign and separated by pipes:
Sales:110+Printer|File server;Warehouse:52+Scanner
Each name becomes a row in that network's addressing panel, marked as required. A required row cannot be deleted, only emptied, and a required row left empty fails the check under business need. Everything else about the plan stays the student's choice: you are saying the printer needs a fixed address, not which one it gets.
Leave the plus off and the student still gets an addressing panel. It just starts with no static rows, and they add whatever they think the network needs.
Constraint tokens
equal:Nrequires exactly N subnets, all the same size, all assigned.count:Nrequires exactly N subnets.all-spacerequires every subnet to be assigned, so nothing is left over.largest-firstrequires the first name in the list to hold a largest block.any-space, or an empty cell, means not all addresses need to be used.
A division string is the tree written out in pre-order: 1 means "this block is split", 0 means "this block is a leaf". So 0 is an uncut block, 100 is one cut, and 1100100 is four equal quarters. It is the same encoding the ECT Visual Subnet Calculator uses in its bookmark links.
The categories file
files/categories.csv is the picker's pull-down: one row per category, in the order they should appear. Three columns:
| Column | Holds |
|---|---|
category | The name in the pull-down. For a list category it must match the group of the exercises it lists. |
kind | list for a category of exercises, random for the code generator. There is one of the latter. |
description | One or two sentences shown under the pull-down when that category is chosen: what it is for and who it suits. |
Rewording a description is the common edit, and it is what this file is for. A list category with no exercises is left out of the pull-down, so retiring a group is a matter of removing its exercises. A row that does not validate is dropped with a console warning, and if none survive the built-in set serves instead.
The built-in fallback
Opening index.html straight off disk gives the page no origin, so it cannot read the CSV. The same rows are compiled into the source and used instead, and a test asserts the two copies stay identical. If you edit the CSV and want the change to reach students who open the file locally, the source copy in src/exercises.js has to be updated in the same commit.
What the checker enforces
Check reports one card per rule of the hierarchy. Only two of the five can fail an exercise.
- N-2 rule fails when an assigned block does not hold the required number of hosts once the network number and the broadcast are set aside. The message opens with the arithmetic the need asked for, written out, then gives the block, its real usable count, and the prefix that would work. For a need with growth and a gateway it reads:
Office needs 100 hosts plus 15% growth, which is 115, plus the gateway, which is 116. - Business need fails when a requirement is unassigned, when a constraint token is unmet, or when an addressing plan cannot work: an address outside its own subnet, one address given to two devices, a static inside the DHCP pool, a pool that runs backwards, a required static left without an address, or no gateway at all. The tool never places the gateway for the student; the moment a block is assigned, the network needs one, and the failure message says so without naming the address.
The N-2 card also collects the addressing mistakes that are N-2 mistakes: a gateway, a static or a pool endpoint sitting on the network number or the broadcast. Filing those there rather than under business need is deliberate, because that is the rule the student actually broke.
The gateway is required from the moment a block is assigned, so an exercise cannot pass on cutting and dragging alone: every network has to be addressed at least that far. The convention notes, by contrast, wait until the student has started a plan, so the report does not comment on the shape of something nobody has begun.
An exercise passes when neither fails. The summary line reads, for example, Exercise E4: 3 of 4 needs met. 1 rule broken.
What it deliberately does not fail
- Binary law is always reported OK, because the tool structurally cannot draw a subnet that breaks it. Saying so on every report is the point: it is the rule the student should stop worrying about once they are in here.
- Convention is a note. Once a plan exists it reports where that plan departs from the conventions in force: a gateway at the wrong end, statics that do not begin where they should, a pool that does not fill the gap between them. When nothing departs, the card states the conventions in one line. It is never a failure, because a convention is exactly the sort of rule an instructor may override.
- Most elegant design is a note. It names each block that is bigger than its need, what would have fitted, and the total addresses that could be reclaimed. A plan can pass with waste, which is correct: elegance is the rule you bend first.
If you want a student to defend their design rather than merely satisfy it, the elegance note is the place to point them. It gives them the number to argue about.
Setting the conventions
Conventions in the menu turns each of the four course conventions: the gateway on the first or the last usable address, statics from the start or the end of the range, a DHCP pool that fills the gap or no pool expected, and up to two DNS servers or none. The defaults are the lecture's, A to D as the handout states them, and Lecture defaults in the dialog puts them back.
The choice lives in the share link under c, elided when it is the defaults, so a link you post carries the conventions the exercise should be read against and a default link stays as short as it was. It is not a stored preference: a student who opens your link gets your conventions, and a student who opens a fresh page gets the lecture's. Check's Convention card states the set in force on every report, the plan notes are written against it, the drill's gateway answer follows it, and the reference solver uses it.
Nothing fills a plan in for the student under any setting. Changing the conventions changes what Check says the plan should have looked like, not what the panel shows before the student types.
Drill mode in class
Drill hides the addresses on the diagram and turns the table into blanks. It works on any diagram: a built-in exercise, a random code, or a network you type in yourself.
- The standard drill asks for the network number, the broadcast, the mask in dotted decimal and the usable count.
- A drill can also ask for the gateway, which is where Convention A gets tested.
- Grade marks each cell; Reveal shows the expected values beside them.
- Answers never travel in a share link, so a drill you post arrives blank for everyone.
A useful pattern for a lab: post one code, have students cut and assign it, then have them turn on Drill and fill the table in from the diagram alone.
Reading a student's link
The address bar carries the whole plan, so a student can paste a link into a submission and you can open exactly what they were looking at. The parts are readable: n is the allocation, d is the division string, r is the list of names and host counts, a maps names to blocks, and x is the exercise or code.
A link from the ECT Visual Subnet Calculator also opens here, with its divisions and labels intact, and Open in IPCalc in the menu opens the current plan back in the calculator. Students can move between the two tools without redoing work.
Projection and the classroom
- High-Visibility under Settings enlarges the type, widens the minimum block width and hardens the contrast. Worth turning on before you project.
- Dark Mode starts on Light, which is what a projector wants, and cycles to Auto, then Dark, then back to Light. Auto follows the room machine's own setting, so it is worth one click if the lab images are set dark. The choice is remembered per browser.
- Block Display in the menu closes the needs panel and the table in one step and gives the diagram the whole screen. Choose it again and both come back exactly as they were, collapsed or open, at the sizes they had. Opening a pane by hand while it is on simply ends it.
- Double-click a block to zoom into it, and use the breadcrumb to come back. This is the way to demonstrate a /20 without the small subnets turning into slivers.
- Hide binary and Hide dotted decimal beside the table title are both ticked by default, which keeps the table to five columns and narrow enough to read from the back of a room. Untick either for the lesson where that column is the point, and it stays unticked until you change it back. A drill that asks for the mask shows that column regardless.
- Every block carries its usable count under its prefix, so the N-2 rule is on the picture and not only in the table. Cutting a block in front of a class and reading the two new numbers aloud is the fastest way to make the tax land.
- Save PNG writes the diagram out as an image for a slide or a handout.
Known limits
- IPv4 only. The address arithmetic is deliberately written so an IPv6 sibling can be added later behind the same names, but it is not there yet.
- The lecture's usable counts. A /31 and a /32 report no usable addresses, matching the handout. Real equipment can use a /31 as a point-to-point link under RFC 3021; that is noted in Help but not modelled.
- Cuts stop at /30 by default. Allow /31 and /32 under Settings in the menu lowers the floor to /32 when you want to demonstrate what happens past that point, and rides in the link as
f=32. - Nothing is stored. Only the display preferences persist. Work travels in the link, so a student who closes the tab without copying the link loses it.