Newdich Technology
A thirty-page corporate site built by a Python generator — no framework, no npm, no build toolchain — governed by a written design specification the code must obey.
- 30
- Pages
- 13
- Stylesheet layers
- 3
- Colours, total
- 0
- npm dependencies
- Role
- Designer & engineer
- Year
- 2026
- Type
- Thirty-page static site
01Overview
Newdich Technology works across software engineering, IoT and robotics, cybersecurity, blockchain, AI, data science and game development, out of Abuja and Okitipupa. This is its website: thirty pages, plus the Newdich Technology Institute.
There is no framework and no npm. A Python script assembles the pages; the output is plain HTML, one CSS file and one JS file, deployable to any static host.
The unusual part is `design.md`. It is a versioned specification — named "Field Instrument" — that defines the palette, typography, spacing and component behaviour. It is the authority: if the code and that file disagree, the code is wrong.
02The problem
A thirty-page marketing site is the kind of project where a framework feels obviously right and then costs you for years: a toolchain to maintain, a dependency tree to patch, a build that breaks on a Node upgrade, for a site that ships no interactivity.
But thirty hand-written HTML pages drift. The fifth page gets a slightly different header, the twentieth invents a new heading size, and by the thirtieth there is no design system left.
The site also had to hold seven quite different service lines without becoming seven different sites.
03Architecture
- 01
Python as the template engine
`build.py` renders page modules from `src/pages/` — home, about, services, work, case studies, platforms, practice, process, institute, insights, articles, careers, contact, FAQ, legal and a 404 — into `public/`. `python3 build.py --serve` builds and serves. Python 3 is the only requirement; there is nothing to install.
- 02
Routes as directories
Every page is a directory containing `index.html`, so URLs carry no extension: `/faq`, `/work/smart-metering`. Only `index.html`, `robots.txt`, `sitemap.xml` and `404.html` sit at the root.
- 03
design.md as the authority
A versioned specification defining a three-colour system — black, white, blue, and no fourth hue exists — with exact tokens for background, surface, raised, line and three text weights, in both dark and light. Typography, spacing and motion are specified the same way.
- 04
Numbered stylesheet layers
Thirteen files from `01-tokens.css` through `13-motion.css` — tokens, base, type, layout, header, buttons, panel, index, instrument, content, forms, footer, motion — concatenated in order. The numbering is the cascade: a rule's file tells you its specificity budget.
- 05
A running instrument per page
Every system page opens with a live instrument panel for its own subject — metering, payments, examinations, queues, POS, ledgers. It is the one piece of interactivity, and it is what makes an engineering company's site read as an engineering company's site.
04Key decisions
No npm, on purpose
The site outlives the toolchain that would have built it. A Python script and a folder of CSS will still build in five years; a 2026 bundler configuration will not.
Write the design system down first
`design.md` was written before the CSS and outranks it. That is what keeps page thirty consistent with page one — and it is also what let an agent work on the site without inventing a fourth colour.
Three colours only
Black, white and one blue. A restriction that severe removes an entire category of decision from every page, and it is why the instrument panels read as instruments rather than as decoration.
05Stack
- Python 3
- HTML
- CSS
- Vanilla JS
- Static hosting