Frontend Work

ToddW

New member
Aug 20, 2006
719
8
0
I hate doing design work. I prefer to stick with the backend stuff...

So, I`m looking for something to rapidly deploy HTML Forms as I`m working on a couple projects that have MANY.

What's everyone using?

I'd prefer something that's point-n-click for not only the form but predefined CSS too so they aren't flat and boring. I don't care if it's web based, windows, or mac, free or paid... I just want something that's going to save me time :thumbsup:
 


What are you using the forms for?

What's wrong with a solution like Foundation 4? It's not point and click, but it's pretty straight forward to implement.
 
Things really depend on what language you use.

If you use C#, you can easily use the WYSIWYG of visual studio but you will still need to use css. For php there are several solutions as well.

Another solution would be to just look for free html templates, these will deliver the css for you and all you need to do is adjust what you want to see differently. these templates are perfectly compatible with most server side technologies.

A lot of CMS solutions also have tons of predefined css/html templates like wordpress, so if you work in php, all you need to learn is how plugin to these CMS solutions.

Unfortunately all front end frameworks have a learning curve. Whenever you want to be able to change some detail in your front you will need to go back to some basic form of slicing/design.... allthough there are solutions/services that can generate html for you based on your design(look for design to html converter), most of the time this will mean modifying your css one way or the other
 
Bootstrap + WTForms + flask-bootstrap.

Make your form object:
Code:
class SiteForm(Form):
    name = TextField('Name', validators=[Required()])
    url = TextField('URL', validators=[Required(), URL()])

Create an instance of it in your view:
Code:
new_site_form = forms.SiteForm()

Display it in your template:
Code:
    <div class="span6">
      <h3 class="box-header"><i class="icon-plus"></i>Add New Site</h3>
      <div class="box">
        {{ wtf.quick_form(new_site_form, buttons=[('submit', 'primary', 'Add Site')]) }}
      </div>
    </div>

Validate the form when it has been submitted:
Code:
if new_site_form.validate():

Use the form's data:

Code:
new_site_form.data.name

A lot of this can be abstracted out if you are making very similar forms for similar situations. Notice I didn't write any form-specific HTML :)