I understand that not all the code and functionality are available. However, I am currently in the planing of a new project and there are no document to be found on this aspect.
I want to know once I code in Titanium, is it possible to make a web version for mobile without the application with limited feature and the same code base? (something like touch.facebook.com vs Facebook app)
Thank you very much
Of course, Titanium could do that since it also supports MobileWeb. Titanium features:
Develop native applications for iOS, Android, BlackBerry, Windows, and
mobile web through a single code base.
With their Titanium Studio, you can easily build and package your app for MobileWeb.
But there are a lot of things to consider on developing titanium apps. Here are the few things I've learned along the way:
Don't use ImageView. Use View with backgroundImage. If it's an icon, you can make a font for your app. See how to create an icon font using IcoMoon.
Memory management
Never use borderRadius, borderWidth, borderColor in components within components, as for example a ScrollableView.
Minimize calling Ti.Platform.[property_name]. Example: instead of always calling Ti.Platform.osname to your controllers, you could have put it on you commonjs var osname = Ti.Platform.osname, then exports.getPlatformName = function() { return osname; };
Here are some few references:
http://developer.appcelerator.com/question/152656/tips-and-tricks-for-memory-management
http://developer.appcelerator.com/question/116867/this-is-a-solution-to-your-memory-woes#answer-203729
http://www.tidev.io/category/howtos/
Titanium SDK supports iOS, Android, BlackBerry, Tizen and HTML5 platforms. You can read more about that in their documentation. You can limit features in HTML5 app in a code with simple if() and reuse most of your codebase.
You can create a web version of the application if you include Mobile Web in the target platforms, when you create the project.
To deploy it on the browser, run the application as Mobile Web.
You may refer the following links for more details.
Getting Started with Mobile Web
Mobile Web Platform Overview
Mobile Web Limitations
Related
What features (HTML, JS, CSS, Web APIs), outside of plugins, are available in a cordova web view ? I am making a web app, and then I use cordova to create an apk file. The web app works fine with chrome and firefox for android. But when I try the generated apk on the same android device and the emulator the JavaScript is obviously not executed because buttons have no effect.
The initial HTML and CSS display fine, and I think I use some JavaScript or HTML5 features that are not available yet on cordova web view, but I don't know what I can use and what I cannot. I had a look at the emulator's error log but I get nothing meaning-full.
For example is it possible to use es2015 without transpiling, esModules etc, but I don't know where to look it up. What is the difference between a webview browser and chrome/firefox for android.
Targeting Android 4 and later.
https://cordova.apache.org/
It's probably easiest to look at the architecture diagram: https://cordova.apache.org/docs/en/latest/guide/overview/index.html.
Cordova apps consist of a small wrapper around a WebView (this is a "window" of the default browser installed by your mobile OS, although you can swap it out for another: https://cordova.apache.org/docs/en/latest/guide/hybrid/webviews/), with access to the mobile device's features via plugins. So... to answer your questions:
You can use any technology that's supported by the mobile browser you're working in. https://caniuse.com is super helpful in this regard.
You will also find that Android 4.x's stock web browser is not that great -- some of the shiny new popover UI stuff (walkthrough help and light boxes) will render, but the z-order is all messed up when you try to click to the next item. I've run into other issues as well, but I can't remember them off the top of my head.
The Crosswalk project allows you to embed a Chrome browser web view in older Android versions (back to 4.x I think). Support for this project has been discontinued in the latest Cordova releases, as it's no longer necessary.
I'm trying to find out how does Apache Cordova & Ionic Framework work?
I searched all over the internet and all I get is,
it is a wrapper around html/css/js and it uses the native web view to interact with native feature. But, you still deploy the native-ly. (That means .apk for Android, e.g.)
But, what I'm interested in is
Is Apache Cordova and Ionic Framework entirely written in javascript?
How do they interact with native mobile platform?
Does cordova/ionic get bundled with .apk file to mediate between the native web view and source code?
I believe what I'm interested in bit of low level detail.
If anybody could shed some light or point me to the resource (which I couldn't find) , it'd be great.
Thanks.
Apache Cordova provides a basic native app responsible for:
Displaying a Webview (UIWebkit by default for iOS, but you can switch to WKWebkit using a plugin. For Android, the "android browser" webview is used up to Android 4.4. From Android 5 (API 21), the webview is basically Chrome for Android).
Allowing the JavaScript running into this webview to "call" (execute) native code thanks to Cordova plugins. This is possible because system Webviews can interact with native code.
Ionic Framework (v1) is made of HTML, JavaScript and CSS (v2 is developed in TypeScript, which is a typed superset of JavaScript). The version 1 relies on AngularJS as a frontend JavaScript framework and helps developers writing "native-like" webapps by providing features like Gestures management, Infinite scrolling, Layouts (Menu, Tabs, Lists...), etc. The version 2 relies on Angular 2 and provides additional components (Date picker, Split panel...) and features (Ionic Native, a JavaScript API which tends to "standardize" the way you use Cordova plugins).
Ionic can be used without Cordova, if you simply want to create a web app (this is still HTML, JavaScript, and CSS). Cordova allows you to put this web app into a native shell. When an hybrid app (Cordova, the plugins you installed, and your web app) is bundled into an .ipa or an .apk, the html/javascript/css codes are moved into a specific folder, where Cordova expects to find an index.html (by default) to load in the Webview.
PS: My english is not perfect but I'd be glad to give more details if a point is not clear.
EDIT:
Please can you answer my specific questions in my post?
Sure!
Apache Cordova is made of JavaScript and Native code. See projects like cordova-android (JavaScript + Java), cordova-ios (JavaScript + Objective-C). Each mobile operating system has a dedicated "platform". When you start a new Cordova project, most of the time, the first operation you do is cordova platform add <platform> (iOS, Android...). These are the codes being loaded. Ionic Framework is a "pure-web" framework, made of HTML, JavaScript and CSS.
Apache Cordova interacts with native mobile platform as any native app: using the system APIs. The webview can interact with both your web app (of course) and the native code, thanks to platform-specific "bridges" (the native code embedded in cordova-android, cordova-ios, cordova-windows, allows that). You have to write a plugin in order to call native code from your JavaScript. For Android, it consists in extending the CordovaPlugin class and overriding the method execute (for instance: cordova-plugin-splashscreen).
The .apk (android) or .ipa (iOS) generated by cordova build (if you're using the cordova-cli) gathers together both the native shell (cordova-android for Android, cordova-ios for iOS) and your webapp. At startup, the main activity/view of Cordova is instantiated, loads the webview, which itself loads your webapp.
Is there a reason why an HTML5 app that works fine in browser would work differently when compiled with Cordova for Android?
Does cordova not support all the same things as the browser?
Im mainly thinking of / referring to the way JavaScript works.
Cordova itself does not handle the presentation layer of an application. Cordova creates a basic, single view, native application wherein the single view is a webview. A webview is native to the platofrm/SDK that the application is implemented in.
Because webviews are packaged with the SDK, they are not updatable like the browser that is on the device. This means that code you create may run just fine in a browser on the device but may not run in the native webview. Additionally, your code may work on a newer version of the platform/SDK and not on older versions.
If you are experiencing an issue with a particular item being used in a webview, it is best to look up the capabilities of that particular webview from the platform/SDK version you are seeing issues with.
An example would be using the latest version of Cordova to build an Android application making use of canvas elements. If you deploy the application to a device running Android 5.0 you will have no issue, but if you deploy the same application on a device running Android 2.3.4 your application will appear to not function. This is not because of Cordova, it is because of the capabilities of the webviews in the various platform/SDK versions.
One way to try and safeguard against these types of issues is to make use of a framework. The reason being that most frontend frameworks have builtin fallbacks for compatibilities with various versions of webviews/browsers/etc.
Because Cordova uses the native browser view. Some JS implementation can differ from Chrome, Firefox, and so on.
That's mainly for security reason, or for webview itself (depending of the platform) you may have some limitations or differences.
I am interested in web standards (js/HTML/CSS). I would like to create applications from them, for phones and tablets. And sell these applications on mobile stores and web stores (for appstores and google play).
Is it possible ? What would be the best way to do it ?
Yes, there is a PhoneGap platform that can be used for building mobile apps for iOS, Android, Symbian, Windows Phone.Apps developed with it are accepted in all the stores. It is quite popular, robust and has nice features.
As mentioned in one of the other answers, yes PhoneGap will do the trick if you decide to write your app in HTML/CSS/JavaScript. Now, if you want to have a pleasant user experience on both smartphone and tablet operating systems, I would also recommend looking into Twitter Bootstrap.
This CSS framework has built-in responsive web-design styles that will allow you to scale things down in a user-friendly manner from tablet to smartphone, as well as show/hide different parts of your HTML depending on whether your users are viewing the page on a tablet or smart phone.
Specifically, you can do things like the following:
<div class="visible-tablet">
This will only be visible on tablets.
</div>
<div class="visible-phone">
This will only be visible on smart-phones.
</div>
For a full listing of the responsive design support in Twitter Bootstrap, check out their section on responsive design.
You may also want to check out the Google Chrome Web Developer plugin to assist you in creating a responsive web experience. This plugin lets you (among other things) view how your page will look on multiple device resolutions and is an invaluable tool for debugging resolution-specific issues.
You can look at Zurb Foundation, which is a very active open source project for building responsive web apps for mobile devices. Some overall description of the features here.
You can create Windows 8 Apps using Javascript and HTML 5 (apart from using Native languages). Windows 8 runs on Surface tablets and PC's.
Create your first Windows Store app using JavaScript (Windows)
There is a free ebook as well: free-ebook-programming-windows-8-apps-with-html-css-and-javascript
There are lots of options around - PhoneGap seems to be the most popular and, since it's now part of Adobe, it will probably continue to be popular.
However, there is a more important issue to be considered here: iOS users expect an iOS app experience, Android users an Android one... You get the idea. Make sure it's the best choice for your customers.
See this story about HTML5 at Facebook.
Also, and I know I might open a can of worms here, the performance will always be inferior to that of a native application.
You can also try MoSync:
"Build native mobile apps for all the major platforms using our leading open-source, cross-platform development environment. Now with support for In-App Purchases, NativeUI and Windows Phone 7." ]
There's Titanium from Appcelerator where according to their site you can build native apps using Javascript.
Just a late update: Facebook has open-sourced react-native since use asked your question and unlike PhoneGap (now called cordova) React-Native does not build hybrid app but builds true Native mobile application with the same power you would get when using Java for android or ObjectiveC for IOS. You can find out more here
No point in doing Microsoft/Windows Mobile anymore since it's now dead, but the easiest way to create Android apps based on HTML is to use DroidScript which can be found on Google Play (it did not exists at the time of this question).
You can also build native (non-html) apps with pure JavaScript using the same tool and it's far easier to use for novices than PhoneGap/Cordova.
At first glimpse Cordova and PhoneGap exist primarily for the use to develop apps to be used on a mobile device. Well, I am not interessted in the developement of native mobile apps.
There exists a webapplication (a cms) of our own and the question is now if a mobile toolkit like Cordova or PhoneGap is able to be of any help to develop parts of our cms functionalities with it in order to be able to support more plattforms.
Does it make sense to use Cordova or PhoneGap for the developement of a pure browser-based web application?
Phonegap (or Cordova as its now called) works by wrapping your webpages in a Webview and giving you access (in JavaScript) to some of the native device functions, such as the Camera, Accelerometer, Contacts etc.
As for whether it will help you depends on if want to make use of any of the native device functions, for example if you think incorporating the Camera (current HTML support for camera is quite spotty) into your web app is of use then you probably should consider it.
Another consideration is how your users will access the applications, with Phonegap it gets packages into a native app and they can just launch it from their home-screen (or however they launch apps on their mobile device), while with a Web App it depends on the device, on iOS you can pin it to your home screen and add some meta tags to make it appear more native like (for example hide the address bar) while on Android as far as I know you can't do that.
Finally consider that with Phonegap it might be more of a pain to debug your application since your HTML/Js is wrapped in a Webview, but as far as I've seen there is no easy way to debug it there.
One other thing I seem to recall reading somewhere that on iOS Apple doesn't give your native applications' Webviews access to the same amount of memory as if it were in safari so the exact sane web application when packaged into a Phonegap application might actually be slower.
To sum up, the benefits of wrapping your application in a Phonegap wrapper are access to native device functions and how your users access your app, if those aren't important (or the cons outweigh the benefits) than it probably isn't worth your while to go that route.
Cordova/Phonegap extend javascript with functionality provided by mobile operating systems. Therefore apps developed with these frameworks must be compiled to the target platform and only embed the HTML etc. in an embedded browser. The extensions need java, objective-c etc. code to run so I don't think that you are able to benefit from this code.
You are forced to write your own mobile device compliant HTML code when using Cordova/Phonegap. There are no neat mobile device ready user interface controls provided by the framework but only access to device specific hardware or software apis like notification etc. is given.
Cordova is just the latest name of PhoneGap. I would not go for that if you just want to build a mobile website. First of all publishing such an app on several online stores (iTunes, Play) is a pain.