Wern Ancheta

Adventures in Web Development.

Introduction to FGenerate

| Comments

Here I am again writing yet another introduction for a project that I’m currently working on. FGenerate probably gives you an idea on what this project is all about. I’ll give you 3 seconds to guess. 1.. 2.. 3..

This project is all about generating code. The first time I had an idea. Of course this might be better off being a Sublime Text plugin or a plugin for a Text-editor or IDE but its not quite my level yet to be writing plugins for native applications and I’m specifically concentrated on the web alone that’s why I decided to write the app using JavaScript and PHP.

I actually started this project 2 months ago hoping that I could use it on my next project to make my life easier. Like any other idea it started small. I only wanted to generate forms based on mysql database at first but I later on thought that I could actually create an app that will save me plenty of time in doing repetitive stuff like hand coding html forms, AJAX form submission, hand coding tables and looping through the records from a database, form validation, user login and user management (roles, transactions and limiting what each user can do in the system), saving, updating, deleting data from the database.

Like many of us who have already a lot of experience doing this stuff over and over again I also got tired.

And that is why I created yellowpill and fgenerate to help ease the pain in doing this repetitive and mindless task for developers. If possible I’d like this app to do everything for me because I’m really lazy.

Ok enough with the drama this blog post is all about FGenerate. FGenerate is still a very young project (2 months old) so there aren’t much features yet. And yes there are still a whole bunch of bugs.

How To Install

First you’ll have to put the fgenerate folder on your web root. Edit the config.php file and config.js file to match your database configuration. And access the app at localhost/fgenerate

How To Use

The first thing you’ll see is a select box where you can see all of your mysql database. Just select one of those and click on connect:


Once you’ve selected a database to work on you will see the tables from that database. You can select one or more depending on your needs:


Then select the fields that you want to used on your form. You can control the defaults by editing the config.js file. The input fields that are generated are usually text fields.


From there you can customize the form. FGenerate is making use of html5 forms and form attributes like required and pattern And this is the only form of validation that is available for now but I’ll be adding JavaScript validation later for browsers that doesn’t support the new form features in html5.


Once you’re done with the customization you can go ahead and check the html code that is generated and simply copy it.



There’s still a lot of things that needs to be done for this project. Though I started this 2 months ago I never actually got to update it again after 2-3 weeks of working with it. Here are some of the things that needs to be done:

  • reordering of fields
  • deselecting fields and tables – currently the fields that are already in the form cannot be deleted when you uncheck the tables and fields which refers to the field
  • defining templates – the templates are largely dependent on twitter bootstrap. I would also like to add templates for foundation and maybe let users define their own templates
  • generating client-side validation code since html5 validation only works for browsers that actually support html5 form validation it would also be wise to add a separate client-side validation as well for non-supported browsers
  • removing id’s, classes and field attributes that are used to customize the form are still in the generated html code like edit_field and contenteditable="true"
  • reset everything when connecting to a database
  • generating php code for populating datalist and select options
  • generating JavaScript code for submitting form data to database
  • generating tables (since the queries are already generated by my yellowpill project, fgenerate will only generate the skeleton of the table)

Join Me

And with that I encourage you to join me in this project. Joining doesn’t necessarily mean helping in the development, if you’re interested in how far this project will go please spread the word so that I might be able to get someone to join me in the development. It would be awesome if someone more awesome will be joining me but I’ll also accept those who wish to learn (I really hope you can learn something even if my code isn’t that great). So yeah if you’re interested please leave a comment, if you know of a library or another project that already does this also leave a comment. If you want to join me, please talk to me on twitter. My twitter username is @wern_ancheta Thanks!