I have some questions.
Question 1) I know that Cordova is written in plain js. Ionic team stood up and decided to wrap the Cordova plugin and usage of that by writing typescript code and also in Angular. so ionic sits on top of Cordova. both are frameworks, but Cordova is much deeper. Am I right?
Question 2) which one really can convert my code to mobile code? I know mobiles can't understand js/html/css without browsers. So something converts my Ionic code to something. a) what does my code get converted into? b) what really converts my code?
I'm starting ionic development and really wanted to know this first.
Ionic its just a mobile development framework so that you can use design components as well as other plugins for developing an application.
When we refer term Cordova its a main core It allows you to use standard web technologies - HTML5, CSS3, and JavaScript for cross-platform development. Applications execute within wrappers targeted to each platform, and rely on standards-compliant API bindings to access each device's capabilities such as sensors, data, network status, etc.
Architecture
There are several components to a cordova application. The following diagram shows a high-level view of the cordova application architecture
Web view
The Cordova-enabled WebView may provide the application with its entire user interface. On some platforms, it can also be a component within a larger, hybrid application that mixes the WebView with native application component
Web App
This is the part where your application code resides. The application itself is implemented as a web page, by default a local file named index.html, that references CSS, JavaScript, images, media files, or other resources are necessary for it to run. The app executes in a WebView within the native application wrapper, which you distribute to app stores.
For more understanding please visit this article
https://cordova.apache.org/docs/en/latest/guide/overview/
Related
I am beginning my adventure in the world of mobile hybrid applications and trying to understand the basics.
I am a little bit confused about the relationships among the various frameworks that are used in this world. In particular, as far as I understand:
Cordova is the underlying framework that converts an application written with HTML5, CSS3, etc. in a formally native app for Android, iOS and Windows Mobile.
PhoneGap is the framework that allows to write hybrid applications and uses Cordova underneath to generate app packages to be published to the stores
Onsen UI, Ionic and Vue are examples of frameworks for the frontend only (widgets, etc.), also jQuery UI can be used for the same purpose
Angular JS can be used for the communication between the frontend and the "server"
So far so good. The problem comes when I see that Ionic can also be used stand-alone (i.e., without PhoneGap) as a all-featured framework (frontend, "server"), using Cordova as the tool for generating "native" apps. Or, as another problem, when I see that Onsen UI can use Vue widgets and that, in its turn, can be used stand-alone.
Can you help me understanding the relations among mobile hybrid apps world?
Thanks.
PhoneGap is a distribution of Cordova with some added stuff. They both allow you to write HTML/CSS/JS in a mobile app.
There are platform independent javascript frameworks like Angular, React and Vue. They are basically the way of writing javascript that doesn't suck.
Ionic is built on Cordova, so it's like Cordova with a lot added stuff. One of that added stuff is the framework like Angular.
I have tried some App Builder to build the mobile application such as Seattle Cloud, now I want try to build an android application without using the App Builder, but I figured out the page's extension is .HTML in the App Builder, but when I using Android Studio to build the app, the layout is using XML. I have experience to develop web application using PHP and now I want try to build an Android Application to view information from my web application, I feel confused, How should I start?
You can use Phonegap for hybrid app development using web technologies such as CSS, HTML, JavaScript and jQuery.
Other similar options available are Titanium SDK and Sencha Touch, but you will take time to get well with them. They are better than Phonegap in some areas, also device api support is available.
Whatever framework you use to build hybrid apps, you will have their respective js files and css to achieve functions. Some combine with PhoneGap in the end to use device api's, so it is better to go with PhoneGap or something like Titanium or Sencha. You may also have a look at Ionic framework, it uses AngularJS, HTML and CSS.
Use WebView. It's a view that displays web pages. You can use local html files as well as a URL. For more information:
http://developer.android.com/guide/webapps/webview.html
Android works in a very different compared to web apps. the design of the application is done in XML which will create native UI components and will be much faster the HTML counterparts.
There are different frameworks for developing an android app based on HTML/JavaScript
Sencha touch
Phonegap
Appcelerator Titanium (Although this may not be a pure HTML framework)
see: How to create an android app using HTML 5
But compared to apps based on HTML frameworks, native apps will be faster, consumes lower memory.
Visit http://developer.android.com/training/index.html to get started.
Can Nativescript build apps for web as well?
As Ionicframework and similar uses Cordova to build Android and iOS the same code there can be served by an HTTP server to the mobile or desktop browsers.
Will that be possible with the apps built with Nativescript, using same code base for web version of the app?
Nowadays Angular integration is on the way, and using Angular for the mvc kind of things (like data bindings, events etc.) and using Native for the device apis, platform apis and native gui would help in an unequaled way.
Angular parts can be used in the browser as well when built for it. What to do with the xml written for the gui templates in Nativescript, they could be converted to proper html for web built of the app, as Nativescript itself already uses a unified gui api for different platforms, that could be possible. And lastly, native calls made in NativeScript would be ignored in the web build.
It would be great to build for Android, iOS, and Web with the same exact code base.
tl;dr: No
Longer: The big difference between the Cordova/Phonegap based technologies (such as Ionic and Supersonic) and the Dynamic Runtime based technologies (such as NativeScript, React Native and Titanium) is that the first uses a HTML approach where the application is run by WebKit/Blink in a WebView. Looking on the Dynamic Runtime technologies there's no HTML Engine running your app, but rather native views and widgets. The framework (in this case NativeScript) is "just" a bridge between Javascript and the native language of the device.
However, depending of how you architecture your code, you can create Javascript which will be usable in both a NativeScript environment as well as in a browser environment.
Edit: The above means that you could reuse some of your code. There'll still be NativeScript specific code.
Edit2: There's an ongoing project to enable usage of Angular 2 in NativeScript. Please see current status in the issue: https://github.com/NativeScript/NativeScript/issues/103 Also note that the Telerik NativeScript core developer Valentin Stoychev is saying
The idea [is] to enable as much code reuse as possible between your web and mobile apps.
So: Yes on code reuse - no on exact same codebase.
Adding to the (correct) response of Emil - I do not think it is possible to have any significant portion of the app shared (even for the logic part) since {N} apps mostly utilize the Nativscript observable implementation which would probably 'leak' into your models / view models.
Having said that, I suggest you to monitor the work happening on integrating Angular2, which would probably mean a larger code sharing potential (with Angular2 web apps)
I am going to create a mobile web application that will run on all web enabled mobile browsers. It will involve searching and booking of hotels and flights. We already have a desktop applocation developed in JavaEE, MySQL for the same.
What do you suggest I should use - PhoneGap or Titanium for this task?
What are the advantages and disadvantages to use each?
And what technologies should I know or learn to use each of these?
Phonegap
What is PhoneGap Trying To Accomplish?
The purpose of PhoneGap is to allow HTML-based web applications to be deployed and installed as native applications. PhoneGap web applications are wrapped in a native application shell, and can be installed via the native app stores for multiple platforms. Additionally, PhoneGap strives to provide a common native API set which is typically unavailable to web applications, such as basic camera access, device contacts, and sensors not already exposed in the browser.
To run a PhoneGap application on a native emulator/simulator, developers will generate a project for each of the native platforms they wish to support, configure that project’s “web root” directory in Xcode, Eclipse, or whatever native toolchain is needed, and then run the project using that tool.
Strengths of the PhoneGap Approach
Any native platform that supports a web view or web runtime can be a PhoneGap platform.
Anyone who can write HTML, CSS, and even a small bit of JavaScript can wrap up a web page in a native app and distribute it as such. The barrier to entry in using PhoneGap to package web pages as native apps is extremely low.
Weaknesses of the PhoneGap Approach
The quality of the user interface in a PhoneGap application will vary based on the quality of the web view and rendering engine on the platform. The Webkit-based rendering engine on iOS is strong, and provides the best performance. The Android web view is functional, but has some notable limitations.
PhoneGap also cannot be extended with native user interface. The end developer’s application its self lives inside a web view, and user interface is rendered in HTML.
Titanium
What is Titanium Trying to Accomplish?
The goal of Titanium Mobile is to provide a high level, cross-platform JavaScript runtime and API for mobile development (today we support iOS, Android, and the browser, with BlackBerry 10 and Windows Phone coming soon and eventually, respectively). Titanium actually has more in common with MacRuby/Hot Cocoa, PHP, or node.js than it does with PhoneGap, Adobe AIR, Corona, or Rhomobile. Titanium is built on two assertions about mobile development:
There is a core of mobile development APIs which can be normalized
across platforms. These areas should be targeted for code reuse.
There are platform-specific APIs, UI conventions, and features which
developers should incorporate when developing for that platform.
Platform-specific code should exist for these use cases to provide
the best possible experience.
Strengths of the Titanium Approach
Get access to a wide array of native features and functionality out of the box, from user interface components to socket interfaces to notification system integration.
Weaknesses of the Titanium Approach
Titanium platform is only available on what have been deemed the most critical mobile platforms at present: iOS, Android, and the web.
Some user interface components do not yet perform as well as their native counterparts under some circumstances, such as very large table views with highly customized layouts.
Source Link : Comparing Titanium and PhoneGap
Hope this helps.
Both Phonegap and Titanium are free for developing mobile application and to develop apps using Titanium, you should need basic knowledge in javascript since it is simple javascript combined with Titanium API while we can use most of web technologies like HTML, Javascript, CSS etc. It's purely depend on what type of application you want to create. More simply if you want to create simple app that does not contain graphs and drawings you can simply use Titanium but if your app contains graphs you should use Phonegap.
I am aware of Appcelerator and Phonegap's differences with regards to their approach in creating cross device/platform applications for Android and iOS. I believe one of Appcelerators advantage is that it has access over the device's API, correct me if I am wrong but isn't Phonegap also capable of accessing the device's API? My question is if both of them has access to the device's API, then what advantage does Appcelerator have over Phonegap in terms of API coverage? Which native APIs from Apple and Android devices can Appcelerator access which Phonegap cannot?
With the typical PhoneGap application, you're trying to mimic the native GUI elements in JavaScript, most likely with something like the Sencha Touch framework. However, with Titanium (Appcelerator is the company, Titanium is the product), you're using Native GUI elements.
To answer your question, when you're developing a simple application in PhoneGap, you're not using the native Table View, Tab View, Image View, etc. Instead, you're using JavaScript that tries to mimic those controls. So, in even the simplest of cases, you're not using native APIs with PhoneGap.
Considering you're able to write your own native code for either Android or iOS using PhoneGap, I don't think there are actual limitations in terms of API coverage beyond what comes with it out of the box. I just finished writing a plugin for PhoneGap that allows me to access the orientation gyros (ie yaw, pitch, roll) on Android because it didn't have one. Since PhoneGap fires up your class on initialization, you're able to inject whatever code you need before/after executing the super.loadUri statement.
PhoneGap is simply a wrapper that makes it easier to separate your presentation layer from the native device code by automatically loading up an html file in a chromeless browser and then listening for specific requests made from the browser back to the native code (ie, the plugins PhoneGap ships with). You're free to add additional native code around the PhoneGap wrapper.