Adding architectural descriptions to the documentation

[WolfgangFahl]

The software architecture of justpy needs quite some explanation to make the code base maintainable.

Currently the documentation is focussed on a user view and there are excellent tutorials how to use justpy in different usecase and
how to configure it for the purposes.

For the maintainers and to enhance the software it would be helpful to get an overview of the software and do a classical hierachical decomposition of what justpy consists of

System context
The top level view of the hierachical decomposition should show the core elements of justpy.

Here is a draft plantuml - diagram for this source code

Vue

• https://vuejs.org/guide/essentials/component-basics.html#using-a-component

Diagrams
According to https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/creating-diagrams it is possible to use diagrams in github markup:

graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;

Loading

https://github.com/mermaid-js/mermaid/blob/develop/docs/classDiagram.md shows the support of class Diagrams.

classDiagram
    Animal <|-- Duck
    Animal <|-- Fish
    Animal <|-- Zebra
    Animal : +int age
    Animal : +String gender
    Animal: +isMammal()
    Animal: +mate()
    class Duck{
        +String beakColor
        +swim()
        +quack()
    }
    class Fish{
        -int sizeInFeet
        -canEat()
    }
    class Zebra{
        +bool is_wild
        +run()
    }

Loading

[WolfgangFahl]

Link: http://diagrams.bitplan.com/render/png/0xf2d17f13.png
Source code: http://diagrams.bitplan.com/render/txt/0xf2d17f13.txt

[WolfgangFahl]

http://diagrams.bitplan.com/render/png/0xd6358687.png

Source code: http://diagrams.bitplan.com/render/txt/0xd6358687.txt