Use Cases

In case you want to know more about the benefits when using Vue Form Builder.

Case 1: Contact Form (Or some simple Form out there)

For a contact form, basically, it's just have some fields like:

• Name

• Email

• Message

But in the future, on a lovely day, your boss want to add some more fields into it. Jump in the code and add it, sure, why not?

But by the time you edited the code, test it. With Vue Form Builder, you don't even need to update the code itself. Simply go to your Form, Edit, Save => Finish (Obviously, you need to handle a little in your backend side)

Case 2: Big Form(s) in your Software Product

Have you ever feel that building the Form cost you a lot of time? You have to code a lot for the HTML Template, then data binding, name attribute,... And then, validation.

Wow, that's a lot of time in the development process. But after you finished, that's that.

And then, in the future, also on a lovely day, your customer WANT MORE FIELDS, want to store more data. Even they want to change some field's positions. LOL. Now you have to jump in to the code and arrange, do the update,... More time, more $$$.

That's why you need to use Vue Form Builder which you can create yourself a very first version for your feature. In the future, you can edit the Form and update it (more fields, arrangements,...). Easy, right?

Case 3: Still a Big Form(s) like above, but this time, Multi-Tenant System

I assume that you knew the Multi-Tenant Architecture already before reading this case

There are always problems with Multi-Tenant, especially the stuff contains FORM.

For example, we got a "Document" form to let the users fill it up. In database-view, columns are ready, we created many possible columns as the Customer would use.

So, our customer A need a Document form with these fields:

• Title

• Content

• Date

• Document Type

Sure, easy - no problemo, Form Added in the Source Code. Then we deployed it and let Customer A use it

In an absolute lovely day, we have a NEW Customer - Customer B. They also use the Document form. But they want different fields, like:

• Title

• Short Description

• Content

• Start Date - End Date

• Is Available to Process? (Checkbox)

• Document Type

As far as you can see, there're 3 differences above. So in order to build the Form for Customer B, you have these options:

• Fork the current project and named it as the CustomerB-YourProject. Then you're going to code a new Form. And you deploy a different project just only for Customer B (which is no more Multi-Tenant)

• Hard-coded the ID of the Tenant (if tenantId == xxx) { showForm(B) }

Both options above are hardly to maintain/upgrade. First, in the future, if there're more customers, more repository you need to take care of. Second, hard-coded is bad (but it gets the job done). Last, you have to take care the Form Code and make sure it doesn't break anytime you update it.

Therefore, like Case 2, Vue Form Builder is absolute a library just for you. Vue Form Builder will take care all the things about the Form. All you have to do is when saving the Form for specific Tenant, put their ID into it: INSERT INTO form_configurations (tenant_id, configuration, ...) VALUES (...) .

BOOM, your Form is now multi-tenant-able. You don't have to create more repository just because of a Tenant. You don't have to code the Form anymore :D

Pretty cool, right?