Can we make a web application using ionic framework? - html

i have got the project but someone told me to use ionic framework so
can we make web application using ionic framework?
and official website is telling that it is using for creating mobile application
so i am little confused

Well, yes you can create a fully-fledged application using Ionic; it's just that it's better suited for mobile applications. It's built on top of Cordova, so it's a little better with mobile applications.
I have tried it personally in the past, and it's amazing. The tools the Ionic Community provides makes building applications a lot more fun. Yes, you'll have to override a couple of classes to get the look you desire, but otherwise, it's possible.
But remember, just because soccer has a goalie, it doesn't mean you can't score.

The framework is made for developing Hybrid apps with the use of native functionality with ngCordova. That being said, if you like the framework you can just run it from your desired hosting platform since it is basicly just javascript, and angular, with the bootstrap like Ionic tags for styling.
You cant use the ngCordova functionality from a browser though.
The real questing is, what do you need to build. You might just be better of making a MEAN stack web application,if you dont have any use for the Ionic functionality, and just choose your own styling template, like mentioned, Bootstrap.

Related

ionic: using the framework with only HTML5

I'm thinking of using ionic for my project but in the beginning I'd like to only have a webapp without going to an app. Like what framework7 allows. But the information I gathered seems to indicate that this is not possible or fully supported by ionic.
Could someone share some experience to say if it's possible and how hard it is?
For ionic2 it is possible:
add codova platform browser
upload files under platforms/browser/www
point it in browser
done
Note: Plugins that depends on device will not work in browser (for instance camera etc..), the rest will work fine, so keep your app usable even without device plugins
It is possible to port your Ionic app as a mobile website.
Its basically an angular app with added benefits of Ionic ecosystem. This ecosystem includes nifty set of directives of mobile first ui components, js library for interactions (pull to refresh / slide etc) and other such things that compliments your app to make it look and feel like using a native app.
It really shines at accessing native components of your device (camera, location, battery info etc) using js apis (cordova.js). But it isn't of any use when you are building a mobile website with ionic. So, you could write platform specific code to support both web and native in conjunction. You could make the most of cordova.js when you start building your native apps. Else, leave it plain vanilla for your mobile site.
I have ported my ionic app as a web app to serve my audience on mobile browsers (also plan to roll out native apps soon) and I have not faced any major challenges so far. It truly has mobile first experience.
If making a single page desktop website is your sole objective, you should probably go for standard angular bootstrap web apps. Ionic isn't meant for it.

Building a mobile app with Html5

We have to build an app which should run on iOS and android. For expenses reason we decided to to it with html5 and phonegap.
Now we have to decide which mobile framework we wann use for it. I know there are already a lot of this issues and I also already did a lot of research. But I'm still not sure which one we should pick.
I've heard a lot down side points from Jquery mobile, but on the other hands it seems there is nothing really better, beside senche touch, out there.
What are your experience, what whould you suggest?
I'm looking forward hearing your opinion
(let me now if you need further information for evaluating)
Thanks
Building PhoneGap with Bootstrap and AngularJS is a breeze.
AngularJS provide a really nice separation between Route, Model, View, and Controller. Learn Angular directives and stop writing spaghetti js dom interaction code.
Bootstrap, though not as nice as jQM for mobile features (maybe until v3), still provide a nice starter CSS such as (navbar, fixed top, bottom, etc...) And if you know your css, then I think Bootstrap is more flexible than jQM. Combine with some nodejs build script to compile your less file to css and you are all set. Glyphicons is also a good starter set of asset/images.
I am sure you would have done a lot of research on this but from my experience I would suggest you to take a look at Sencha Touch + Phonegap combination.
The reason why I opted for Sencha Touch over Jquery Mobile is that the JM is quite sluggish when it comes to page transition and animation. Whereas, Sencha Touch provides you all-in-one place regarding building a rich mobile app with HTML5, CSS and Javascript. The only thing about ST is that you might require to learn some Ext JS which is used by Sencha Touch to create components. They do have a lot of documentations which you can refer to.
You can refer these links to kickstart on Sencha:
https://github.com/senchalearn
http://www.sencha.com/learn/touch/
All the best! :)
We have just started working with PhoneGap in my studio and we are using Backbone.js + Handlebars.js and Bootstrap or Ratchet depending on the case. It seems to work very well.
If you want some more resources on that I will suggest you start with
http://coenraets.org/blog/2013/05/top-10-performance-techniques-for-phonegap-applications/
http://coenraets.org/blog/2013/05/architecting-a-phonegap-application-video-slides/
http://coenraets.org/blog/2013/06/sample-mobile-phonegap-application-with-backbone-js-and-ratchet/
Really good resources.

HTML5 code reuse Phonegap

Hello Fellow developers,
I am embarking on a new journey to develop HTML5/JS web site and looking a ways to reuse the same code for Mobile App (Would like to use it using PhoneGap or Appcelerator). The requirement is to develop once which can be used on desktop, and smartphones, but project sponser wants more secure way to handle data on smartdevices and hence we would like to choose this approach. Now my questions is
Can we reuse and architect the solution this way to reuse HTML5/jQuery code on Mobile within Appcelerator or Phonegap?
If yes, what percentage of rework will be required to support on mobile devices?
If no, what could be alternatives?
thanks all for your guidance.
(1).
If your current desktop website interact with server-side in webservice way,everything will be done very easy. Even you can directly modify the *.java in src\com\ like this:
super.loadUrl("http://balabalabala.com");
With phonegap wrap, your app can be access right now.
If not, you will need spend time in implementing the server-side interfaces for client-side.
(2).
You need to refactor your static html page with some javascript framework for mobile(such as jquery mobile,sencha touch).
Using them to make your phonegap app more simalar with native app.
That takes time too.
The 2 things above are what you need rework.
I hope you are planning to build a mobile website. If so, its very easy to convert it to a PhoneGap app with may be only 5% changes provided your website uses only HTML5,JS and CSS. Its not possible to run a a website written in serverside languages such as PHP, ASP.NET, ruby etc. Some important items to keep in mind:
start development of website and app together. test with mobile browser and phonegap so that you can fix issues as and when they arise.
use a mobile HTML5 based framework like Kendo UI Mobile/ jQuery Mobile etc for developement
so that you dont spend time fixing all the mobile related UI stuff.
Wherever you are using PhoneGap features, check whether you are running on PhoneGap or else fall back to the browser feature.

Where to start learning how to make mobile web applications

Where do I start to learn how to make mobile web apps? I am interested in the design and effects/animations used to make them look somehow native. There must be some difference in the css, html maybe javascript from regular web appplications with regard to screen sizes etc.
I am a Java developer so usually I use templates, but I am fairly experienced with css, html...but I don't feel very updated on mobile web apps.
If you want to develop cross platform mobile application using HTML,Javascript then you can try Phonegap. With Phonegap you can create single application which will run on Android,iOS,Blackberry,Bada,Windows,Symbian etc.
To learn android :
http://www.vogella.de/articles/Android/article.html
http://developer.android.com/resources/tutorials/hello-world.html
Phonegap can be a good choice as you are familiar with HTML,Javascript.
I think the easiest way to give a mobile web-app a very close approximation to native behavior and look is to use jQuery Mobile and even the associated ThemeRoller. It's all very well documented, and the site also had great resources for learning.
jQuery Mobile is obviously based on jQuery, but is tailored to be consistent yet configurable across mobile platforms.
I highly recommend using some kind of framework.
There are several.
Sencha Touch: Very comprehensive. You don't have to worry about writing any HTML or CSS, since the framework generates it. Sencha Touch provides a Java-like pseudo-class structure, and good documentation.
JQTouch: Rather basic.
JQuery mobile: Somewhat in the middle.
The-M-Project: Lesser known, but looks promising. Haven't tried it myself.
All of these offer widgets that come with the required CSS/JS for animation and native looks, so no need to worry about that.

Mobile HTML5 Frameworks

I need to know the best suited mobile frameworks which greatly exploits the functionalities of HTML5. Some of the choices I have are:
PhoneGap
JQuery Mobile
Sencha Touch
Can you friends just guide me based on the experience you have with mobile apps development
Thanks
Some specific facts that might help you would be to compare the documentation for each of the frameworks. I've found that how a mobile framework is documented is the number 1 thing that is important to me when i get deep into it. So here are the links to each of the documentations.
PhoneGap
JQuery
Sencha Touch
Consequently, you may want to familiarize exactly WHAT constitutes a "mobile" framework. For example, i use both phonegap AND sencha touch. So take some time to read up on exactly what's what. Sometimes you can use multiple frameworks together.
Not exactly a framework, you may want to try Tiggr Mobile Apps Builder - http://gotiggr.com. It's a cloud service for building HTML5 and native apps. The builder uses jQuery Mobile, and PhoneGap (for native).
Note: I work for Exadel, the company behind Tiggr.