2.0 KiB
System Builder
System builder is a full stack builder for apps that allows you to define your data backend, APIs and views of the data and design your own apps or webpages
UI Components
All UI components need to be able to link into any data/api that has been fetched.
- Text
- Image
- Input (all types) plus Date Picker and Dropdown, checkbox, radio, text, textarea, email, password
- Markdown editor: https://simplemde.com/ plus https://github.com/showdownjs/showdown
- Table (with actions per item, maybe buttons on the list item)
- List (with actions per item, maybe buttons on the list item)
- Button (with text and actions)
- charts?
- div? <- probably just a 'section' that can contain other components
- Loading style/animation?
Things to keep track of
There will have to be stuff we keep track of in order to reproduce the page as the user created it.
- All styles -> possibly apply css dynamically this way: https://stackoverflow.com/questions/1720320/how-to-dynamically-create-css-class-in-javascript-and-apply
- Location in the document (could be hard coded but makes it hard for responsive design)
- class and id names for reference in styles and events
- accessibility text and other accessibility info
Other things
- Upload images to use in styles for backgrounds or elements
- Save text and such in the database separate from the data source
How data sources will work
Many data sources can be defined or connected, but the default will be the app that is created in the system builder UI. Each view gets created with a unique name. All components can pull data from a view by referencing the view's name plus property or index. Data sources will all be pulled using the RXJS pattern used in bx-console and referenced by their unique names. Update calls will allow you to define a list of get requests to refresh after the update calls are made. Each view will have some state stored on it in addition to the data, including loading, and error state/messages.