ManifoldJS aims to make the life of a mobile developer easier than ever, by utilizing Web App Manifests, which allowing websites to declare app-like properties. ManifoldJS uses that standard for those platforms that support it, but falls back to Cordova for those who don’t. Cordova is great, but the W3C also considers work done at Mozilla (Firefox Open Web Apps), Google (Chrome Hosted Apps) and Microsoft has done (Windows 8 had local web apps, Windows 10 extends over to hosted web apps). With this, we can now wrap websites and creating hybrid applications which can be deployed in the various app stores, while still taking advantage of many native aspects for each device (contacts, calendar, file storage, gyro, GPS, etc.). VorlonJS is an open source, extensible, platform-agnostic tool for remotely debugging and testing your JavaScript. Powered by node.js and socket.io. It is easy to set up, works on any platform, and extensible. When we combine the two, we can create applications at native speed which can be deployed in a number of app stores, and utilizing largely one code base. There is no silver bullet for mobile development, but this certain makes the process easier.

1. Dave Voyles, Sr. Tech Evangelist | Microsoft
DaveVoyles.com | @DaveVoyles
Hosted web apps with
ManifoldJS

2. What is a Hosted Web App?

3. How do you build one?

4. What is ManfoldJS?
• Node.js app that installs from NPM.
• Can run on any platform, and build for any platform.
• Helps you reach more users than ever by packaging your web experience as
native apps across Android, iOS, and Windows
• Standards based on the latest W3C Manifest working draft.
• Open Source

5. Why create a hosted web app?
• Reach more users
o Package your web experience as native apps across Android, iOS, and Windows
• Update without having to go through App Stores
o No more 6 day wait period – update when you want to push, no need for approval
• No need to reinvent the wheel
o Already have a website? Why re-write all of that content for mobile apps?

6. How does ManifoldJS work?
• Takes the meta-data about your site and generates native "hosted" apps.
• If the platform doesn't support hosted apps, we use Cordova to polyfill it.
• Meta-data is stored in a JSON file, called the Web App Manifest
• Hybrid apps on your mobile device then point back to a website with this
manifest, and inject the site into your app.

7. What is Cordova?
• Platform for building native mobile apps using HTML5, CSS, and JavaScript
• Open Source
• PhoneGap: Wraps Cordova and includes some additions

8. Web App Manifest
Defines a JSON-based manifest to place
metadata associated with a web app
Includes:
App name, links to icons, preferred URL to
open, screen orientation, display mode (e.g.,
in fullscreen)

9. Installation

10. Build Process
Command Line

11. Build Process
Web Generator

12. Demo: Building a web app

13. Hosting the web app

14. Example: NORAD Santa Tracker

15. Platform Enhancements
• Cortana integration
o Ask her to open the app, to a specific section (Games, Music, movie)
• Live Tiles
• Updates about Santa’s trip

16. Debugging with VorlonJS

17. Wrapping up
• Reach more users
o Package your web experience as native apps across Android, iOS, and Windows
• Update without having to go through App Stores
o No more 6 day wait period – update when you want to push, no need for approval
• No need to reinvent the wheel
o Already have a website? Why re-write all of that content for mobile apps?
• Remote debugging with VorlonJS
o Vorlonjs.com