11 ms·
How we built our app in 2 weeks using Ionic Framework
- feroz1 12y agoSo it took Apple almost as long to approve it as it did for you to build it! Surely Apple can cut down the review time - it's so frustrating.
- rayv 12y agoEspecially seeing as Google Play makes it so easy. Nightmare for getting urgent updates out!
- wgx 12y agoFYI for urgent updates you can request an expedited review from Apple. Saved our asses a couple of times.
- fatihpense 12y agoFrom my point of view, in Google Play the trade-off is you get fast updates but you can lose your app and reputation permanently overnight. I see algorithmic solutions are best for Google for most of the time. But as a developer in this case, I feel we are business partners with Google also helping them earn money. But when you are treated with robots without common sense, without human-reasonable answers. It takes your enthusiasm away. I agree with you that waiting one week is a problem. However Google Play's solution isn't that nice if you get bitten.
- adrianclay 12y agoHow many people were on the team?
- rayv 12y agoWe only had a single dev working on the app, but our team of 5 helped out with designs, backend support etc. Already having the comparison API in place did help a lot.
- shakethemonkey 12y agoI wanted to see how this app feels. Visiting the App Store, there is no app with this name. On my iPad, if I tap on your link, I am presented with (literally) a solid empty white square. Good job, Apple. So FYI for everyone else not in the UK, this app is only available in the UK App Store. (But I had to fire up my Mac to find out.)
- rayv 12y agoJust opened this up to all territories. Might take some hours to appear in itunes though.
- atom-morgan 12y agoThank you. I just installed it, took a quick look, and wouldn't have guessed this wasn't a native app. This is on an iPhone 4S. It seems like it's a little more obvious on Android devices from other comments but I was pleased with it. This definitely gives me some confidence in Ionic.
- toni 12y agoIt's funny that the Genymotion screenshot clearly shows "for personal use" :) The blog post says Genymotion "has a completely free option along with some paid options for larger groups of developers", which is a slightly different interpretation of what you can read on Genymotion website as the use cases there are divided between commercial and non-commercial. Still a nice read, good luck to you!
- NicoJuicy 12y agoI wonder if Ionic Framework did remove the click-delay of +/- 300 ms for browser apps / sites. I tested a demo of the framework a while ago and the app just felt slow (perhaps because of the animation or what i thought was the delay on click). Googled: According to info, they did remove it, but you shouldn't use the ng-touch or fastclick side by side with it (source: http://stackoverflow.com/questions/25419109/ionic-tap-delay-click http://stackoverflow.com/questions/25419109/ionic-tap-delay-... )
- drygh 12y agoIt is removed. There are a number of browser quirks that Ionic handles so that all click events are handled accurately, and not just ones with an ng-click directive. Here's a blog post that goes into more detail about the 300 ms delay problem: http://ionicframework.com/blog/hybrid-apps-and-the-curse-of-the-300ms-delay/ http://ionicframework.com/blog/hybrid-apps-and-the-curse-of-...
- potomushto 12y agoAlso recommend to everyone who needs Cordova to look at AppGyver Steroids[1]. It's truly hybrid framework, though, still under active development. For example, Steroids has layers system, which basically consist of WebViews, but all transitions is native and Steroids gives you native controls such as NavigationBar and TabBar. I'm making an iOS app right now and I've got shared .styl, .jade templates and a bit of .js logic between web node.js and mobile app. From Ionic I use IonicIcons, and I love it. [1] http://www.appgyver.com/ http://www.appgyver.com/ [2] http://ionicons.com/ http://ionicons.com/
- rayv 12y agoThis was our closest alternative actually. Very promising!
- timruffles 12y agoNice looking app! You're not doing promises right however :) `$http.get()` etc returns a promise, so you can do all transforms and logic via `.then()`. The only time you should ever use `$q.defer()` is when you're wrapping a non-promise API. The bluebird library has a nice write-up: https://github.com/petkaantonov/bluebird/wiki/Promise-anti-patterns#the-deferred-anti-pattern https://github.com/petkaantonov/bluebird/wiki/Promise-anti-p...
- girvo 12y agoPromises are pretty great, too. I wrote some (now in production!) feature detection/facial recognition code using OpenCV through the node-opencv library, but as some of the big calls were async and I needed it to work in a somewhat synchronous way, I wrapped it all up in Q. Once you understand how they work, they can be quite great.
- Bahamut 12y agoThis is a really common mistake I have found with angular shops - almost none realize that all $http is is an augmented $q.when promise.
- drinchev 12y agoIs this app available only in UK app store? It seems I can't find it on my iPhone.
- colinramsay 12y agoJust installed it and I think this is the perfect sweet spot for this kind of wrapped webapp. The app is simple (but useful) and still leverages native things like the select combo and date time pickers. The transitions between the two screens are smooth and the list scrolling feels great. I suppose my only query is... why bother with ionic? This is such a simple application that it almost feels overkill, you could have used the cordova commandline tools along with libraries like iscroll and fastclick and you'd have had everything you've got here with less overhead...
- rayv 12y agoI guess whilst using Cordova on it's own was also possible, it would, like you said, also involve including/setting up multiple libs. Ionic just sets you up with very solid boilerplate and then also comes boxed with awesome UI components. For us the slight overhead was definitely a good trade-off.
- Kiro 12y agoWhat does Ionic provide exactly? What is the difference between this and just using AngularJS + Cordova?
- abluecloud 12y agoThink of it as bootsrap and a bit of jquery mobile, for cordova.
- rayv 12y agoIonic just provides a bunch of really useful components (angular directives) that's already hooked up and ready to use. This not only saves time developing, but testing as well. Also, comparing the Ionic components to jQuery mobile is not really fair. jQuery mobile is quite horrid in my opinion..
- abluecloud 12y agoWhen I said jquery mobile, I was more talking about the concept of pages which it has. I agree with you though.
- Kiro 12y agoJust tested the app on my Samsung Galaxy S3. Seems to be working fine and the transition between results page back to search page is smooth. The search form is offset to the right though where I suppose it should be centered. So the right side is touching the right edge of the phone while there is blank space on the left. It looks broken. Does anyone know what the problem is? These kind of issues are something I see frequently on mobile sites.
- notastartup 12y agoSeems like a great idea but angularJS? no thank you....wish you could build a simple app like this using jQuery.
- rayv 12y agoAny particular reason you dislike Angular? Have to say since I've been building with angular, I try and avoid jquery and any direct dom references completely. Think angular is fantastic.
- notastartup 12y agoI think AngularJS is too much effort to build the simplest things. I don't even see the benefit at all. I build all of my javascript apps (I hate using the word front-end apps) using jQuery and Flask backend. I don't even use asynchronous . I just don't see the point. What's missing from jQuery that limits you but does not in AngularJS? What's missing from Flask that limits you but does not in Node.js?
- perryg 12y agojQuery leaks too much memory. Not a big deal on desktop, but it's a tool of last resort on long-lived webapps.
- notastartup 12y agothey have jQuery mobile for that. I've not used it but seems like thats what it aims to do.
- benjaminva 12y agoIn your screenshot of the "Airport Parking Shop" in the Browser, besides the developer tools, the app itself is wrapped in a GUI that I have not seen before. First I thought it was an ionic served GUI but I couldn't find it when trying out the Tab App example. Could you elaborate more on which tools you used for testing in the browser?
- quarterto 12y agoThat's Chrome Dev Tools' emulation view. https://developer.chrome.com/devtools/docs/device-mode https://developer.chrome.com/devtools/docs/device-mode
- benjaminva 12y agoDidn't know about that yet. Thanks!
- matthewmacleod 12y agoIf there's any sort of app that works with this sort of thing, then yours is probably at the top of the list. The interface is super-simple, people are unlikely to use it often, and so on. In this case, the cost of developing independent apps for Android and iOS (as well as other platforms, potentially) would probably be too high. The experience wouldn't be suitable for anything used more intensely though, IMO. Scrolling on iOS is just "not right", in the sense that behaviour is different to native apps. Hover behaviour is different too, and some of the UI elements are also not quite correct (back button). Small things like that add up in a bigger app and cause a frustrating experience. But it's definitely a good turn-around time, and FWIW I think you've made the right decision to take this approach.
- marknutter 12y agoHm, seems to work well enough for Netflix though, and that app certainly is used a lot.
- matthewmacleod 12y agoI must admit, I didn't realise that Netflix was a Phonegap app. It does certainly explain a lot of the sketchy behaviours that I've noticed though!
- marknutter 12y agoAnd I have noticed them too, but I rarely ever cared. In fact, most people don't care, as long as it works, and it does. Another great example is Untappd, an app with millions of users and a 4.5 star rating on iOS.
- general_failure 12y agoNetflix app is native.
- marknutter 12y agoMost of Netflix apps, including the iOS version, are not native. The Android Netflix app, however, is the exception, as that is native (perhaps that's the one you've been using?).
- T-A 12y agoIn fairness, the comparison table pitting Eclipse against XCode should have included Android Studio, which (besides not being Eclipse) also includes a visual UI editor.
- pjmlp 12y agoI guess it is good decision when the developers have a web background, but there are lots of options for developing native applications across mobile OS.
- jakebrumby 12y agoNice and simple to use. Did you consider Appery too? http://appery.io/ http://appery.io/
- rayv 12y agoNo, with this many solid free options we pretty much immediately ruled out anything paid.
- TeeWEE 12y agoInteresting, But i installed the app on my nexus 5 and used it... It feels like i'm opening the browser. The app doesn't feel native. Input elements are weird. The dialog is weird. The animation is sluggish. And the spinner animation is moving in a weird fashion. For a lot of apps thats allright. But if you want to create a killer app, please go native.
- thomasfl 12y agoYupp, it's sluggish but good enough for small time apps. Wait a few years for famo.us and others to work on the problem, and you will see hybrid killer apps.
- _random_ 12y agoYeah, anything HTML5-related and stable is always just a few years away.
- pjmlp 12y ago> you will see hybrid killer apps. Being done in C# and C++.
- general_failure 12y agoWait for a few years and problem might solve itself. Famo.us has nothing to di with it
- rayv 12y agoMy Nexus 5 is also sluggish in comparison to my iPhone. From the little research I did it has to do with the default webview used on Android. Hopefully this will also get better in future.
- sunsu 12y agoThey could be bundling Crosswalk so any 4.0+ device would run the app in a Chrome 37+ WebView. Much better performance.
- 12y ago
- thomasfl 12y agoMobile app is most most certainly going to be made using html and javascript in the time to come. Ionic and angular is great for building mobile apps with standard mobile UI elements like headers with back buttons and chevrons, pages that slides in from the side, modals and tab bars at the bottom of the screen. Everything is meticulously created in html, css and javascript. Scrolling is good enough for most usecases, but if your pages contains long list views with graphic elements the page starts to lag. However if you use famo.us' list view scrolling is nearly as fast and smooth as native code on iPhone 4. On newer phones to difference between hybrid apps and native is unnoticeable. At the moment famo.us only has low level components, like boxes with html content. Standard back buttons, chevrons, tabs, action sheets and icons has to be imported from elsewhere. Famo.us only does fast bouncy animations, touch events and 3d effects. Besides famo.us is working on their phonegap/cordova alternative wrapper. A combination of Ionics ease of use and famo.us' impressive speed would have been great. There's lot of promising little open source projects on github that either extends famo.us or integrates it with javascript MVC libraries. I believe Brendan Eich was right when he said "Always bet on JS!". I bet mobile app development is going to be dominated by JavaScript and HTML.
- cfontes 12y agoVery nice comment. Thank you !
- no_future 12y agoWhat a dreadful notion, I hope this never happens. Development on mobile devices is a great way to develop on a web connected platform that reaches lots of consumers, but instead of using horrible, ancient tools that are expected to do things today that they were never designed to do at the time of their inception(HTML/CSS/Javascript), you can use capable systems languages like C(and now Swift, which I have no experience with but have heard generally good things about) and Java. That I call traditional frontend web tech ancient and out of place today isn't even really an opinion - the deluge of Javascript/CSS frameworks, compile-to languages,and lists of best practices would suggest that something is wrong there. Web stuff is just way easier to get into so there are a huge amount of developers available, especially the types who spend more time yapping on their blogs about the latest overhyped software trend than actually writing software. I don't know about animations and whatnot, but for games and image processing i.e. 2 enormous chunks of all mobile software, Javascript isn't replacing anything anytime soon. I don't understand why someone would want to spend hours trying to optimize languages which weren't designed to run native software on a platform to be as effective as the ones that were when you could just write the software in the native language, to me this just seems like an exercise in futility. Even moreso considering the fact that Javascript and HTML are horribly unproductive languages, though I suppose since so many people know them well they can be more productive in them than in a language they don't know.
- ltcstyle 12y agoNice little app. It's better than I expected from a hybrid app.
- venomsnake 12y agoHow can ionic be performance obsessed when it is a wrapper of cordova? How can they achieve better perfomance than plain cordova that way?
- rayv 12y agoThe improvement doesn't necessarily come from the cordova side of things. That's still all the same old webview that gets wrapped up. The real difference is achieved with everything else that gets used to build the app. The Ionic framework avoids DOM manipulation where possible and enables hardware accelerated animations. Both these things is possible on top of plain cordova, but Ionic makes it so much easier and they have already done the hard work of figuring out what is going to perform best inside that cordova wrapped webview.
- berns 12y agoIf Cordova is Phonegap and Ionic is Cordova how does Ionic solve the performance and device specific bugs they had with Phonegap?
- jblok 12y agoNice to see an established UK tech company that fulfills a function and does it really well :)
- Bahamut 12y agoWe just built a mostly done prototype of one of our products with Ionic in 4 weeks at my company, rewriting existing components to take advantage of Ionic. We ran into a bunch of Ionic bugs (on beta 13), and took a dive into integrating the beta 14 candidate with Angular 1.3 into the prototype (and came upon what looks like ng-animate bugs in 1.3) last night. We are also using CCA. Ionic has pretty much been a joy to use, and fit exactly our requirements (we do hybrid web/mobile apps on my team, mobile being Android only since we do native iOS development). The article is pretty much on the mark, and you need to be careful when it comes to performance on mobile. Optimizing stuff like using the track by syntax with ng-repeat is vital. Taking advantage of Angular's superior testability and structure conducive for rapid app development (and having 3 Angular contributors on the team doesn't hurt) allowed us to build an impressive app very quickly, as well as avoid some of the nasty Ionic bugs we came upon (mostly related to their $viewHistory service and broken back button). I haven't gotten to play around with the beta 14 candidate yet, but I was unhappy with how opinionated Ionic was when it came to the history and how it's expected that everything would inherit from a state with tabs. I will say this though - if it wasn't for the decision to use Ionic, we would have been in a lot of pain trying to meet our deadlines trying to write a lot of this functionality from scratch, and we would not have had stuff like the native feel with the tapping & scrolling behavior that Ionic provides. Overall the Ionic team did a great job with the product, and I'm pretty happy with it.
- xtrumanx 12y agoI've had a horrible first impression of Ionic just a week or so ago. Like Cordova, Ionic can generate a "hello world" app for you. It served just fine on the browser but would not load on neither the emulator or my phone. It is in alpha/beta so I guess I'll cut it some slack and try it once more in the future.
- blueicelt2004 12y agoYou built an app in two weeks that looks and feels like a hybrid app. Your app has 2 pages and a web browser for "Partner" sites. This app could have been built natively in 1 day each for iOS and Android, and then you would have native apps.
- uptown 12y agoLooks nice. I've been meaning to give Ionic a try, so nice to see you had a good experience with it. Did you check out Framework7? I've been using it with Cordova and it's provided a way to build cross-platform mobile interfaces quickly. It provide a native-feeling skin and interactions for your apps. http://www.idangero.us/framework7/ http://www.idangero.us/framework7/
- aagha 12y agoCurious: Did you look at other solutions like Xamarin?