The WYSIWYG Form-Builder app is a powerful web application that allows users to create customized forms with a "What You See Is What You Get" (WYSIWYG) interface. This app was developed for our sponsor, Auxillium Group, to streamline the process of creating and managing forms for their internal and external use.
With this app, users can easily drag and drop form elements, such as text fields, checkboxes, radio buttons, and dropdown menus, onto the canvas. They can then customize the appearance and behavior of these elements using the intuitive interface provided by Angular Material components.
-
WYSIWYG Interface: The app provides a user-friendly drag-and-drop interface, allowing users to design forms visually, making it easy for both technical and non-technical users.
-
Form Element Library: A collection of commonly used form elements is available, enabling users to select and add elements to the canvas effortlessly.
-
Customization Options: Users can customize the appearance of form elements, including colors, fonts, and layouts. Additionally, they can set validation rules for each element.
-
Form Export: Once the form is created, users can export it in various formats, such as HTML, JSON, or XML, for easy integration into websites or applications.
- Frontend: Angular, Angular Material
This project was generated with Angular CLI version 13.2.4.
Run ng serve
for a dev server. Navigate to http://localhost:4200/
. The app will automatically reload if you change any of the source files.
Run ng generate component component-name
to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module
.
Run ng build
to build the project. The build artifacts will be stored in the dist/
directory.
Run ng test
to execute the unit tests via Karma.
Run ng e2e
to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
To get more help on the Angular CLI use ng help
or go check out the Angular CLI Overview and Command Reference page.