Detailed Graphical User Interface (GUI) architecture of the Reference Implementation
Describes the overall GUI architecture of the Reference Implementation and how it interacts with the back end.
| Name | Description |
|---|---|
| Main | The entry point of the application. Creates the instances of the Data Services and Localization Service. After that it renders the main Container Component called "App".
|
| State Store | The state store holds the state of the whole application. |
| Redux | Redux is used for JavaScript apps with the intent to ensure that the state is more predictable. |
| Data Services | Responsible for managing the communication between the models and the components. Can have different implementations (eg for server and client side rendering). Implementations are set by the main entry point. |
| Localization Service | Service which is used for localizing the website.
Handles
|
| Container Components | Collection of React components which take care of rendering the UI. Container components are high level components which are aware of the business logic of the application. |
| Presentation Components | Collection of React components which take care of rendering the UI. These components are more low level and focus on specific UI presentations and are not aware of business specific logic. |
| Entity Models | Maps to entities on the server (eg Page, Taxonomy). Responsible for:
|
| Theming | LESS libraries for overwriting styles for the website. Name of variables / mixins are provided with backwards compatibility:
Things you can change:
|
| Resources | resjson files with the UI string resources. |
| Name | Description |
|---|---|
| Controls React Wrappers | Provides wrappers for Controls written in plain javascript so they can be used as a React Component. |
| Controls | Library with Controls which match the SDL UX Guidelines. |
| React | A javascript rendering libary for building user interfaces. |
| React Router | Declarative routing for React. |
| Models | Library with base models / utilities. For example the model for loading data from the server, ajax utils... |
| Name | Description |
|---|---|
| Web App | Java based Spring application using the DXA Framework |