Search code examples
twitter-bootstrapkendo-uiresponsive-designhybrid-mobile-appkendo-mobile

Kendo UI based responsive web application


We're working on a UI that will span from desktop to mobile. We've developed the UI with Kendo UI as a Single Page Application (SPA), laid on top of Bootstrap.

As we're working on refining the mobile UI, there are a few Kendo Mobile controls we'd like to implement. (Swipe, Switch, etc.)

But now I'm wondering which approach we should actually take:

  1. Responsive site: desktop to mobile
  2. Desktop site (Kendo UI) + Hybrid Mobile app (HTML + JS + CSS + Kendo on Cordova)

Has anyone had success with Option 1? It seems like a huge time saver to develop one complete system. We're not doing heavy data manipulation / editing, so we don't exactly need a distinct mobile UI. Can you point me to any blogs / articles / samples if so?

If the better solution is #2, does anyone have any suggestions for how to develop a code base with as much re-usable logic as possible?


Solution

  • I think this would depend on the app requirements.

    • Network connection

    Option 1 (responsive site) would require you to be online. Option 2 (mobile app) would let you be offline, but adds the complication of syncing data that is edited offline.

    • App Store deployment

    Hybrid app gives you the ability to deploy to app stores and have users install it.

    • Hardware interaction

    Does the app need to interact with any hardware? Camera, accelerometer, etc? If so then an installed hybrid app is only real choice.


    As for code reuse, I would suggest building your JS code into "modules" using RequireJS or Browserify. Then you can reuse the modules as needed.