VS2015 Apache Cordova, Ionic and Typescript First Impressions

Happy days are here again! We got a new Visual Studio to play with and it’s got some amazing features for hybrid developers. If you, like everyone after Facebook said it couldn’t do a hybrid mobile app, thought hybrid app development was dead then boy oh boy you were wrong.

In the last year there has been more advancement in hybrid mobile app development then any other platform. Ionic is now the go-to hybrid development platform. Why? because it’s an opinioned UI and backend framework. This prevents “framework paralysis” and it’s super fast out of the box. The next big changes have been in tooling. Telerik’s AppBuilder is probably the best hybrid development toolchain out there and now we have Cordova development built right into VS2015.

Finally mobile operating systems like iOS and Android have far, far better built-in browsers that make hybrid applications far more capable and performant. Also in the case of Android where the eco-system is so fragmented we now have Crosswalk.

I’ve long been a fan of Telerik’s AppBuilder. Of all the native, hybrid and not so native mobile app development tool-chains I’ve used I believe it has the lowest friction for developers and the fastest feedback cycle. But that’s not to say it’s perfect. Not having a local build option can be a pain (it’s cloud build only and the local AppBuilder version has to match the server version exactly).

But now with VS2015 we have cross platform mobile app development built in with Apache Cordova Tools and C++ Cross Platform. So now I’m giving this a shot, to see if it can replace Telerik’s AppBuilder for hybrid development.

So now why would you want to have local Cordova builds at all? Normally I prefer cloud builds and for mainline development I still think it’s a good idea. But there are going to be cases where you need local builds. For example currently there is a Cordova Splashscreen bug that causes a black screen to appear only showing your splash screen for a split second. The fix for this is to not use the Splash Screen plugin but instead modify the underlying native project that wraps the hybrid application, basically set it’s background to the splash screen image. If your using a cloud build provider, your SOL, you can’t change that pop over to this site.

Another issue with cloud builds providers (or it could just be Telerik’s AppBuilder) is that they require the client tools version and server version to be the exact same versions. So if you got a few build servers, be prepared to a lot of NPM updating.

I’m using VS2015 RTM with all the Cordova tools installed. I have an older MacBook Pro which I’ve setup as a remote build host. Watch this video from the Ionic team about the initial setup and configuration.

You can install the Ionic Template from the Visual Studio Extensions gallery:

Next I recommend using or taking a look at the Ionic TypeScript MDHA Starter project by Justin Credible on Github. It’s pretty overkill for most Ionic projects, but it’s a great starting point. Next what’s not included in Justin’s repo is some half decent TypeScript Definitions for Ionic. You can grab those from here, but they are a little dated but still work.

All in all this is a very good hybrid development experience and the tool-chain itself isn’t that difficult to setup and maintain. Compare this to Xamarin where every part of the tool-chain is very fragile and needs to be updated in multiple spots. Where the experience falls down a little is the simulator. The default simulator is Ripple, which is ok. But I’ve experienced caching issues with it, not picking up the latest changes. Additionally unlike the AppBuilder simulator which utilizes the chrome debug tools you have to bounce back and forth between Ripple and VS to see the console or interact with the debugger.

Overall it’s a decent experience especially for new hybrid developers used to Visual Studio. With Ionic support built right in it’s the best experience on Windows for that development straight out of the Visual Studio box. I still recommend Telerik’s AppBuilder as overall the experience is pretty frictionless, but it costs money a fair amount of it. Telerik’s Platform costs $470 a year for the lowest tier. Or you can use PhoneGap Build at $120 per year. Or finally you can use MacInCloud and get a dedicated Mac for $240 per year and build everything locally (or pay nothing extra if you have your own Mac).

This is just another tool in the hybrid app development toolbox the price point is good (free with Visual Studio Community Edition 2015) with the exception of needed or renting a Mac.

Resgrid is a SaaS product utilizing Microsoft Azure, providing logistics, management and communication tools to first responder organizations like volunteer fire departments, career fire departments, EMS, search and rescue, CERT, public safety, disaster relief organizations, etc. It was founded in late 2012 by myself and Jason Jarrett (staxmanade).