Frontend Form Generator

Frontend form generator requires to identify the @Actor, @Model and @Action for form generator in the framework of your choice. We provide three frontend form generator prompts for Angular, ReactJS and Django.

Frontend design and build with prompts is still in its infancy, but we have achieved a great deal of success. The frontend which is generated by AI has basic functionalities over which you can apply your own theming to improve its aesthetics. Thankfully, we humans know beauty the best. AI can stay busy with functionalities (😁).

For form creation, all we need is model information. A model is a list of attributes for an actor or an asset. Whenever a user takes an action, they would do so over the webpage(assumption). Their actions would result in both frontend and backend activity. We have already built the backend controller and API. All we need is the promptset for form and frontend controller. That’s it. So let’s proceed.

Form with @Model

Here we are giving an example for Angular (v 18), but this pattern is generally applicable to all the major frameworks like ReatJS, VueJs, Svelte, etc.

The promptset can be built as per following

• File name: The files are generally named after the @actor who can access all the methods. This also allows for grouping the security policy for that user. One can also use extra prompts for security specifications as explain in Data privacy. 
• The angular components can be grouped together for an user
• All sub-components or touter-outlet views can be the methods(@Asset-@Action).
• The model and process can collect the data from the form and send it to the controller API service.
• The type variable for each form field can be determined by prompting it accordingly.
• Method naming: The methods are named as per the asset and action, like fileUpload. This type of method name can be added in API promptset(separately for file head responsible for API file)
• Internal prompt: The internal code prompt is built using the AAAMP around the user/asset/action with respective model and process to generate the whole function code.

—————Initial Code—————————

————————————————————

————Prompt————————————

————————————————————

Next: Controller API with @Action