## 🚀 Project Overview This GitHub repository powers the official web presence of **[Network Pro Strategies](https://netwk.pro/about)** — a research- and infrastructure-focused technology initiative working across cybersecurity, digital systems, and privacy. Our work spans applied research and development, experimental infrastructure, educational tools and publications, and public advocacy for security- and privacy-respecting technology. ### Technology Stack Built with [Svelte 5](https://svelte.dev/) and [SvelteKit](https://svelte.dev/docs/kit/), deployed primarily on [Vercel](https://vercel.com/), with a separate hardened audit environment on [Netlify](https://www.netlify.com/). [Blog](https://github.com/netwk-pro/blog) and [documentation](https://github.com/netwk-pro/docs) subsites built with [Material for MkDocs](https://squidfunk.github.io/mkdocs-material/) and deployed via [Vercel](https://vercel.com/). All infrastructure and data flows are designed with **maximum transparency, self-hosting, and user privacy** in mind.

## 📦 Template & Distribution Intent This repository serves multiple purposes: - It powers the official **Network Pro™ web presence** - It is distributed via **npm** and **GitHub Package Registry** - It is intentionally designed to function as a **reference implementation and starter template** for SvelteKit projects that emphasize security, documentation, and maintainability As a result, this codebase is treated as a **continuously maintained software project**, rather than a static website snapshot. ### Copyright & Header Conventions Source code and configuration files in this repository use **copyright year ranges** (e.g. `© 2025–2026`) to reflect ongoing development over time. This approach aligns with common practice in actively maintained software projects and templates. User-facing content (such as pages, documentation, and rendered site output) may derive effective copyright years dynamically at runtime to more accurately reflect publication and revision timelines. These conventions are intentional and aim to balance legal clarity, maintainability, and practical reuse for downstream consumers of this project.

## 📁 Repository Structure ```bash . ├── .github/ │ └── workflows/ # CI workflows (e.g. test, deploy) ├── .vscode/ │ ├── customData.json # Custom CSS IntelliSense (e.g. FontAwesome) │ ├── extensions.json # Recommended VS Code / VSCodium extensions │ ├── extensions.jsonc # Commented version of extensions.json │ └── settings.json # Workspace settings ├── scripts/ # General-purpose utility scripts ├── src/ │ ├── lib/ # Components, utilities, types, styles │ │ ├── components/ # Svelte components │ │ ├── data/ # Custom data (e.g. JSON, metadata, constants) │ │ └── utils/ # Helper utilities │ ├── routes/ # SvelteKit pages (+page.svelte, +server.js) │ ├── app.html # Entry HTML template and bootstrapping │ ├── hooks.client.ts # Client-side error handling │ ├── hooks.server.js # Request-time security headers and diagnostics │ └── service-worker.js # Custom PWA service worker ├── static/ # Public assets served at site root │ ├── pgp/ # PGP keys │ ├── disableSw.js # Service worker bypass (via ?nosw param) │ ├── manifest.json # PWA metadata │ ├── robots.txt # SEO: allow/disallow crawlers │ └── sitemap.xml # SEO: full site map ├── tests/ │ ├── e2e/ # Playwright end-to-end tests │ ├── meta/ # Metadata end-to-end CI tests │ └── unit/ # Vitest unit tests │ ├── client/ # Client-side (jsdom) unit tests │ ├── server/ # Server-side (node) unit tests │ │ └── internal/ # Internal audit/test helpers │ │ └── auditCoverage.test.js # Warns about untested source modules ├── CHANGELOG.md # Chronological record of notable project changes ├── vercel.json # Vercel configuration ├── package.json # Project manifest (scripts, deps, etc.) └── ... ``` ### 🔐 `static/pgp/` Directory Structure This directory contains public PGP key files. Their corresponding QR code images are now loaded dynamically from `src/lib/img/qr`. A dynamic QR code import utility in `src/lib/images.js` allows these files to be imported directly from `$lib`. ```bash static/ ├── pgp/ │ ├── contact@s.neteng.pro.asc # Public key for secure email │ ├── security@s.neteng.pro.asc # Public key for security contact │ ├── support@netwk.pro.asc # Public key for general support └── ... ``` - `.asc` files are **excluded from service worker precaching** but served directly via the `/pgp/[key]` route. - QR code images—including WebP and PNG versions—are **served dynamically** from `src/lib/img/qr` using `

## 🛡️ Configuration This project includes custom runtime configuration files for enhancing security, error handling, and PWA functionality. These modules are used by the framework during server- and client-side lifecycle hooks. ### 🔐 Security Headers and CSP Security headers are split between SvelteKit configuration and request-time server hooks: - `svelte.config.js` defines `kit.csp` with environment-based directives: - **Production/Audit**: Enforced, hardened CSP - **Test/Dev**: Uses `Content-Security-Policy-Report-Only` for safe diagnostics - `src/hooks.server.js` adds request-time headers and diagnostics: - `Report-To` metadata for production CSP reporting - Probely scanner diagnostics in audit mode - Audit-hostname mismatch warnings when `PUBLIC_ENV_MODE` is not `audit` - Standard HTTP security headers are also set in `src/hooks.server.js`: - `Permissions-Policy` - `X-Content-Type-Options` - `X-Frame-Options` - `Referrer-Policy` - `Strict-Transport-Security` (in non-test environments) --- ### ⚙️ CSP Behavior by Environment | Environment | Header | Analytics Enabled | CSP Reporting | | ------------ | ------------------------------------- | ----------------- | ------------- | | `production` | `Content-Security-Policy` | ✅ Yes | ✅ Yes | | `audit` | `Content-Security-Policy` | ❌ No | ❌ No | | `dev` | `Content-Security-Policy-Report-Only` | ❌ No | ✅ Yes (mock) | | `test` | `Content-Security-Policy-Report-Only` | ❌ No | ✅ Yes (mock) | --- ### 🧪 Reporting & Debugging - In **dev/test environments**, CSP headers are set to `report-only` mode. - Violations are POSTed to `/api/mock-csp`, which logs reports to the console. - In **production**, violations are sent to a real CSP collection endpoint (`https://csp.netwk.pro/.netlify/functions/csp-report`). - CSP selection is made at build/config time from `PUBLIC_ENV_MODE`, Vite mode, and local command fallbacks. - Requests for `audit.netwk.pro` are logged as diagnostics if the build was not produced with `PUBLIC_ENV_MODE=audit`. --- ### ⚠️ Current Trade-Off > SvelteKit manages CSP hashes/nonces for framework-generated inline scripts. The production policy keeps scripts restricted to `'self'`, while `style-src 'unsafe-inline'` remains because Svelte transitions can generate inline styles at runtime. The Keep Android Open banner is implemented first-party as a Svelte component to avoid third-party inline script injection. --- ### 📈 Future Improvements (Strict CSP Plan) To move toward a strict, nonce-based CSP: 1. Keep CSP policy construction in `svelte.config.js` so SvelteKit can manage framework hashes/nonces. 2. Keep third-party scripts out of `app.html` unless they work with the current CSP without inline script injection. 3. Add a CSP-compatible analytics stack only after consent, audit-mode, and deployment behavior are reviewed. 4. Review and refactor any components that rely on dynamic `style=` or `