Intel HTML5 Development Environment

Transcription

1 Helping Developers Efficiently Produce True Cross-Platform HTML5 Apps Intel HTML5 Development Environment April 2013

2 Q&A attendee questions that I did not answer in the presentation Q: Is source code of my app safe after uploading to the build process in the cloud? A: the cloud service is running on a secure server that is only accessible to the customer and selected Intel employees. Q: Java poses a security risk and more and more developers want to get rid of it. Why do you have a Java backend in the Intel XDK? A: We are working on removing any use of Java in an update of XDK. Q: Do I still need an Apple developer license, if I build my HTML5 app and then have it packaged for Apple s app store in the App Dev center? A: You still need an account at the respective app store (Apple, Google, Windows) to submit your app. Submission is a separate step that you need to do manually, just like before. Q: Currently the Chrome browser is required on the development host for running the XDK. Will you support other browsers? A: We are planning to remove browser dependencies for the XDK. When using a browser s development tools (eg for debuggging) you will still need a browser.

3 Intel is Making HTML5 Better Intel is helping software developers around the globe to create and deploy incredible cross-platform experiences, reach more customers, reduce costs and improve time-to-market Intel contributes to Open Source, Standards, and provides Tools & Resources to support HTML5 3 3

4 Delivering Tools & Resources From Development to Deployment Intel HTML5 Developer Zone Intel HTML5 Development Environment Tutorials, videos, documentation, forums HTML5 Playground BETA Intel HTML5 App Porter Tool BETA Let s have a closer look! 4 4

5 Cross Platform Tools Requirements: What App Developers Want Most Availability Across Platforms Development Speed Short Learning Curve Access To Native APIs Performance Native UI Look & Feel Source: Vision Mobile Developer Economics

6 Intel HTML5 Development Environment A no cost, integrated and front-to-back HTML5 App Dev Environment for True Cross-Platform Apps for multiple App Stores and form factor devices Intel XDK Developer Frontend Chrome* Browser plug-in with local project file storage capabilities Develop offline and online Windows*, OS X* App Dev Center Intel cloud-based tools & build service for Apple* App Store Google* Play Windows* Store HTML5 Web Apps No need to download and learn Native Platform SDKs Intel HTML5 Development Environment = Intel XDK + App Dev Center 6 6

7 What s New April 2013 Windows* 8 Build Support for Windows* 8 Store Integrated Project Wizard Now fully integrated into Intel XDK Graphical wizard for website-like apps Games/physics app framework Demo examples, and more... 7

8 Intel HTML5 Development Environment Intel XDK & App Dev Center Develop Test Deploy App Starter Project Wizard Device Emulator JS Debugger Build System Style Builder CSS generator On-Device App Tester On-Device App Debugger Hybrid Apps Apple* AppStore Google* Play* Windows* Store Coding Editor Web Apps Chrome* Store Facebook* Own Website App Framework Optimized JS libs App Game Interface Optimized Canvas Intel XDK App Dev Center Develop, Test & Deploy True Cross-Platform HTML5 Apps Write Once, Deploy Everywhere software.intel.com/html5 8 8

9 Platform Availability HYBRID APPS PACKAGED FOR STORES ios Apple* App Store Android* Google* Play - Nook* Nook* Store - Amazon* Amazon* Appstore for Android Windows*8 Windows* Store WEB APPS STORES HTML5 Facebook* HTML5 Intel AppUp SM HTML5 Chrome* Store HTML5 Your Own Website! Write ONCE package for MULTIPLE app stores 9

10 10 10

11 Download Intel XDK Chrome Browser extension - Control Panel Cloud Based App Dev Center control panel Frameworks/Libraries App Framework App Game Interfaces Cloud Services APIs Quick-Start App Creation: App Starter Samples Wizard App Prototyper Editing Integrated editor or Use your own Weltmeister Integration Testing Emulators: form factors & sensors App Debugger App Tester Build System Packages apps for store distiribution ios, Android, Amazon, Nook, Windows 8 11

12 Intel XDK Develop Test Deploy Downloadable Development Front End Chrome* Browser Plug-in Windows*, OS X* Java Backend Local project file handling Offline Development Connects to App Dev Center Intel XDK an easy cross-platform app development environment, hosted in a browser 12

13 Intel XDK Project Setup Develop Test Deploy Where do you want to go? WebApp, Hybrid App, Game just click 13

14 Develop Test Deploy Alternatively: Start In The Cloud 14 14

15 App Starter App Starter Develop Test Deploy For website-like apps - Themes - Menu structures - pages etc. 15

16 Develop Test Deploy Continue Development With Intel XDK 16 16

17 Code Editor Develop Test Deploy Toggle between Emulation and Editing Project folders with local files Code Editor with Syntax coloring The Intel XDK Is The Face For The HTML5 App Developer 17

18 Develop Test Deploy App Framework - Optimized JS Libraries jqmobi jqui jquery compatible APIs 60+ APIs built from ground up light, fast, and excel on mobile devices. takes advantage of new browser features supports valid W3C CSS selectors Optimized for Android*, ios*, BlackBerry* Works on webkit browsers for mobile smartphones Supports fixed headers and footers for a more native-like look & feel Designed for mobile devices supporting latest CSS3 and HTML5 features Using built-in browser features, makes the framework fast and light Uses CSS3 animations, W3C selectors and native scrolling on ios for a great performance jqplugins Plug-ins power the core of jqui Utilizes Scrolling bar lib CSS3 Animation lib Popup box Animation sheet, etc. $.is$.find $.map $.isfunction.addclass $.ui.popup $.ui.setbackbuttonstyle $.ui.settitle App framework provides great JS performance 18

19 Develop Test Deploy Style Builder A CSS File Generator Let Style Builder Create Your CSS file Tools to make your life easier 19

20 App Game Interface Develop Test Deploy - accelerated canvas implementation - multi channel sound - accelerated physics optimized implementations for ios*, Android*, Windows*8 more realistic modeling and smoother gameplay more native-like capabilities and performance. App game interfaces for faster HTML5 games 20

21 Test 21 21

22 Device Emulator Develop Test Deploy Select devices... Device Emulator GPS, Accelerometer, Data Connection simulation 22

23 Debugging Develop Test Deploy Write Chrome Debug Console App debugging with Chrome* debug console 23

24 On-Device App Testing Develop Test Deploy real screenshot from an iphone 5* App Dev Center app-lab app on real device, emulates Phonegap API App runs on target device On-device app preview no need to go through Apple* App Store or Google* Play for testing 24

25 On Device Debugging Develop Test Deploy Send debug messages from App to host via internet 25

26 Deploy 26 26

27 Build Process Develop Test Deploy Upload Project With Intel XDK to App Dev Center Select Target Platform and Build App one by one No need to download and learn native platform SDKs to create Apps Apple* App Store, Google* Play, Windows* Store Build process for HYBRID and WEB apps - in the cloud 27

28 Intel HTML5 App Porter Tool Helping ios* Developers Broaden Their Market Reach Through HTML5 28

29 Have You Created an ios* App? Your App Apple* App Store...and you want to broaden your market reach, by extending your ios* app to other platforms? Google* Play* Windows* Store Facebook* Store Chrome* Store Own Website We may have something for you! 29

30 Intel HTML5 App Porter Tool ios* App to HTML5 App Converter Download and test it - at no cost software.intel.com/html5 Minimizes porting effort to generic HTML5 Clean 1-to-1 source code conversion, incl. comments Indicates source code that needs manual translation Even 80% API match helps to reduce porting efforts Industry leading solution Expands market reach for Objective-C* app developers 30

31 App Is Now Ready For Next Steps Automatic Translation is done Now it s up To you to finishing the porting Clearly indicates which parts need to be converted manually 31

32 Before / After porting ios* App app HTML5 App 32 32

33 Summary Intel is making HTML5 better through Open Source Contributions, Standards, Tools & Resources At no cost, Intel provides a complete, integrated HTML5 development environment to support true cross-platform apps Intel HTML5 App Porter Tool - Beta helps to broaden the market reach for existing ios* apps by converting them to HTML5 cross-platform Register and start building your HTML5 app today! 33

34 34

35