Hi All,
We are in the process of developing $subject. Tentatively this webapp
server is named as "Carbon UI Server".
# Major goals of this webapp server are following:
- Enforcing security measures.
- Setting proper cache headers
- Setting recommended security related HTTP headers
- Protection against file system navigation through URLs
- Defining a structure for webapps.
- Requirement is to properly define places to put page(s), themes, UI
extensions, and internalization language files in the webapp.
- Proper routeing for SPA apps.
- For SPA apps, index.html should be served for any request for a
page.
# Proposing directory structure:
- Webapps will be placed in <carbon_home>/wso2/<runtime>/
deployments/reactapps/
- Structure of a webapp:
<app_name>
├── configuration.yaml
│
├── extensions
│ ├── widgets
│ │ ├── line-chart/
│ │ ├── bar-chart/
│ │ └── calendar/
│ │ ├── bundle.js
│ │ ├── styles.css
│ │ └── widget.json
│ │
│ └── device-types
│ ├── andoid/
│ ├── ios/
│ └── ardino/
│ └── ports.json
├── i18n
│ ├── fr.properties
│ └── en.properties
│
├── pages
│ └── index.html
│
├── public
│ ├── images
│ │ └── logo.png
│ ├── css
│ │ └── styles.css
│ └── js
│ └── bundle.js
│
└── themes
├── dark/
└── light
├── js
│ └── some.js
└── css
└── styles.css
- configuration.yaml will contain configurations of the web app (e.g. app
context path, custom security headers). These configurations should be able
to add/override through the deployment.yaml file.
- extensions directory contains UI extensions. There can be multiple types
of extensions and they are categorized accordingly into sub-directories
inside the extensions directory. Each extension should be wrapped with a
directory (the name of the directory will be the name of the extension),
and placed inside the relevant type. Thus, the fully qualified name of an
extension will be <type>:<name> (e.g. widgets:line-chart)
- i18n directory will bear the internalization language files.
- public directory contains any client-side resources of the app.
- themes directory contains the themes of the app. Each theme should be put
inside a sub-directory.
# URL patterns:
- Pages
- <app_context_path>/path/to/page (e.g. https://localhost:9292/pets-
store/home)
- Resources of the app
- <app_context_path>/public/app/<path-relative-to-public-directory>
(e.g. https://localhost:9292/pets-store/public/app/images/logo.png)
- Resources of an extension
- <app_context_path>/public/extensions/<type>/<name>/<
path-relative-to-extension-directory> (e.g.
https://localhost:9292/pets-store/public/extensions/
widgets/calendar/styles.css
<https://localhost:9292/pets-store/public/extensions/widgets/calendar/styles.css>
)
- Resources of a theme
-
<app_context_path>/public/themes/<name>/<path-relative-to-theme-directory>
(e.g. https://localhost:9292/pets-store/public/themes/light/css/
styles.css)
WDYT?
Thanks.
--
Sajith Janaprasad Ariyarathna
Senior Software Engineer; WSO2, Inc.; http://wso2.com/
<https://wso2.com/signature>
_______________________________________________
Architecture mailing list
Architecture@wso2.org
https://mail.wso2.org/cgi-bin/mailman/listinfo/architecture
