Skip to content
This repository has been archived by the owner on May 13, 2024. It is now read-only.

[] (Lorence) Custom Control #124

Open
wants to merge 28 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 11 commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
fd119c4
[] (Lorence) Custom Control
Mar 21, 2022
7ad92a5
[] (Lorence) Build with library
Mar 21, 2022
722be55
[] (Lorence) Optimize and create new Text HTML Element
Mar 26, 2022
04e4e85
[] (Lorence) Add Vue-Editor in Vue Component
Mar 26, 2022
4ff118a
[] (Lorence) Update Layout Configurations
Mar 26, 2022
216baa1
[] (Lorence) Optimize and build custom Form builder
Mar 26, 2022
e879ff1
[] (Lorence) Add build style
Mar 26, 2022
2e54b2b
[] (Lorence) Optimize UI in Form
Mar 27, 2022
0a3d1cd
[] (LOrence) Optimize and build the Vue-editor
Mar 27, 2022
5a64a4e
[] (Lorence) Optimize and build the website
Mar 27, 2022
bde9e9b
Create README.md
flagtick Mar 31, 2022
e267daf
[] (Lorence) Optimize and build the fullscreen options
Apr 5, 2022
8b1d047
Merge branch 'lorence' of https://github.com/flagtick/flagtickbuilder…
Apr 5, 2022
7d20f33
[] (Lorence) Optimize and add handle for z-Index
Apr 5, 2022
e3954ab
[] (Lorence) Optimize and build the website
Apr 6, 2022
ee23ec9
[] (Lorence) Re-adjust UI
Apr 6, 2022
60e671f
[] (Lorence) Add Link component
Apr 28, 2022
8ef866a
[] (Lorence) Optimize Link Component
Apr 28, 2022
de4c22a
[] (Lorence) Optimize and re-build template
Apr 28, 2022
f8d6b11
[] (Lorence) Fix issue happen in Download link
May 5, 2022
6fc1f16
[] (Lorence) Optimize Download Link Component
May 5, 2022
d19bf1b
[] (Lorence) Handle error when controls is undefined
May 7, 2022
06e15b3
Commit lib
May 10, 2022
5f6645d
[] (Lorence) Optimize and implement Youtube component
May 10, 2022
2ab06b7
[] (Lorence) Fix URL
May 10, 2022
e586f4d
[] (Lorence) Using this to get control variable
May 10, 2022
51c277d
[] (Lorence) Optimize and build the Web app
May 10, 2022
8b50828
[] (Lorence) Optimize and remove constant to init value in ContainClass
May 21, 2022
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 0 additions & 21 deletions LICENSE

This file was deleted.

143 changes: 3 additions & 140 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,140 +1,3 @@
# vue-form-builder
[![npm version](https://badge.fury.io/js/v-form-builder.svg)](https://www.npmjs.com/package/v-form-builder)
[![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)
[![img](https://img.shields.io/badge/documentation-full-green.svg?longCache=true&style=flat-square)](https://phattranminh96.gitbook.io/vue-form-builder/)

A simple builder to help you generate a super form for your features/modules/sites,... Easy to use, create, upgrade, maintain,...
Why need to code the form when you can use `Vue-Form-Builder` and render it with some extra steps :D

Advantages:
- Less code in development (No need to do `<form> <div> <input> .... </div> </form>` this by your own)
- Easy to maintain, update your Form in the future.
- Setup your Form with a super friendly UI/UX.
- Extensibility (Your custom control, styling,...)
- Form Validation? I got you fam.
- Included HTML5 structure, no tricks or cheats.
- **NO MORE JQUERY INCLUDED**

Give this repo a ⭐ (star) if you actually like this and might use it for your project :D! Thank you!

Feel free to open an issue if you reach any bugs or issues. Thanks.

[Vue Form Builder Documentation](https://phattranminh96.gitbook.io/vue-form-builder/)

## Demo
- Demo Online: [Vue Form Builder ONLINE](https://vue-form-builder.herokuapp.com/)
- Demo Form (Real Life Example):
- [Vue Form Builder Real Life Example](http://vue-form-builder.sethphat.com/)
- Repo: https://github.com/sethsandaru/demo-vue-form-builder

## Supported Browsers

![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)
--- | --- | --- | --- | --- |
Latest ✔ | Latest ✔ | 9+ ✔ | Latest ✔ | 6.1+ ✔ |

## How to install?

### NPM / Yarn
```php
npm i v-form-builder --save
```

### Browser
- Download the Latest [Release](https://github.com/sethsandaru/vue-form-builder/releases)
```html
<link rel="stylesheet" href="v-form-builder.min.css">

<script src="vue.min.js"></script>
<script src="v-form-builder.umd.min.js"></script>
```

### CDN

#### jsDelivr

Latest version (@2.1.0)
```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/sethsandaru/vue-form-builder/dist/v-form-builder.min.css">
<script src="https://cdn.jsdelivr.net/gh/sethsandaru/vue-form-builder/dist/v-form-builder.umd.min.js"></script>
```

## Installation Note
- For the best experience, please install the latest version!
- Version below **@v2.0.0** has been deprecated. No maintain & fix bugs. Please use 2.0.0 or above.

## Documentation

[Main Documentation of Vue-Form-Builder](https://phattranminh96.gitbook.io/vue-form-builder/)

## How to implement for a beginner?

- [Turning Up The Form](https://phattranminh96.gitbook.io/vue-form-builder/getting-started/turning-up-the-form)
- [Form Builder](https://phattranminh96.gitbook.io/vue-form-builder/getting-started/form-builder-starter)
- [Form Renderer](https://phattranminh96.gitbook.io/vue-form-builder/getting-started/form-renderer-starter)

### Usage / Use-cases

[Some of the use-cases I mentioned](https://phattranminh96.gitbook.io/vue-form-builder/use-cases)

### APIs / Extending / Hard-core stuff

[Visit Documentation](https://phattranminh96.gitbook.io/vue-form-builder/extending/plugin-options)

## Dependencies
I carefully watch the dependencies of the Vue Form Builder, from the version **2.0.0** and above. Here is the list:

- Vue JS (obviously) - But it won't be built together with the final library bundle
- vuedraggable: From `Sortable.JS` which is very lightweight and much lighter than JQuery + JQuery UI
- deep-equal: A simple method to check the Form Configuration
- Datepicker - LitePicker (Super lightweight, ~5KB): https://wakirin.github.io/Litepicker/
- DayJS - Parse/Formatting date (2KB): https://day.js.org/en/

See more at: [package.json](./package.json) and look at the `dependencies`

My truly desire: Fewer dependencies as possible and try minimize the size as much as possible.

## Release notes

### 2.1.0
- Added Tab Section
- Added Basic Role-based Configuration
- Added `regex` Validation
- Fixed bugs
- Security updated

### 2.0.1
- Added CSS Classes that worked for Material Design (Thanks to @abhimanusharma)
- Fixed bugs
- Security updated

### 2.0.0
- New structural, new behaviour, everything is new.
- Less and less ugly code
- Make the process/development/configuration more simple than previous version.
- **Less dependencies / JQuery totally removed**

## License
MIT License

## Developing the Vue Form Builder
For hard-core developers, of course, you can clone this repository and then getting started with these steps:

- `npm install` - obviously
- `npm run serve` - this will run the `main.ts` which is the main web page to see the Vue Form Builder

Then you will know what you can take a look next: configs, components, views,...

## Custom Form Builder

I'm always available for Custom Build based on your needs for the Vue Form Builder. You can contact me via:

- Email: [[email protected]](mailto:[email protected])
- LinkedIn (On my main profile page)

## Supporting the project
You can see the lovely `Sponsor` button on the top. If you want to contribute a little, send me a coffee is good enough.

Also, please show your love by giving this repository a ⭐ (star). That would lighten up my day.

Copyright &copy; 2018 by [Seth Phat](http://sethphat.com) aka Phat Tran!
# flagtickbuilder
Super Form Builder built on top of Vue with Drag &amp; Drop functionality, savable-form-schema and easy to maintain/upgrade your form.
For website: www.flagtick.com
Loading