introduction to windows 8 development html5 objectives
TRANSCRIPT
![Page 1: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/1.jpg)
Introduction to Windows 8 Development HTML5 Objectives
www.netcomlearning.com
• Introduction to Windows 8 Operation System
• Windows 8 Platform
• Windows Store Apps Design Guidelines
• Developing a Windows Store App Using HTML5 and JavaScript
• The WinJS Library
• Q&A
![Page 2: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/2.jpg)
• PART 1: Introduction to Windows 8 Platform
• PART 2: Metro Style App Principles
• PART 3: Developing Metro Style Apps with HTML5 and JavaScript
• PART 4: Integrating with Windows 8 Experiences
• PART 5: Implementing Tiles and Notifications
• PART 6: Deploying to the Windows Store
www.netcomlearning.com
![Page 3: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/3.jpg)
Introduction to Windows 8 Platform
www.netcomlearning.com
![Page 4: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/4.jpg)
Lesson 1: Introduction to Windows 8 Operating System
• Windows 8 Platform Investments
www.netcomlearning.com
![Page 5: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/5.jpg)
Windows 8 Platform Investments
www.netcomlearning.com
![Page 6: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/6.jpg)
Lesson 2: Windows 8 Platform
• Windows 8 Platform
• Metro Style App APIs
• WinRT Language Projections
www.netcomlearning.com
![Page 7: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/7.jpg)
Windows 8 Platform
www.netcomlearning.com
![Page 8: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/8.jpg)
Metro Style App APIs
www.netcomlearning.com
![Page 9: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/9.jpg)
WinRT Language Projections
www.netcomlearning.com
![Page 10: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/10.jpg)
• Metro Style App Principles
www.netcomlearning.com
![Page 11: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/11.jpg)
Metro Style App Principles
• Metro Style App Principles
• Fast and Fluid
• Snap and Scale Beautifully
• Contracts, Tiles, Notifications and Other Guidelines
www.netcomlearning.com
![Page 12: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/12.jpg)
Metro Style App Principles
www.netcomlearning.com
![Page 13: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/13.jpg)
Fast and Fluid
www.netcomlearning.com
![Page 14: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/14.jpg)
Snap and Scale Beautifully
www.netcomlearning.com
![Page 15: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/15.jpg)
Contracts, Tiles, Notifications and Other Guidelines
www.netcomlearning.com
![Page 16: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/16.jpg)
Module Overview
• Developing a Metro Style App Using HTML5 and JavaScript
• The WinJS Library
www.netcomlearning.com
![Page 17: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/17.jpg)
Lesson 1: Developing a Metro Style App Using HTML5 and JavaScript
• Creating Metro Style Apps with HTML5 and JavaScript
www.netcomlearning.com
![Page 18: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/18.jpg)
Creating Metro Style Apps with HTML5 and JavaScript
www.netcomlearning.com
![Page 19: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/19.jpg)
Lesson 2: The WinJS Library
• WinJS
• Everyday Controls
• How to Get Started with ListView
• ListView Data Templating
• AppBar
www.netcomlearning.com
![Page 20: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/20.jpg)
WinJS
www.netcomlearning.com
![Page 21: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/21.jpg)
Everyday Controls
www.netcomlearning.com
![Page 22: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/22.jpg)
How to Get Started with ListView
www.netcomlearning.com
![Page 23: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/23.jpg)
ListView Data Templating
<div data-win-control="WinJS.Binding.Template" id="myTemplate" >
<div style="width: 110px; margin: 10px">
<img data-win-bind="src: picture" style="height: 60px;
width: 60px" />
<input type="button" data-win-bind="value: buttonText" />
</div>
</div>
<div height="400"
data-win-control="WinJS.UI.ListView" id="listview1"
data-win-options="{dataSource: myData, itemRenderer: myTemplate}">
</div>
www.netcomlearning.com
![Page 24: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/24.jpg)
AppBar
www.netcomlearning.com
![Page 25: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/25.jpg)
Integrating with Windows 8 Experiences
www.netcomlearning.com
![Page 26: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/26.jpg)
Module Overview
• Windows 8 Contracts
• Implementing the Search and Share Contracts
www.netcomlearning.com
![Page 27: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/27.jpg)
Lesson 3: Windows 8 Contracts
• The Charms Bar
• Windows 8 Contracts
www.netcomlearning.com
![Page 28: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/28.jpg)
The Charms Bar
www.netcomlearning.com
![Page 29: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/29.jpg)
Windows 8 Contracts
• 1+1=3. Leverage other apps to complete scenarios
• provide a consistent invocation model that users can always confidently rely on
• Start with the VS (available for Search, Share, File Picker extension)
www.netcomlearning.com
![Page 30: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/30.jpg)
Lesson 4: Implementing the Search and Share Contracts
• Search Anatomy
• Search Settings & Events
• Sharing From Source to Target
• Adding Settings Flyout to Settings Charm
• Demonstration: Implementing Windows 8 Contracts
www.netcomlearning.com
![Page 31: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/31.jpg)
Search Anatomy
www.netcomlearning.com
![Page 32: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/32.jpg)
Search Settings & Events
www.netcomlearning.com
![Page 33: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/33.jpg)
Sharing From Source to Target
www.netcomlearning.com
![Page 34: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/34.jpg)
Adding Settings Flyout to Settings Charm
function scenario2AddSettingsFlyout() {
WinJS.Application.onsettings = function (e) {
e.detail.applicationcommands = { "helpDiv": {
title: "Help",
href: "/html/2-SettingsFlyout-Help.html" } };
WinJS.UI.SettingsFlyout.populateSettings(e);
};
}
www.netcomlearning.com
![Page 35: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/35.jpg)
Implementing Tiles and Notifications
www.netcomlearning.com
![Page 36: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/36.jpg)
Module Overview
• Using App Tiles in Windows 8 Metro Style apps
• Using Notifications in Metro Style apps
www.netcomlearning.com
![Page 37: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/37.jpg)
Lesson 5: Using App Tiles in Windows 8 Metro Style apps
• App Tiles
• Basic App Tiles
• Live App Tiles
• Secondary App Tiles
www.netcomlearning.com
![Page 38: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/38.jpg)
App Tiles
www.netcomlearning.com
![Page 39: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/39.jpg)
Basic App Tiles
Square (1x1) Wide (2x1)
www.netcomlearning.com
![Page 40: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/40.jpg)
Live App Tiles
www.netcomlearning.com
![Page 41: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/41.jpg)
Secondary App Tiles
www.netcomlearning.com
![Page 42: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/42.jpg)
Lesson 6: Using Notifications in Metro Style apps
• Toast Notifications
• Toast Templates
www.netcomlearning.com
![Page 43: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/43.jpg)
Toast Notifications
www.netcomlearning.com
![Page 44: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/44.jpg)
Toast Templates
www.netcomlearning.com
![Page 45: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/45.jpg)
Deploying to the Windows Store
www.netcomlearning.com
![Page 46: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/46.jpg)
Module Overview
• The Windows Store
• Monetizing Using the Windows Store
www.netcomlearning.com
![Page 47: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/47.jpg)
Lesson 7: The Windows Store
• The Store
www.netcomlearning.com
![Page 48: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/48.jpg)
The Store
www.netcomlearning.com
![Page 49: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/49.jpg)
Lesson 8: Monetizing Using the Windows Store
• Trial apps in Windows 8
• In-App Purchase
• Adding advertising to Windows 8 Apps
www.netcomlearning.com
![Page 50: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/50.jpg)
Trial apps in Windows 8
www.netcomlearning.com
![Page 51: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/51.jpg)
In-App Purchase
var licenceInformation = Windows.ApplicationModel.Store.CurrentApp.LicenseInformation; // can’t do in-app purchase in trial mode, must convert first if (!licenceInformation.IsTrial) {//load the listings with all the products var listing = await Windows.ApplicationModel.Store.CurrentApp.LoadListingInformationAsync(); if (!licenceInformation.ProductLicenses["product1"].IsActive) { try { // The customer doesn't own this feature, so show the purchase dialog. await Windows.ApplicationModel.Store.CurrentApp. RequestProductPurchaseAsync("product1"); // the in-app purchase was successful } catch (Exception) {// The in-app purchase was not completed because the // customer canceled it or an error occurred.} } }
www.netcomlearning.com
![Page 52: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/52.jpg)
Adding advertising to Windows 8 Apps
3 1 2
www.netcomlearning.com
![Page 53: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/53.jpg)
Upcoming Webinars
• Free Webinar: Microsoft SQL Server 2012 - Managing Database Applications
• Free Webinar: Windows Server 2012 - Server Management
• Free Webinar: Intro. to System Center Configuration Manager 2012 (SCCM)
• Free Webinar: Introduction to Windows 8 Development - C#
• Free Webinar: CISSP | The 10 Essential Domains Revisited
• Free Webinar: Microsoft Dynamics GP | Excel, as a GP Report Writer
• Free Webinar: Microsoft Dynamics AX 2012 - The Complete ERP Solution
• Free Webinar: Lync Server 2013 Part 1 | Features and Functionality
• Free Webinar: Windows 8 Virtualization
• Free Webinar: Windows 8 Development - HTML5 with Live Demo
• Free Webinar: Lync Server 2013 Part 2 | Architecture and Deployment Changes
• Free Webinar: Lync Server 2013 Part 3 | Integration and Extensibility
Sign up for free at: www.netcomlearning.com/webinars
www.netcomlearning.com
NetCom’s Average Instructor Rating: 8.7/9
![Page 54: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/54.jpg)
MCSD Windows Store Apps Using HTML5
www.netcomlearning.com
FSDFDSFDSFFSFSDFSDFDSFDFDFSFSFSFSDFSDFSDFSDFSDFSDFSDFSD
Ongoing Free Second Shot Promotion!
![Page 55: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/55.jpg)
Windows 8 Development HTML5 Classes
MCSD: Windows Store Apps Using HTML5
• 20480: Programming in HTML5 with JavaScript and CSS3
• 20481: Essentials of Developing Windows Store Apps using HTML5 and JavaScript
• 20482: Advanced Windows Store Apps Development using HTML5 and JavaScript
Upcoming Classes: • December 10th in Arlington, VA & Live Online
• January 28th in New York, NY & Live Online
• March 18th in Arlington, VA & Live Online
Locations: Attend in-class or Live Online Instructor-led
• New York
• Las Vegas (All Inclusive Travel Package)
• Arlington VA
• Philadelphia, PA
www.netcomlearning.com
![Page 56: Introduction to Windows 8 Development HTML5 Objectives](https://reader031.vdocuments.site/reader031/viewer/2022020620/61e3ca622a6ac872761889c1/html5/thumbnails/56.jpg)
Thank You! Back to Rinchen Stick around for Raffle & Q&As
www.netcomlearning.com