How to change web app into mobile app

I have a fully developed web app from meteor and I am trying to get it to run on an android device. I am working on windows and using a android device. Whenever I run the meteor run android-device call it just launches a white screen on the phone. I get this and others similar when I run it I20190708-10:19:15.780(-5)? W/MeteorWebApp(13593): I am not sure what call I am missing to get the web app to run on mobile. Any ideas?

More than likely you have an error which causes rendering to fail. There’s a very good chance the console will tell you the error if you inspect the webview with chrome devtools.

It will load in the web browser but not in the mobile app. It only fails when I try to run it on android. Any ideas?

Unless you have a really amazing reason to build it as a cordova app - dont. Make your app into a progressive web app and prompt the user to add it to their home screen. Meteor’s cordova support is patchy at best for all but the simplest of apps. Particularly when dealing with updates to cordova, and required updates to Android’s and IOS’s minimum versions. The meteor mobile documentation is also out of date, making it extremely difficult to implement.

1 Like

I need to make a mobile app from the website built in meteor. Do you have any suggestions on where to find not out of date information. Or do you have any information on how to do what you suggest?

I guess my question is why? Do you need to access the core functionality of the device which you can’t from a web API? A good place to start is looking at the PWA specification

Check the logs …you can use chrome or adb logs to debug - or if you want better visuals Android Studio. Even if the documentation is patchy it has good information about debugging – Document is meant to be pointer and can get out of date quickly. You can also do google. I personally do not use windows to build the mobile app for my meteor project. On Mac and Ubuntu, it works seamlessly once configured well.

The necessity is irrelevant. They would like to create a Cordova app and not a PWA. Suggesting that they use something completely different isn’t helpful and detracts from their original question.

1 Like

I disagree - if someone hasn’t considered the use of PWA, pointing them to that is useful. For example, building a cordova app is a means, not an end - there are often other ways to achieve that end. If someone asked how to do something with multiple independent mongo queries, and I pointed them to mongo aggregate - that would be entirely relevant, despite not being mentioned in the original question.

What detracts from the original question is starting a debate about the validity of a comment. Did you have any input on building for cordova? Because, while meteor is amazing at many things, I have not found building for cordova to be one of them - I’ve just spent 3 days trying to get a build out of our app, because Android and IOS recently updated their required minimum SDK versions to things which meteor does not support. This is what drove me to my suggestion of avoiding meteor + cordova and instead use pure cordova, or meteor + PWA.

My question of “why” directly related to the OPs question of:

I can’t answer that without knowing what the purpose is, offline support, push notifications, cleaner UI, native functionality will require different answers

I need a mobile app that someone could like download from the app store. I need it work offline and many show a bunch of different graphs on a phone screen nicely which the website on the phone is not doing right now.

If you need it to be downloadable from the app store, then you will need to build it as a cordova app unfortunately, but simply doing this will not enable full offline support - this is a fairly large challenge, I posted here (as did others) with a skeleton of my current solution, Solution for Offline data auto sync in Meteor app. Similarly, you can attain full offline support for MOST scenarios, without cordova, even on iOS now they’ve enabled limited use of service workers.

Regarding the graphs on a phone screen, this is also probably nothing to do with cordova, do you have something similar to this in your <head>?

<meta name="viewport" content="viewport-fit=cover, width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />

Yes something similar to that.

can you screenshot an example of what you mean:

I believe that I may have replied incorrectly. I don’t need an app with offline features I just need an app that makes the website look nice on a phone is easier to manage on a phone than through the web browser.

Ok, can you send a screenshot of the UI problem, building it for Cordova probably won’t fix that, you’ll still have to change your css/html