SlideShare ist ein Scribd-Unternehmen logo
1 von 31
Designed from the chipset up so people can choose
                                                     and seamlessly use the devices they love – whether
                                                     it’s a portable tablet or an amazing all-in-one




Windows Store on every device creates customer
confidence in apps, new opportunity for developers
Windows Store Apps: Apps Take Center Stage




Users can search within your app from anywhere
App Container + Signed & Validated code
demo
WinJS.ErrorFro                                                 WinJS Element                                             Semantic Zoom      ViewBox
                        WinJS.xhr           HTML/DOM Utils                           Localized String    Data-win-res
  mName                                                          Attributes              Utilities        processing

                                                                                                                                                                ListView
                                               Element
 Logging Utils                                Selection/
                                                                 Keyboard Key
                                                                                                                             Flyout      SettingsFlyout
                       WinJS.Promise                             Enumeration
    WinJS                                     Querying

                                                               Support for WinJS                                                                                                                     Custom Layout
   Validation        WinJS.PromiseStat        Coordinate                                                                                     Menu               GridLayout         ListLayout
                                                                declarative model                                            Menu                                                                      Interface
     WinJS              eMachine
                                              Conversion       (supportedForProc                                                           Command
                                                                     essing)
                                                                                       Support for       Controls
 Class definition      Namespace                                                    declarative model    Utilities (
 and inheritance     definition utilities                                              (processAll)     setOptions)      IZoomableView       AppBar
   WinJS.Class       WinJS.Namespace

                                                                                                                                                                                                     IListDataAdapte    IListNotification
                                                                                                                                                               IListBinding      IListDataSource
Fragment loading                                                                                                                                                                                             r               Handler
  and rendering                                                                                                             FlipView
WinJS.UI.Fragments

                                              WinJS.UI.                                                                                                                          StorageDataSo       VirtualizedData
                                                                  Animation                                                                                   DataSourceStatus                                           Error handling
                                              Animation                                                                                                                               urce                Source
                                                                   Library
                                               helpers
                                                                                     Data Binding
                                                                                      (as, bind)          Mixins
                                            Animation System
                                              Management

                                                                                    WinJS.Binding.
                                                                                         List           Conversions
  Application               local
    Events               (storage)
                                                                                                        Support for                                                               Light StyleSheet    Dark StyleSheet
                                                                                    List Projections                      Tooltip         Rating          TabContainer
                                                                                                        declarative
    WinJS.                                                                                              databinding
                         roaming
 Application.
                         (storage)                             WinJS.UI.Pages.
 sessionState                               WinJS.UI.Pages.
                                                               IPageControlM
                                             PageControl                                                                 TimePicker      DatePicker       ToggleSwitch
                                                                   embers
WinJS.Navigation           temp
   Functions             (storage)
                                            WinJS.Binding.
                                              Template                                                                  HTMLControl
demo
Feature                               Local context   Web context
Windows Runtime                       Yes             No

Windows Library for JavaScript        Yes             Partial

JavaScript
                                      No              Yes
URIs(attribute="javascript:code")

Data URIs ("data:" ) for fonts        No              Yes

External script references (<script
                                      No              Yes
src="http://*" /> )

window.close                          Yes             No

Cross-domain XHR requests             Yes             No
<div id=“contenthost” … />




 < div id=“appbar” … />
demo
demo
http://clint.ms/NextGenerationApps


http://code.msdn.microsoft.com/windowsapps


http://www.typescriptlang.org/
Windows 8 - The JavaScript Story

Weitere ähnliche Inhalte

Ähnlich wie Windows 8 - The JavaScript Story

Windows Azure platform overview
Windows Azure platform overviewWindows Azure platform overview
Windows Azure platform overview
Frédéric Harper
 
Lap around windows azure
Lap around windows azureLap around windows azure
Lap around windows azure
Manish Corriea
 
InduSoft VBScript Webinar
 InduSoft VBScript Webinar InduSoft VBScript Webinar
InduSoft VBScript Webinar
AVEVA
 
6.Live Framework 和Mesh Services
6.Live Framework 和Mesh Services6.Live Framework 和Mesh Services
6.Live Framework 和Mesh Services
GaryYoung
 

Ähnlich wie Windows 8 - The JavaScript Story (20)

Patterns of Cloud Applications Using Microsoft Azure Services Platform
Patterns of Cloud Applications Using Microsoft Azure Services PlatformPatterns of Cloud Applications Using Microsoft Azure Services Platform
Patterns of Cloud Applications Using Microsoft Azure Services Platform
 
Windows Azure platform overview
Windows Azure platform overviewWindows Azure platform overview
Windows Azure platform overview
 
Lap around windows azure
Lap around windows azureLap around windows azure
Lap around windows azure
 
Win8 ru
Win8 ruWin8 ru
Win8 ru
 
Windows Phone 7.5 와 Windows 8 메트로 스타일 앱 개발
Windows Phone 7.5  와 Windows 8 메트로 스타일 앱 개발Windows Phone 7.5  와 Windows 8 메트로 스타일 앱 개발
Windows Phone 7.5 와 Windows 8 메트로 스타일 앱 개발
 
End-to-End Integrated Management with System Center 2012
End-to-End Integrated Management with System Center 2012End-to-End Integrated Management with System Center 2012
End-to-End Integrated Management with System Center 2012
 
SVG in Data Acquisition and Control Systems
SVG in Data Acquisition and Control SystemsSVG in Data Acquisition and Control Systems
SVG in Data Acquisition and Control Systems
 
Abap web dynpro
Abap   web dynproAbap   web dynpro
Abap web dynpro
 
Abap web dynpro
Abap   web dynproAbap   web dynpro
Abap web dynpro
 
Desenvolvimento com iOS no LinguÁgil 2012
Desenvolvimento com iOS no LinguÁgil 2012Desenvolvimento com iOS no LinguÁgil 2012
Desenvolvimento com iOS no LinguÁgil 2012
 
Building reliable systems from unreliable components
Building reliable systems from unreliable componentsBuilding reliable systems from unreliable components
Building reliable systems from unreliable components
 
InduSoft VBScript Webinar
 InduSoft VBScript Webinar InduSoft VBScript Webinar
InduSoft VBScript Webinar
 
Introducing Windows Runtime in Windows 8
Introducing Windows Runtime in Windows 8Introducing Windows Runtime in Windows 8
Introducing Windows Runtime in Windows 8
 
Android developer training - Layman Learning Offers A Free Crash Course In An...
Android developer training - Layman Learning Offers A Free Crash Course In An...Android developer training - Layman Learning Offers A Free Crash Course In An...
Android developer training - Layman Learning Offers A Free Crash Course In An...
 
Ismael Intalio Cloud Benefits
Ismael Intalio Cloud BenefitsIsmael Intalio Cloud Benefits
Ismael Intalio Cloud Benefits
 
Intalio Cloud Benefits
Intalio Cloud Benefits Intalio Cloud Benefits
Intalio Cloud Benefits
 
6.Live Framework 和Mesh Services
6.Live Framework 和Mesh Services6.Live Framework 和Mesh Services
6.Live Framework 和Mesh Services
 
Brief about Windows Azure Platform
Brief about Windows Azure Platform Brief about Windows Azure Platform
Brief about Windows Azure Platform
 
Android Services Black Magic by Aleksandar Gargenta
Android Services Black Magic by Aleksandar GargentaAndroid Services Black Magic by Aleksandar Gargenta
Android Services Black Magic by Aleksandar Gargenta
 
20120620 moving to windows azure
20120620 moving to windows azure20120620 moving to windows azure
20120620 moving to windows azure
 

Mehr von Clint Edmonson

Visual Studio 2010 Ultimate
Visual Studio 2010 UltimateVisual Studio 2010 Ultimate
Visual Studio 2010 Ultimate
Clint Edmonson
 
Building a Twitter App with Silverlight 3 - Part 2
Building a Twitter App with Silverlight 3 - Part 2Building a Twitter App with Silverlight 3 - Part 2
Building a Twitter App with Silverlight 3 - Part 2
Clint Edmonson
 

Mehr von Clint Edmonson (20)

New Product Concept Design.pptx
New Product Concept Design.pptxNew Product Concept Design.pptx
New Product Concept Design.pptx
 
Lean & Agile Essentials
Lean & Agile EssentialsLean & Agile Essentials
Lean & Agile Essentials
 
MICROSOFT BLAZOR - NEXT GENERATION WEB UI OR SILVERLIGHT ALL OVER AGAIN?
MICROSOFT BLAZOR - NEXT GENERATION WEB UI OR SILVERLIGHT ALL OVER AGAIN?MICROSOFT BLAZOR - NEXT GENERATION WEB UI OR SILVERLIGHT ALL OVER AGAIN?
MICROSOFT BLAZOR - NEXT GENERATION WEB UI OR SILVERLIGHT ALL OVER AGAIN?
 
Flow, the Universe and Everything
Flow, the Universe and EverythingFlow, the Universe and Everything
Flow, the Universe and Everything
 
Application architecture jumpstart
Application architecture jumpstartApplication architecture jumpstart
Application architecture jumpstart
 
Code smells and Other Malodorous Software Odors
Code smells and Other Malodorous Software OdorsCode smells and Other Malodorous Software Odors
Code smells and Other Malodorous Software Odors
 
Windows Azure Jumpstart
Windows Azure JumpstartWindows Azure Jumpstart
Windows Azure Jumpstart
 
Introduction to Windows Azure Virtual Machines
Introduction to Windows Azure Virtual MachinesIntroduction to Windows Azure Virtual Machines
Introduction to Windows Azure Virtual Machines
 
Peering through the Clouds - Cloud Architectures You Need to Master
Peering through the Clouds - Cloud Architectures You Need to MasterPeering through the Clouds - Cloud Architectures You Need to Master
Peering through the Clouds - Cloud Architectures You Need to Master
 
Architecting Scalable Applications in the Cloud
Architecting Scalable Applications in the CloudArchitecting Scalable Applications in the Cloud
Architecting Scalable Applications in the Cloud
 
Windows Azure jumpstart
Windows Azure jumpstartWindows Azure jumpstart
Windows Azure jumpstart
 
Windows Azure Virtual Machines
Windows Azure Virtual MachinesWindows Azure Virtual Machines
Windows Azure Virtual Machines
 
A Force of One - Agile and the Solo Developer
A Force of One - Agile and the Solo DeveloperA Force of One - Agile and the Solo Developer
A Force of One - Agile and the Solo Developer
 
Agile is as Agile Does
Agile is as Agile DoesAgile is as Agile Does
Agile is as Agile Does
 
Visual Studio 2010 Ultimate
Visual Studio 2010 UltimateVisual Studio 2010 Ultimate
Visual Studio 2010 Ultimate
 
Visual Studio 2010 - The Good Stuff
Visual Studio 2010 - The Good StuffVisual Studio 2010 - The Good Stuff
Visual Studio 2010 - The Good Stuff
 
Architecting Applications the Microsoft Way
Architecting Applications the Microsoft WayArchitecting Applications the Microsoft Way
Architecting Applications the Microsoft Way
 
Intro to VS 2010 & .Net 4.0
Intro to VS 2010 & .Net 4.0Intro to VS 2010 & .Net 4.0
Intro to VS 2010 & .Net 4.0
 
Sky High With Azure
Sky High With AzureSky High With Azure
Sky High With Azure
 
Building a Twitter App with Silverlight 3 - Part 2
Building a Twitter App with Silverlight 3 - Part 2Building a Twitter App with Silverlight 3 - Part 2
Building a Twitter App with Silverlight 3 - Part 2
 

Kürzlich hochgeladen

Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Kürzlich hochgeladen (20)

Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
A Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source MilvusA Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source Milvus
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 

Windows 8 - The JavaScript Story

  • 1.
  • 2.
  • 3.
  • 4.
  • 5. Designed from the chipset up so people can choose and seamlessly use the devices they love – whether it’s a portable tablet or an amazing all-in-one Windows Store on every device creates customer confidence in apps, new opportunity for developers
  • 6. Windows Store Apps: Apps Take Center Stage Users can search within your app from anywhere
  • 7.
  • 8.
  • 9. App Container + Signed & Validated code
  • 10. demo
  • 11.
  • 12.
  • 13.
  • 14. WinJS.ErrorFro WinJS Element Semantic Zoom ViewBox WinJS.xhr HTML/DOM Utils Localized String Data-win-res mName Attributes Utilities processing ListView Element Logging Utils Selection/ Keyboard Key Flyout SettingsFlyout WinJS.Promise Enumeration WinJS Querying Support for WinJS Custom Layout Validation WinJS.PromiseStat Coordinate Menu GridLayout ListLayout declarative model Menu Interface WinJS eMachine Conversion (supportedForProc Command essing) Support for Controls Class definition Namespace declarative model Utilities ( and inheritance definition utilities (processAll) setOptions) IZoomableView AppBar WinJS.Class WinJS.Namespace IListDataAdapte IListNotification IListBinding IListDataSource Fragment loading r Handler and rendering FlipView WinJS.UI.Fragments WinJS.UI. StorageDataSo VirtualizedData Animation DataSourceStatus Error handling Animation urce Source Library helpers Data Binding (as, bind) Mixins Animation System Management WinJS.Binding. List Conversions Application local Events (storage) Support for Light StyleSheet Dark StyleSheet List Projections Tooltip Rating TabContainer declarative WinJS. databinding roaming Application. (storage) WinJS.UI.Pages. sessionState WinJS.UI.Pages. IPageControlM PageControl TimePicker DatePicker ToggleSwitch embers WinJS.Navigation temp Functions (storage) WinJS.Binding. Template HTMLControl
  • 15. demo
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21. Feature Local context Web context Windows Runtime Yes No Windows Library for JavaScript Yes Partial JavaScript No Yes URIs(attribute="javascript:code") Data URIs ("data:" ) for fonts No Yes External script references (<script No Yes src="http://*" /> ) window.close Yes No Cross-domain XHR requests Yes No
  • 22. <div id=“contenthost” … /> < div id=“appbar” … />
  • 23.
  • 24.
  • 25. demo
  • 26.
  • 27.
  • 28. demo
  • 29.

Hinweis der Redaktion

  1. What you’ve seen is Windows Reimagined.Let me explain what Windows re-imagined means:A new UI where touch is a first-class citizen along with full mouse-and-keyboard supportSupports a new range of scenarios from traditional computing to mobileBased on the new Microsoft design principlesdo more with less, be fast and fluid, authentically digitalDesigned from the chipset up for multiple form-factors, including tablets, laptops, desktops &amp; all-in-onesRe-architected from the chipset up for both Intel and ARMWindows Store on every device with full payments support and flexibility It has everything you would expect from a modern app store, including a curated experience, full commerce experience, and installation on every devicePlus it supports a wide range of business models with flexible payment options and the best economicsTalk more later in the deckNew development models built on WinRT, including native support for HTML/CSS/JS, C#/XAML, C++/DirectXEnables many developers to leverage the skills and assets they already know and haveEmphasize HTML/JS as a truly native option, separate from the hybrid model used in other platforms. On W8 HTML/JS == native.
  2. You are here !! The focus will be HTML/JS… Click… But do remember WInRT is helping.. And is available to provide infrastructure.. We will see a little bit of WinRT in action in some demos
  3. Demonstratecontoso recipes application Show the use of the module pattern in javascript… Show the use of a promise.. Show the navigation Show the WinJS.application object To see all of these, it is trivial to do a search on the solution for //DEMO:WinJS and you will be able to see areas to set breakpoints for discussion..
  4. Demonstratecontoso recipes application Show the use of the module pattern in javascript… Show the use of a promise.. Show the navigation Show the WinJS.application object To see all of these, it is trivial to do a search on the solution for //DEMO:WinJS and you will be able to see areas to set breakpoints for discussion..
  5. If you prefer to use your own library, you can. As long as your app is compliant with Metro SDK, you will be fine.. At build, we explicitly wrote a sample (finance) using jQuery… It works very well.. If you are bringing your own library, here is the advice that I can give you:Mix &amp; Match works fine. WinJS does a lot of things well, such as simplifying the object model, wrappers for file system, implementing the promise pattern, etc.. Use WinJS for all of that.. Use your favorite library for everything else, but do try to adhere to the Metro UI and the Windows personality. Your users will appreciate it if you do..
  6. When your app moves out of the foreground, Windows waits for a few seconds to allow quick switching back to the app, then tries to suspend the app. Your app must be registered for the suspending or checkpoint (JavaScript) events, which it receives when Windows wants to suspend it. This is an important time for your app; use this opportunity to save app data that must be kept in persistent storage. Usually, your app is resumed as is, and you won’t need your persisted data because they are still in memory. But you need to store this data in case Windows terminates your app to free system resources. Save enough app data to bring users back to the place in your app where they were when the app was suspended. This way, your customers perceive your app as always alive and running.
  7. Demonstratecontoso recipes application Show the use of the module pattern in javascript… Show the use of a promise.. Show the navigation Show the WinJS.application object To see all of these, it is trivial to do a search on the solution for //DEMO:WinJS and you will be able to see areas to set breakpoints for discussion..
  8. Demonstratecontoso recipes application Show the use of the module pattern in javascript… Show the use of a promise.. Show the navigation Show the WinJS.application object To see all of these, it is trivial to do a search on the solution for //DEMO:WinJS and you will be able to see areas to set breakpoints for discussion..