I've gone through many references regarding Angularjs With ionic. Find out that Ionic gives a nice framework to develop mobile app.
However I am having a confusion. Now I am developing a responsive web application mainly using with bootstrap(foundation also nice one for responsive app).
In many references, they have mentioned like Ionic used to develop mobile app like native mobile app.
Is there any possibility to design the same app for desktop view? (Seriously I don't find any references for this).
If so, can you please provide some references?
If not, how can I develop the same app for desktop view?
Related
I have a website that is created in Angular 4 (with Lumen as the Rest API) that has a responsive design.
The website works on desktop & mobile browser fine but now I want to create the mobile applications.
What is the easiest way to wrap ionic around my existing Angular website to create the mobile applications? The mobile applications will need camera, location, bar-scanning, etc. So I cant just webkit or webview the mobile applications, I would need the plugins from ionic / cordova.
It depends if you want to use any Ionic Components, so if you want to make visual changes to your app, or not.
If you have already created your application and it works/looks fine on mobile, there is no need to use Ionic. Ionic provides visual components to build hybrid apps that look like native apps, but if you don't need them, there is no need to use Ionic. Instead you can just use cordova, which allows you to take your existing webapp and simply add the native features like camera, location, etc. to it.
If you want to change your app and give it a native feel with Ionic, then it really depends on what kind of app you have and how big it is. It's not an easy task to take your existing app and put it "inside" Ionic. It might be easier to just create a new project and copy over the logic, but rebuild everything UI related with Ionic Components.
The problem: build a somewhat complex form that submits data to MySQL+PHP back-end. Requirements include:
Accessible from browsers running on mobiles, tablets and desktops
Must be completely platform independent; works well on Edge, Safari, Chrome, and other modern browsers.
Must be implemented so that in the future, native versions can be implemented using the same code-base.
Based on my research, Ionic seems to be the best fit. However, I don't see anything about using Ionic for web-apps on their official website.
Questions:
Can Ionic be used to meet the above requirements? If yes, what is the best way to use Ionic for web-apps? Is there an official guideline from Ionic for this?
How else would you go about meeting the above requirements if not using Ionic?
Thanks.
Ionic is built for developing mobile apps / progressive web apps. If you are looking for something which can be accesses through browsers Angular is the best option. Progressive web apps also will be something you can look into. Except for native functionalities in mobile and routing in browsers , angular code will be reusable.
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.
is it possible to create web application using ionic or is it only for mobile ? what is the difference between Angular and Ionic
You can definitely do it. However, it's probably not advisable. Ionic just provides a bunch of directives for you to use. You can use that in conjunction with something like Cordova/Phonegap to package that up for a mobile release. Otherwise, you could just take the web parts of the project (i.e. all your html/js/css/assets) and point a web server to them and presto - you can access your ionic page with a browser.
However...
You probably don't want to do this for a few reasons.
Ionic wasn't written to target desktop pages
Ionic doesn't really provide anything for desktop pages that A. doesn't already exist in Angular or B. someone hasn't properly written for desktop solutions
My suggestion here is to just use plain Angular or another framework such as React/Vue.
To answer the last part of your question: Angular is the framework that Ionic provides bindings (and some assets such as icons) for. Those bindings happen to be optimised/targetted towards mobile devices.
Hopefully that helps out a bit.
I am currently looking for a tool/workflow to support me in creating a mobile version of our website. Due to the main subject of our website, this should be a dedicated mobile version instead of a responsive version of our main site.
I came across yeoman and it looks really promising with a lot of features that I would be using like CSS and JS minifying, Spriting etc., a lot of tools that support me for the deployment of the webpage.
However as far as I can see the main focus for yeoman is on "normal" web apps, not for mobile. Am I right? Has someone used yeoman already for a mobile website and what was the experience and/or points to look out for? Are there any other alternatives to consider?
Try mobile-boilerpate generator for yeoman.
It scaffolds out H5BP Mobile Boilerplate
You are right Yeoman is for any web app you want to build; not just mobile specific.
For a mobile version of a website; they can be made similar to desktop sites although you still have to keep responsiveness in mind as not all devices are the same size.
In terms of a framework to consider, Lungo is a brilliant UI framework that can be used to make a native looking website.