{"id":8399,"date":"2014-05-15T12:13:18","date_gmt":"2014-05-15T11:13:18","guid":{"rendered":"http:\/\/www.itwriting.com\/blog\/?p=8399"},"modified":"2014-05-15T12:13:18","modified_gmt":"2014-05-15T11:13:18","slug":"hands-on-with-cordova-in-visual-studio","status":"publish","type":"post","link":"https:\/\/www.itwriting.com\/blog\/8399-hands-on-with-cordova-in-visual-studio.html","title":{"rendered":"Hands on with Cordova in Visual Studio"},"content":{"rendered":"<p>At TechEd this week, Microsoft <a href=\"http:\/\/msopentech.com\/blog\/2014\/05\/12\/apache-cordova-integrated-visual-studio\/\">announced<\/a> Apache Cordova support in Visual Studio 2013. A Cordova app is HTML and JavaScript wrapped as a native app, with support for multiple platforms including iOS and Android. It is the open source part of Adobe\u2019s PhoneGap product. I downloaded the preview from <a href=\"http:\/\/go.microsoft.com\/fwlink\/?LinkId=397606\">here<\/a> and took a quick look.<\/p>\n<p>There is a long list of dependencies which the preview offers to install on your behalf:<\/p>\n<p><a href=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image5.png\"><img loading=\"lazy\" decoding=\"async\" title=\"image\" style=\"border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px\" border=\"0\" alt=\"image\" src=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image_thumb5.png\" width=\"404\" height=\"398\" \/><\/a><\/p>\n<p>and<\/p>\n<p><a href=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image6.png\"><img loading=\"lazy\" decoding=\"async\" title=\"image\" style=\"border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px\" border=\"0\" alt=\"image\" src=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image_thumb6.png\" width=\"404\" height=\"396\" \/><\/a><\/p>\n<p>The list includes the Java SDK, Google Chrome and Apple iTunes. The documentation explains that Java is required for the Android build process, Chrome is required to run the Ripple emulator (so you could choose not to install if you do not require Ripple), and iTunes is required for deploying an app to an iOS device, though a Mac is also required.<\/p>\n<p>The license terms for both Chrome and iTunes are long and onerous, plus iTunes is on my list of applications not to install on Windows if you want it to run fast. Chrome is already installed on my PC, and I unchecked iTunes.<\/p>\n<p>Next, I ran Visual Studio and selected a Multi-Device Hybrid App project (I guess \u201cCordova app\u201d was rejected as being too short and simple).<\/p>\n<p><a href=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image7.png\"><img loading=\"lazy\" decoding=\"async\" title=\"image\" style=\"border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px\" border=\"0\" alt=\"image\" src=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image_thumb7.png\" width=\"404\" height=\"189\" \/><\/a><\/p>\n<p>An annoyance is that if you use the default project location, it is incompatible because of spaces in the path:<\/p>\n<p><a href=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image12.png\"><img loading=\"lazy\" decoding=\"async\" title=\"image\" style=\"border-top: 0px; border-right: 0px; background-image: none; border-bottom: 0px; padding-top: 0px; padding-left: 0px; border-left: 0px; display: inline; padding-right: 0px\" border=\"0\" alt=\"image\" src=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image_thumb12.png\" width=\"404\" height=\"176\" \/><\/a><\/p>\n<p>The project opened, and being impatient I immediately hit Run.<\/p>\n<p>When you build, and debug using the default Ripple emulator (which runs in Chrome, hence the dependency), Visual Studio grabs a ton of dependencies.<\/p>\n<p><a href=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image9.png\"><img loading=\"lazy\" decoding=\"async\" title=\"image\" style=\"border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px\" border=\"0\" alt=\"image\" src=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image_thumb9.png\" width=\"404\" height=\"236\" \/><\/a><\/p>\n<p>and eventually the app runs:<\/p>\n<p><a href=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image10.png\"><img loading=\"lazy\" decoding=\"async\" title=\"image\" style=\"border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px\" border=\"0\" alt=\"image\" src=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image_thumb10.png\" width=\"404\" height=\"272\" \/><\/a><\/p>\n<p>or you can debug in the Android emulator:<\/p>\n<p><a href=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image11.png\"><img loading=\"lazy\" decoding=\"async\" title=\"image\" style=\"border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px\" border=\"0\" alt=\"image\" src=\"http:\/\/www.itwriting.com\/blog\/wp-content\/uploads\/2014\/05\/image_thumb11.png\" width=\"404\" height=\"182\" \/><\/a><\/p>\n<p>A good start. <\/p>\n<p>Microsoft has some sample projects for AngularJS, BackboneJS and WinJS. This last is intriguing since you could emulate the Windows Phone look and feel (or something like it) on Android on iOS, though it would look far from native.<\/p>\n<p>The preview is not feature-complete. The only supported device targets are Android 4.x, IOS 6 and 7, Windows 8.x Store apps, and Windows Phone 8.x. Windows Phone debugging does not work in this preview.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>At TechEd this week, Microsoft announced Apache Cordova support in Visual Studio 2013. A Cordova app is HTML and JavaScript wrapped as a native app, with support for multiple platforms including iOS and Android. It is the open source part of Adobe\u2019s PhoneGap product. I downloaded the preview from here and took a quick look. &hellip; <a href=\"https:\/\/www.itwriting.com\/blog\/8399-hands-on-with-cordova-in-visual-studio.html\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Hands on with Cordova in Visual Studio<\/span> <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,26,55,56,67,80],"tags":[143,293,499,599,955,1011],"class_list":["post-8399","post","type-post","status-publish","format-standard","hentry","category-apple","category-development","category-microsoft","category-mobile","category-professional","category-software-development","tag-android","tag-cordova","tag-ios","tag-mobile","tag-visual-studio","tag-windows-phone"],"_links":{"self":[{"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/posts\/8399","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/comments?post=8399"}],"version-history":[{"count":0,"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/posts\/8399\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/media?parent=8399"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/categories?post=8399"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.itwriting.com\/blog\/wp-json\/wp\/v2\/tags?post=8399"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}