{"id":13559223,"url":"https://github.com/sethsandaru/vue-form-builder","last_synced_at":"2025-04-03T14:31:35.353Z","repository":{"id":32977864,"uuid":"146968454","full_name":"sethsandaru/vue-form-builder","owner":"sethsandaru","description":"Super Form Builder built on top of Vue with Drag \u0026 Drop functionality, savable-form-schema and easy to maintain/upgrade your form.","archived":true,"fork":false,"pushed_at":"2024-05-13T07:11:08.000Z","size":9653,"stargazers_count":415,"open_issues_count":20,"forks_count":129,"subscribers_count":23,"default_branch":"master","last_synced_at":"2025-04-03T12:58:37.465Z","etag":null,"topics":["demo","drag-and-drop","form","form-builder","vue","vue-form-builder","vuejs"],"latest_commit_sha":null,"homepage":"http://vue-form-builder.sethphat.com","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sethsandaru.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"ko_fi":"sethphat"}},"created_at":"2018-09-01T04:48:04.000Z","updated_at":"2025-01-07T16:11:48.000Z","dependencies_parsed_at":"2024-06-19T00:11:37.307Z","dependency_job_id":"bb3cce5c-4ec6-47bb-9aa2-b5fb9a9fd49e","html_url":"https://github.com/sethsandaru/vue-form-builder","commit_stats":{"total_commits":129,"total_committers":5,"mean_commits":25.8,"dds":"0.49612403100775193","last_synced_commit":"097c1c185f37f3bb8f87a0e9c61ee3b062a25d86"},"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sethsandaru%2Fvue-form-builder","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sethsandaru%2Fvue-form-builder/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sethsandaru%2Fvue-form-builder/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sethsandaru%2Fvue-form-builder/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sethsandaru","download_url":"https://codeload.github.com/sethsandaru/vue-form-builder/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247018485,"owners_count":20870007,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["demo","drag-and-drop","form","form-builder","vue","vue-form-builder","vuejs"],"created_at":"2024-08-01T12:05:26.293Z","updated_at":"2025-04-03T14:31:33.506Z","avatar_url":"https://github.com/sethsandaru.png","language":"Vue","funding_links":["https://ko-fi.com/sethphat"],"categories":["Vue","vuejs","vue"],"sub_categories":[],"readme":"# vue-form-builder\n[![npm version](https://badge.fury.io/js/v-form-builder.svg)](https://www.npmjs.com/package/v-form-builder)\n[![GitHub license](https://img.shields.io/github/license/sethsandaru/vue-form-builder.svg?style=flat-square)](https://github.com/sethsandaru/vue-form-builder/blob/master/LICENSE) ![img](https://img.shields.io/npm/dm/v-form-builder.svg)\n[![img](https://img.shields.io/badge/documentation-full-green.svg?longCache=true\u0026style=flat-square)](https://phattranminh96.gitbook.io/vue-form-builder/)\n\nA simple builder to help you generate a super form for your features/modules/sites,... Easy to use, create, upgrade, maintain,...\nWhy need to code the form when you can use `Vue-Form-Builder` and render it with some extra steps :D\n\nAdvantages:\n- Less code in development (No need to do `\u003cform\u003e \u003cdiv\u003e \u003cinput\u003e .... \u003c/div\u003e \u003c/form\u003e` this by your own)\n- Easy to maintain, update your Form in the future.\n- Setup your Form with a super friendly UI/UX.\n- Extensibility (Your custom control, styling,...)\n- Form Validation? I got you fam.\n- Included HTML5 structure, no tricks or cheats.\n- **NO MORE JQUERY INCLUDED**\n\nGive this repo a ⭐ (star) if you actually like this and might use it for your project :D! Thank you!\n\nFeel free to open an issue if you reach any bugs or issues. Thanks.\n\n[Vue Form Builder Documentation](https://phattranminh96.gitbook.io/vue-form-builder/)\n\n## Demo\n- Demo Online: [Vue Form Builder ONLINE](https://vue-form-builder.herokuapp.com/)\n- Demo Form (Real Life Example): \n    - [Vue Form Builder Real Life Example](http://vue-form-builder.sethphat.com/)\n    - Repo: https://github.com/sethsandaru/demo-vue-form-builder\n\n## Supported Browsers\n\n![Chrome](https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png) | ![Firefox](https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png) | ![IE](https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png) | ![Opera](https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png) | ![Safari](https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png)\n--- | --- | --- | --- | --- |\nLatest ✔ | Latest ✔ | 9+ ✔ | Latest ✔ | 6.1+ ✔ |\n\n## How to install?\n\n### NPM / Yarn\n```php\nnpm i v-form-builder --save\n```\n\n### Browser\n- Download the Latest [Release](https://github.com/sethsandaru/vue-form-builder/releases)\n```html\n    \u003clink rel=\"stylesheet\" href=\"v-form-builder.min.css\"\u003e\n\n    \u003cscript src=\"vue.min.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"v-form-builder.umd.min.js\"\u003e\u003c/script\u003e\n```\n\n### CDN\n\n#### jsDelivr\n\nLatest version (@2.1.0)\n```html\n\u003clink rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/gh/sethsandaru/vue-form-builder/dist/v-form-builder.min.css\"\u003e \n\u003cscript src=\"https://cdn.jsdelivr.net/gh/sethsandaru/vue-form-builder/dist/v-form-builder.umd.min.js\"\u003e\u003c/script\u003e\n```\n\n## Installation Note\n- For the best experience, please install the latest version!\n- Version below **@v2.0.0** has been deprecated. No maintain \u0026 fix bugs. Please use 2.0.0 or above.\n\n## Documentation\n\n[Main Documentation of Vue-Form-Builder](https://phattranminh96.gitbook.io/vue-form-builder/)\n\n## How to implement for a beginner?\n\n- [Turning Up The Form](https://phattranminh96.gitbook.io/vue-form-builder/getting-started/turning-up-the-form)\n- [Form Builder](https://phattranminh96.gitbook.io/vue-form-builder/getting-started/form-builder-starter)\n- [Form Renderer](https://phattranminh96.gitbook.io/vue-form-builder/getting-started/form-renderer-starter)\n\n### Usage / Use-cases\n\n[Some of the use-cases I mentioned](https://phattranminh96.gitbook.io/vue-form-builder/use-cases)\n\n### APIs / Extending / Hard-core stuff\n\n[Visit Documentation](https://phattranminh96.gitbook.io/vue-form-builder/extending/plugin-options)\n\n## Dependencies\nI carefully watch the dependencies of the Vue Form Builder, from the version **2.0.0** and above. Here is the list:\n\n- Vue JS (obviously) - But it won't be built together with the final library bundle\n- vuedraggable: From `Sortable.JS` which is very lightweight and much lighter than JQuery + JQuery UI\n- deep-equal: A simple method to check the Form Configuration\n- Datepicker - LitePicker (Super lightweight, ~5KB): https://wakirin.github.io/Litepicker/\n- DayJS - Parse/Formatting date (2KB): https://day.js.org/en/\n\nSee more at: [package.json](./package.json) and look at the `dependencies`\n\nMy truly desire: Fewer dependencies as possible and try minimize the size as much as possible.\n\n## Release notes\n\n### 2.1.0 \n- Added Tab Section\n- Added Basic Role-based Configuration\n- Added `regex` Validation\n- Fixed bugs\n- Security updated\n\n### 2.0.1\n- Added CSS Classes that worked for Material Design (Thanks to @abhimanusharma)\n- Fixed bugs\n- Security updated\n\n### 2.0.0\n- New structural, new behaviour, everything is new.\n- Less and less ugly code\n- Make the process/development/configuration more simple than previous version.\n- **Less dependencies / JQuery totally removed**\n    \n## License\nMIT License\n\n## Developing the Vue Form Builder\nFor hard-core developers, of course, you can clone this repository and then getting started with these steps:\n\n- `npm install` - obviously\n- `npm run serve` - this will run the `main.ts` which is the main web page to see the Vue Form Builder\n\nThen you will know what you can take a look next: configs, components, views,...\n\n## Custom Form Builder\n\nI'm always available for Custom Build based on your needs for the Vue Form Builder. You can contact me via:\n\n- Email: [phattranminh96@gmail.com](mailto:phattranminh96@gmail.com)\n- LinkedIn (On my main profile page)\n\n## Supporting the project\nYou can see the lovely `Sponsor` button on the top. If you want to contribute a little, send me a coffee is good enough.\n\nAlso, please show your love by giving this repository a ⭐ (star). That would lighten up my day.\n\nCopyright \u0026copy; 2018 by [Seth Phat](http://sethphat.com) aka Phat Tran!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsethsandaru%2Fvue-form-builder","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsethsandaru%2Fvue-form-builder","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsethsandaru%2Fvue-form-builder/lists"}