I had web application written in AngularJS which works in all desktop and mobile browsers like Chrome, Safari etc.
Is there a way to convert it into mobile app?
You can use the framework Ionic coupled with cordova
http://ionicframework.com/
https://cordova.apache.org/
Hope it helps.
Cordova can do the job. As you have already an app, just need to build it using cordova. If you want to start a new project from scratch, Ionic will be a great option. As it is providing the layout and mobile friendly components for our use.
Please follow the steps in : https://cordova.apache.org/
You can use phone gap. In phone gap there is also plugins available for the mobile phone events like shaking and etc.
With the free version you can not add plugins, you have to buy phone gap for that.
Just create package with pure HTML, CSS and java script (angular js) and build it on the phone gap then you can download sdk and then you can install it on android.
Phone Gap
Related
I am looking for framework which will provide me website and app development with same codebase, rather than designing website and mobile app separately.
I came across phonegap and ionic frameworks, but they support multiple mobile platforms and not the website + multiple mobile platforms within a single codebase.
Is it really possible to achieve this? If so, then how?
Thanks in advance.
I use Materialize css library to create cordova app based on material design guidelines. Originally this project is created to make mobile first applications with a touch of Google material design so it will definitely suit both- web and android app.
Unlike ionic, it's just a simple css and js library which is well documented and easy to use and integrate in cordova app.
"Browser" is an ionic platform, like android and ios
You can do 'ionic cordova platform add browser' and 'ionic build browser'
But careful with some cordova plugins not being for browsers.
You can use NativeScript for building native apps with angular.
I do not know much about web tech and currently, I am planning my own project implementing web app + hybrid mobile app.
Based on my research, it seems many people use bootstrap, on the other hand for mobile, ionic seems one of the most popular ones.
web: bootstrap +
mobile: ionic
While planning it, I met an issue, i.e. how I can combine bootstrap source with ionic and its difficulty, and would it take many steps to modify code and apply for both sides.
So my question is
1. is it easy to combine bootstrap to ionic?
2. Is there widely used tool that is integrated for web and mobile application development?
Thanks in advance.
Bootstrap is meant to be a CSS library for creating responsive web, be it webapp or mobile. You can easily create a webapp using AngularJS as you mention, and let its responsiveness be driven by Bootstrap.
Ionic 1 is meant to be a mobile app development framework, not mobile web. It has got a lot more than just CSS styles; it creates hybrid native apps for Android, Apple and Windows platforms. Though it does just run fine on mobile screens as a webapp.
Ionic 2 has support for webapps so you can easily write your mobile app that can then be deployed either as a native app or on a web server.
Though on both versions of Ionic, you may choose to use Bootstrap for styling your elements but be aware that this won't replace Ionic's own scss. And it might create some unforeseen issues as you've pointed out.
Bootstrap is primarily for webapps running in browsers.
Ionic is targeted to run the applications in a webview using cordova. So, it contains many platform specific stylesheets, properties etc.
1. is it easy to combine bootstrap to ionic?
There is no point of combining both, as IONIC is providing everything you need from bootstrap. ( Element Stylesheets, Common Functions etc ).
2. Is there widely used tool that is integrated for web and mobile application development?
Angular JS is going to help here. You can reuse most of the angular code is both have the same functionality.
For IONIC 1 : You need Angular 1 and IONIC 2 is based on Angular 2.
I want to use Ionic Framework for my mobile website.
I wonder that is there any risk for run Ionic Framework on mobile browsers.
I'll only use framework's CSS and JS which includes modals, popups, menus etc.
I built a prototype and I tested it on all versions of iPhone and 2-3 versions of Samsung. I haven't seen any problem on these devices. But I want to learn all risks before I start to real project which includes static pages and quotation steps. I'll use UI router by using HTML5 pushstate.
To learn your opinions, makes me more confident.
Thanks in advance.
Kindest...
There are certain caveats to this:
1. Ionic doesn't have a web server, and its testing server uses UIWebview and will not allow for POST requests.
2. Ionic is more optimized for app that is resident on the device. There are certain capabilities (ngCordova plugins for camera...etc.) that won't be available on mobile web.
Your scenario ("framework's CSS and JS which includes modals, popups, menus etc.") - should be fine, since you're only using functionality within Webview. You'd have to build a custom JS library that would only include presentation layer features.
I am creating a mobile hybrid app with the Ionic framework, and I'm trying to integrate the Feather Editor. My best scenario would be that a Cordova plugin was available, since the Adobe Creative Web SDK is not optimized for mobile, but the Android and iOS SDKs are.
There are some legacy plugins, some of which are only for iOS, and the following one, which seems to be outdated, since the Feather Editor wouldn't launch:
https://github.com/m1is/AviaryCordovaPlugin
I also tried the following angular directive:
https://github.com/m00s/angular-aviary
This directive works for web, but on mobile it is not working properly, I guess because of the fact that the web SDK is not optimized for mobile. What happens is that the Feather Editor launches but it takes too much space, not fitting into the mobile screen. Plus, the tools are not showing, and a loading icon is shown forever.
So I guess that the right path would be to create a new Cordova plugin that works with the latest Cordova and Adobe Creative Android/iOS SDKs.
Has anyone tried a different approach?
The Creative SDK team recently collaborated with PhoneGap to release plugins that are compatible with PhoneGap, Cordova, and Ionic.
Among them are the new Image Editor UI PhoneGap plugin and template.
More details are on the Creative SDK blog.
You can get a quick overview of everything on offer on the Creative SDK GitHub page's Plugins section.
I developed this Cordova plugin:
https://github.com/jguix/Cordova-FeatherEditor
It currently supports Android.
The title pretty much says it all. I was asked this question today and really didn't know the answer.
Ionic is not intended to build desktop, or even desktop browser based applications.
From the official docs :
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.0.0
"uranium-unicorn", that means UIWebView for iOS 7+, and Android 4.1
and up. Windows Phone and FirefoxOS support is on our roadmap.
Even if you implement a browser website using ionic, the rendered output would rather weird.
Infact, Ionic has itself implemented it's website using bootstrap ;)