Stephan Lo
9aea2a3583
Created a complete documentation system for new documentors, including
interactive architecture diagrams and step-by-step guides for all documentation
workflows.
New LikeC4 architecture project (resources/doc-likec4/):
- Created documentation-platform.c4 model with 252 lines covering:
* Actors: documentor, reviewer, CI system, edge platform
* Tools: Hugo, LikeC4, Git, VS Code, markdownlint, htmltest
* Processes: local development, testing, CI/CD pipeline
* Repositories: git repo, cloudlet registry
- Defined 6 comprehensive views:
* overview: Complete documentation platform ecosystem
* localDevelopment: Local writing and preview workflow
* cicdPipeline: Automated testing and validation
* deploymentFlow: From commit to production
* fullWorkflow: End-to-end documentation lifecycle
* testingCapabilities: Quality assurance toolchain
New documentation pages (content/en/docs/documentation/):
- _index.md: Overview and introduction for new documentors
- local-development.md: Setting up local environment, live preview
- testing.md: Running markdown, HTML, and link validation
- cicd.md: Understanding automated CI/CD pipeline
- publishing.md: Deployment to Edge Connect Munich cloudlet
- quick-reference.md: Command reference and common tasks
Hugo shortcode for embedding LikeC4 diagrams:
- Created layouts/shortcodes/likec4-view.html
- Supports loading state with animated indicator
- Graceful error handling for missing views
- Automatic shadow DOM checking to ensure webcomponent loaded
- Usage: {{< likec4-view view="viewId" project="projectName" >}}
Supporting documentation:
- resources/LIKEC4-REGENERATION.md: Guide for regenerating webcomponents
- All diagrams are interactive and explorable in the browser
- Views include zoom, pan, and element inspection
This implementation provides:
1. Self-documenting documentation platform ("meta-documentation")
2. Visual learning for complex workflows via interactive diagrams
3. Clear separation of concerns (6 focused views vs 1 overwhelming diagram)
4. Onboarding path for new team members
5. Living architecture documentation that evolves with the platform
All new documentation passes markdown linting and builds successfully.
|
||
|---|---|---|
| .devcontainer | ||
| .github/workflows | ||
| .vscode | ||
| assets | ||
| content/en | ||
| layouts | ||
| resources | ||
| scripts | ||
| static | ||
| .dockerignore | ||
| .env.versions | ||
| .gitignore | ||
| .gitmodules | ||
| .htmltest.yml | ||
| .htmlvalidate.json | ||
| .markdownlint.json | ||
| config.yaml | ||
| devbox.json | ||
| devbox.lock | ||
| DOCKER.md | ||
| Dockerfile | ||
| edgeconnectdeployment.yaml | ||
| go.mod | ||
| go.sum | ||
| hugo.toml | ||
| k8s-deployment.yaml | ||
| LIKEC4-QUICKSTART.md | ||
| package-lock.json | ||
| package.json | ||
| README-developer.md | ||
| README.md | ||
| RELEASE.md | ||
| Taskfile.yml | ||
| TESTING.md | ||
| VERSIONS.md | ||
IPCEICIS-DeveloperFramework Documentation
This repo contains business and architectural design and documentation of the DeveloperFramework subproject of IPCEI-CIS.
How to read and contribute to this documentation locally
The documentation is done in Hugo-format.
Hugo is a static site renderer - so to get the documentation site presented you need a running Hugo processor. Therefore there is
- either a Hugo
.devcontainer-definition - just run a devcontainer aware IDE or CLI, e.g. Visual Studio code - or a Hugo
Devbox-definition - in this case just run a devbox shell
Local installation of the Hugo documentation system
We describe two possible ways (one with devcontainer, one with devbox) to get the Hugo-documentation system locally running.
For both prepare the following three steps:
- open a terminal on your local box
- clone this repo:
git clone https://forgejo.edf-bootstrap.cx.fg1.ffm.osc.live/DevFW/website-and-documentation - change to the repo working dir:
cd website-and-documentation
Possibility 1: Hugo in a devcontainer
devcontainers are running containers as virtual systems on your local box. The defintion is in the .devcontainer folder.
Thus as preliminary you need a container daemon running, e.g. Docker.
There are several options to create and run the devcontainer - we present here two:
Option 1: Run the container triggered by and connected to an IDE, e.g. VS Code
- open the repo in an Devcontainer-aware tool/IDE (e.g.
code .) - start the
devcontainer(in VSC it'sF1 + Reopen in Devcontainer) - when the container is up & running just open your browser with
http://localhost:1313/
Option 2: Run the container natively
An alternative to get the container image is the devcontainer CLI, then you can run the devcontainer without VS Code. Thus as preliminary you need to do the install steps of the devconatiner cli.
- start the devcontainer by running:
devcontainer up --workspace-folder . - find out the IP address of the devconatiner by using
docker psanddocker inspect <id of container> - when the container is up & running just open your browser with
http://<DOCKER IP>:1313/
Possibility 2: Hugo in a devbox
Devboxes are locally isolated environments, managed by the Nix package manager. So first prepare the devbox.
Then
devbox shell- In the shell:
hugo serve
Editing
Documentation language
The documentation is done in Docsy-Theme.
So for editing content just goto the content-folder and edit content arrording to the Docsy documentation
Commiting
After having finished a unit of work commit and push.
Annex
Installation steps illustrated
When you run the above installation, the outputs could typically look like this:
In Visual Studio Code
Reopen in Container
Hugo server is running and (typically) listens to localhost:1313
After some installation time you have:
Final result in a web browser
