Building app, mobile web app and desktop web app using Ionic - ionic-framework

We will develop an app that we would like to distribute in through the following channels:
Android and iOS apps through Google Play and iTunes (the app will
use notifications extensively and presence in Google Play and App store is required)
Web app to run in web browsers on mobile devices
Web app to run in web browsers on laptop and desktop computers. We would like to support Chrome, Internet Explorer (starting from IE9),
Firefox and Safari browsers.
Our understanding is that Ionic is developed targeting primarily 1. and that the web apps in 2. and 3. above are not really what Ionic is intended for. We have looked around to try to understand if Ionic likely works for 2. and 3. and also made some quick tests ourselves.
From one of the links at the end: "Your webapp will run in desktop browsers yes, as it is made of html, css and javascript. The phonegap specific javascript calls (accelerometer, compass, file, etc) won't. Basically, if you stick to standard yes you will be able to port relatively easily your app to most browser, the job at this point being mostly a work of theming."
From another one: "I do know that FireFox is simply not supported. I don't know how well Ionic works in IE X."
To try it out we have built a limited version of our app in Ionic. From what we can see the app works for 1, 2 and 3. For example, it runs without issues on FireFox that is mentioned as not supported in the quote above. This means that to us it looks like the first quote saying that the web app will work in desktop browsers is correct.
I understand that this is a fairly generic question and might be hard to answer, but since we have found contradicting information when looking we are trying to understand more before making a decision.
Any feedback would be appreciated.
Thanks,
Markus
Is it a good idea to use ionic to build mobile web version of a website?
Can Ionic Framework run in desktop web browser like Chrome, Mozilla, IE9+?
http://forum.ionicframework.com/t/ionic-components-on-ie/1826
Phonegap web app in regular desktop browsers
http://ionicframework.com/docs/overview/#css-sass

Ionic is tested for mobile only. Internet Explorer for example is not tested and does not properly handle a number of features in Ionic. Desktop browsers act differently than mobile browsers.
Ionic is focused on building native/hybrid mobile apps rather than
mobile websites.
As such, our browser support tends to be whatever Web View API is
available to native apps on a given platform. For Ionic 1.1.0
"xenon-xerus", that means UIWebView for iOS 7+, and Android 4.1 and
up. Windows Phone and FirefoxOS support is on our roadmap.
If it's cheaper for you to test everything on all different desktop browsers than to develop a version for it sharing the same controllers and services --- go ahead but it won't come "out of the box".
Also, I recommend looking at Electron to build desktop apps from webapps.

ionic is targting mobile apps only , but you can develop your desktop app using node webkit and angular material for example and share some code between your apps

Related

Do we have to develop a special web UI after mobile app development completes?

We are excited to start developing mobile app using Flutter and backend applications that are running on Django with REST APIs. Our understanding is that once a mobile app is completely developed, we can simply launch the UI on a web browser as well with probably minor changes? Is this really true? if it is true, does our mobile app developer have to start coding the app to make it compatible for both mobile, web browser and desktop since from the beginning so that we donĀ“t have to spend extra cycles to make the UI compatible with web browser and desktop? Or is Flutter supposed to be compatible by default for any UI clients ( Web browser, smart devices and desktop)? I would appreciate it if someone can confirm and point me to a relevant article?
Best regards
There ara small adjustments you need to make. For example some plugins are not supported for web of vice versa. So you need to avoid from using them.
Also while building UI, if your developer does not make it responsive, you would have a ugly mobile UI. So my advice is both web and mobile should go on hand to hand to avoid and end product mistakes.
Note that there are even small differences between Android and IOS

How do you setup automated-tests for Capacitor native apps?

Capacitor allows us to code once then generate web, Android and iOS applications. Most people using Capacitor will generate native Android and iOS applications.
But strange enough, I can't find any documentation about how to create automated-tests for the two native applications. I can easily test the web application using protractor, jasmine or whatever. But when it comes to native apps, I can't hardly rely on native tooling (Android Studio and XCode) as there are other issues preventing me from testing it easily (ex: no possibility to set Accessibility ID through the views markup, etc).
Where are we at with Capacitor native apps automated-tests ?
I believe this is what you are looking for Ionic/capacitor Integrations for Testing
As far as the community/forums and official docs go there are only 3 ways you can test your apks
Native [Andriod Studio / Xcode] [Emulated versions]
Real Devices
3rd party Integration listed in the link above..
Even on google there very less info on this topic.. most of the blogs/ articles only say that Ionic/Capacitors can be tested just like a normal WEB App

Making Chrome web app standalone desktop program

Google announced that they drop support for web apps in Chrome.
Basically, web app is a local HTML/CSS/JS app that runs in a separated custom "standalone" Chrome window.
Is there any way (preferably easy), to convert this web app to a real desktop app that not depend on Chrome in anyway? Using maybe NodeJS? If yes what is the right way to do it?
Thanks.
You could try one of these tools:
https://applicationize.me/
https://www.bzgapps.com/coherence
https://fluidapp.com/ (for Mac only)
Don't know about "easy", but it seems to me that the natural evolution is to Electron or NW.js, and both of these are mentioned in the Google blog article on this subject. (I'm moving to Electron.) Both have advantages over Chrome Apps, mostly that they are true desktop applications. To cite one example, you can now manipulate the menu bar, something out-of-bounds for Chrome Apps.
Pure JavaScript code in your Chrome App, such as anything to access the internet, should move over directly. Same for much UI stuff, as you're still using a browser window for the UI. The app will, however, have to be restructured.
Added Note: Chrome Apps ran on 4 platforms: MacOS, Windows, Linux, ChromeOS. Electron and NW.js apps won't run on ChromeOS. So, the ability to write a four-platform completely binary-portable app is going away.

Is it compatible for browser

Sorry for this very basic question but it's important to know.
I never used this kind of framework before and i am interested by trying ionic !
We can build html5/AngularJS apps with this framework, but is it only to generate native code for mobile apps or can we also use our code for the web app (should we maintain 2 different code ?) ?
Check out the browser support section
Ionic is focused on building native/hybrid mobile apps rather than
mobile websites.
While you can get support from webkit, there isn't much support for other desktop browsers because, well it's just not what we want to focus on :)
It is browser competible, however not officially supported.

Native Mobile browser based apps

Wondering if someone could point me in the right direction, as I am unsure of the correct terminology. I am looking to create a mobile website, which loads in a browser based application (iPhone, Android).
I have seen this done before. For example, the bank of america application is actually installed via the App Store, however, it is simple a browser window that loads the Bank of America mobile site (which is built to look and function like an app).
I find this to more cost-effective, as developing a mobile app is less intense, as opposed to developing applications for 2-3 different mobile platforms.
Can someone provide insight into the terminology or methods used to accomplish this? Looking for articles, examples, etc.
Thanks in advanced!
I would suggest to use IBM Worklight.
Worklight is an Eclipse-based visual development and server platform for mobile apps. Using Worklight and popular open technologies, you can build, test, deploy, and manage your smartphone and tablet apps for iOS, Android, Blackberry, and Windows Phone devices, with maximum code reuse and per-device optimization.
Worklight supports open technologies such as HTML5, CSS3, JavaScript, Apache Cordova, and popular JavaScript frameworks such as jQuery, Dojo Mobile, and Sencha Touch.
Worklight offers extensive runtime libraries and client APIs that expose and interface with native device functionality.
Worklight includes a browser simulator so you can test and optimize the user experience of your mobile content on varying mobile devices.
Worklight consists of an IDE (Worklight Studio), a Java-based server, device runtime components, a web-based console for managing deployments, and an application center.
for more info see
http://www.ibm.com/developerworks/mobile/worklight/getting-started.html
Take a look at PhoneGap or Appcelerator, two of the bigger names in this "native wrapper" technology.