mdd-webapp - 基于模型驱动的Web应用程序的概念和实现

网友投稿 602 2022-10-27

mdd-webapp - 基于模型驱动的Web应用程序的概念和实现

mdd-webapp - 基于模型驱动的Web应用程序的概念和实现

mdd-webapp

Concepts and implementation for a model-driven based web application.

Goal is to minimize development for basic applications (e.g. back-office and other data-entry applications).

Table of contents

ArchitectureBack-endFront-end TodoResources

## Architecture
### Back-end

Components:

  • list of models
  • each model have a form associated to it
  • a form enriches the fields of the model by adding more information to them
  • this information includes:
    • required/not-required
    • HTML element and eventual associated information (e.g. "select", with predefined values, or date-picker, or date-range with default initital and end date)
  • each model is exposed via API, in order to allow management of resources
  • each form is exposed via API, in order to focus the definition of a model and of the related form on the back-end side
### Front-end

Components

Components are:

  • "Form" component - For create or update.
  • "Table" component - For retrieve or delete.

Methods of "Form" component are:

  • html() - it returns the html for visualizing the form
  • save() - it creates a new resource
  • update() - it updates an existing resource

Methods of "Table" component are:

  • html() - it returns the html for visualizing the table
  • retrieve() - it returns a list of resources (using pagination)
  • delete() - it delete one single resource

Input for both "Form" component and "Table" component are:

  • Resource API endpoint - for example: "http://api.com/resource"
  • Form API endpoint - for example: "http://api.com/resource/form"

Notes for form visualization

TypeHtml Element
Stringselect, input, textarea
Numberselect, input
BooleanCheckbox
ObjectRecursively, based on: String, Number, Boolean, Object, Array
ArrayList of
Datedate-picker, date-range
functionNA
## TODO
  • Make first draft of the main concepts
  • Make diagram of the architecture
  • Choose elements for the implementation (Yeoman generator, etc.)
  • Add first example of implementation
  • Abstract and package components
  • Publish packages
## Resources
  • Loopback - Diagram
  • Bootstrap - Example of form
  • Baucis - Plug'n'play API
  • Forest-admin - No setup admin UI for mongoose
  • forms-mongoose package - example of form

版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:Dev gridcontrol 捕获按键事件
下一篇:access_profiler - 一个工具用于统计在C++程序中访问成员变量
相关文章

 发表评论

暂时没有评论,来抢沙发吧~