Ionic is a great framework to develop mobile apps using html5. We want same application to be used over desktop browser also. Will it be good idea to make a single responsive UI that works best on both desktop browser and mobile browser and make app. OR we should make different development for browser and mobile app.
-
2I think that having to manage only one client side app that simply adapts to screen width is the future and allows for faster and cheaper product evolution – coiso Dec 01 '14 at 09:21
6 Answers
To expand a little bit on what has already been said, Ionic is is built and tested for mobile only. Internet Explorer for example is not tested and does not properly handle a number of the features in Ionic. Desktop browsers do have different features from their mobile browser counterparts. You would seriously limit the browsers that can use your application on a desktop.
Most likely, you should provide two different applications for desktop and mobile. Unless you have the guts or ability to tell your users that they must use Chrome (or Opera) to run your website, you'll want two separate applications. You could still use Ionic for a mobile website though, but without being able to use Cordova's full platform integration (you would be limited to the native HTML APIs provided by the browser). You could certainly retain much of your business logic in a common core that is shared between both applications. That would require creating a shared angular module(s). I have done this in a project with an Ionic app and a normal Angular desktop app (with Bootstrap).
There are a number of ways to detect if a visitor is coming from a desktop or mobile device. I don't know of a method that is 100% perfect, because they usually rely on the browser's user agent string (and can be spoofed, changed, etc). See http://detectmobilebrowsers.com/ for some common scripts or examples how to implement mobile detection on a server or in a programming language.

- 6,965
- 22
- 21
-
1Excellent answer. I agree that Business logic can be kept separate and exposed as REST APIS e.g use a Express.js framework based server with MySQL/MongoDB/Redis data store. – SheshPai Apr 24 '15 at 21:33
-
Are you speaking about Ionic 1 Or about Ionic 2? Also, is the problem is only with explorer? – user5260143 Mar 02 '17 at 12:12
This question was asked at ng-europe earlier this week. The answer from the ionic guys was to share your services and controllers, but use different views for desktop. Ionic is purely focused on mobile.

- 1,377
- 12
- 12
-
so we can make /largeview and /shortview. how will redirection will be made as per device width ?? – Rohit Bansal Oct 25 '14 at 08:18
-
http://stackoverflow.com/questions/16297238/angularjs-different-views-based-on-desktop-or-mobile – Rohit Bansal Oct 25 '14 at 08:32
Interestingly, it seems to be possible to produce a desktop version of an Ionic app using a toolkit named 'Electron' which is sort of a desktop equivalent of Cordova/Phonegap, as explained in this article:
http://alexbergin.com/2015/streamlining-desktop-and-mobile-app-development
Electron (formerly named Atom Shell) packages an embedded Chromium webview to produce a 'real' app. This also means that cross-browser issues are not a concern.
The author of the above article used this successfully with an Ionic app.
If you would go down this road then you would probably need to use some responsive techiques to optimize the UX on desktop.
I haven't tried this so I don't know the pros and cons of this approach but I can imagine there are cases when you just want to quickly throw together a desktop version of an app that you already have.

- 1,175
- 12
- 13
My comment became too large. This is to elaborate and add to Jeremy Wilken's excellent answer.
It is not only limiting the browsers on a desktop, but showing the mobile-screen on part of the screen real estate looks downright ridiculous (time to rethink what mobile first means :)). The need for proper API cannot be stressed more because the flow (navigation) will most probably vary across more screens in a mobile format than in the PC format though functionality may be the same.
I agree with Jeremy's observation that Business logic should be kept separate and exposed as fine grained REST APIS e.g use a Express.js framework based server with MySQL/MongoDB/Redis or any other commercial data store. So, the REST API can be used across Mobile/Phablet/Mini Tablet UI (with Ionic) and Desktop/Laptop UIs (with Bootstrap + AngularJS.). Of course I am a fan of JS, OP can use any language of choice for the server.

- 319
- 4
- 7
-
"showing the mobile-screen on part of the screen real estate" - Are you suggesting that someone would deploy an Ionic app as a website by actually using an image of a phone with the app embedded where the screen would be? If not, can you clarify what you meant? – rinogo May 26 '16 at 21:51
I would recommend using ionic for mobile and especially if you are using ionic2 use same code for the desktop in angular2 with just minor alterations

- 6,277
- 23
- 87
- 197
-
1Yes ive developed a web application using angular2, just a minor alterations on ionic components but ionic2 brains are in angular2 code: – Geoff Mar 01 '17 at 23:20
-
1Example Services/providers code is similar to angular2 syntax,the only difference is only in the html part in which ionic2 has predefined component codes eg
.... otherwise everthing else is similar in terms of structure and code – Geoff Mar 01 '17 at 23:22 -
The framework is for mobile hybrid app only although it would work as a normal HTML app.

- 1,423
- 1
- 16
- 29