I have to develop an app which has to works on every kind of device like desktop, iPad and mobiles. This app will not use any native UI. The only thing is it has to be developed using Force.com. Any idea which framework (like Bootstrap) fits well while working on Force.com?


The easiest and simplest starting point is to look at the hybrid samples in the force.com Mobile SDK. By default, these use jQuery Mobile which takes care of optimising the app UI for various screen sizes (to a certain extent). You can always replace jQuery Mobile with any other HTML5 framework such as Sencha Touch, Twitter Bootstrap or any other. The above holds true if you want to develop apps which install on devices.

On the other hand, if you simply want your VisualForce pages to be rendered optimally across multiple devices, you should strongly consider looking at Mobile Components for VisualForce - http://wiki.developerforce.com/page/Creating_a_Mobile_Component_for_Visualforce

If you want to use jQuery Mobile in VisualForce pages, please take a look at this tutorial - http://blogs.developerforce.com/developer-relations/2011/07/jquery-mobile-in-visualforce-pages.html

If you want to use Twitter Bootstrap, this is a good starting point - http://blog.tquila.com/2012/10/22/using-twitter-bootstrap-with-vf-pages/

Hope this helps.

  • There was also a three-part blog series on developer.force.com relating to using Sencha as a mobile/touch-based front-end for a visualforce app. wiki.developerforce.com/page/… – pchittum Jan 31 '13 at 13:26
  • Bootstrap seems to be the solution but how would I take care of validations and error messages? I would use JS to validate fields. I want my error messages to be consistent across all the devices – doga Feb 1 '13 at 6:26
  • Yes, it would be handled by whichever framework you choose. What do you mean by having the error messages 'consistent' across all devices? It would be the same error message - correct? – Gaurav Kheterpal Feb 1 '13 at 7:32

Bootstrap works just like you would normally use it, since you don't use any native UI components you can just program HTML/CSS/Javascript like you would normally do in web development.

I have used Bootstrap in combination with (sales)force.com, just make sure you upload the bootstrap files as a static resource, reference them in your pages, and you should be ready to go. Normally you won't have any conflicts in javascript either, since you don't use the native UI components, just make sure you put standardStylesheets="false" in your apex:page header

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.