[Powered by Google Translate] [Семінар - Windows 8 - Розробка додатки / ігри з HTML5] [Кріс Боуен, Едвін Гуарін - Гарвардський університет] [Це CS50. - CS50.TV] 

Гей, все. Мене звуть Едвін Гуарін. Це Кріс Боуен. Я дам йому представитися в секунду. Я просто хочу, щоб зробити швидкий оголошення. Насамперед, все, що вам CS50 студентів отримати Windows 8 безкоштовно. Так що якщо ви думаєте про фактично використовуючи його для остаточного проекту, це твоє. Нейт буде надіслати електронною поштою пізніше на інструкції. Друга річ, якщо ви вирішили написати Windows 8 додаток для вашого CS50 остаточного проекту, ми збираємося робити деякі призи: Xbox, ми могли б бути в змозі дати шифер геть, все в такому дусі. Так що, якщо є що-небудь, що вас стримує, нехай Кріс або я знаю, як ми можемо допомогти вам побудувати щось дійсно здорово. Так ще раз спасибі за те, сьогодні, і я буду передати її з Крісом. 

Спасибі, Едвін. Спасибі всім, що приєдналися до нас сьогодні. Я Кріс Боуен. Я один з колег Едвіна тут на Північно-сході. Я просто хотів, щоб провести трохи часу з вами говоримо про як зробити додаток Windows Store з HTML5, JavaScript і CSS і частково отримуєте небудь питання, ви можете мати про нього відповів для вас як ви шукаєте до думати про можливе використовувати його протягом фіналу можливість CS50. 

Тим не менш, ми просто зануритися дюйма Я піду до слайдів тут. Якщо у вас є які-небудь питання, не соромтеся, надсилайте мені електронною поштою. Я cbowen@microsoft.com, і є мій блог і мій Twitter. Однак ви хочете увійти в контакт зі мною, це нормально. У мене є близько години матеріалу, і я хочу, щоб ваші питання в цьому шляху, так що не соромтеся, мають питання під час цього. Вони не можуть бачити, хто задає питання по запису, так що ви будете як анонімні, як ви хочете бути. 

Дозвольте мені зануритися в, просто дати вам короткий вступ до Windows 8, і показати вам деякі з речей, про Windows Store додатків, які ви могли б розглянути як ви думаєте про розробку програми. Ми дивимося на Windows 8. Ми були протягом пари тижнів. Багато сильної прийняття там вже. Можливо, ви бачили вже поверхні машини, які у нас є, а також. Там одна тут насправді ви можете поглянути на, якщо ви тут особисто. Я дуже хочу з тобою поговорити, показати вам трохи про Windows 8. Ідея з Windows 8, це дійсно висунути всі речі друзям та знайомим про Windows, в деяких нових вражень - зокрема, такі речі, як на поверхні машини з сенсорним, такого роду більш мобільних пристроїв, які зараз на ринку, але це також ОС Windows за своєю суттю. Так значить, ви можете встановити його насправді на все, що працює Windows 7, від найбільшої потрійний SLI установки ігор вниз до ноутбука і для ваших блискучих нових іншими пристроями, які ви можете підібрати вже сьогодні. Вони працюватимуть Windows 8. Я покажу вам навколо тільки трохи, і всі переживання, які ви побачите тут речі, які ви можете створити. Ідея полягає в тому, чи є це дотик, миша, клавіатура, що пристрій є те, що ви працюєте додатки на, він збирається бігти здорово. Windows 8 допоможе з усіма цими сценаріями. 

Ці слайди в сторону, давайте просто отримати прямо в поглянути тут. Дозвольте мені показати вам навколо мого домашнього екрану. Це мій стартовий екран. Я просто дам вам трохи туру тут. Я на НЕ-сенсорним машини, так як я хочу торкнутися мого екрану ноутбука, він не буде робити нічого, так що я просто прокручувати тут небагато, і показати вам. Деякі речі, які ви могли б помітити це той факт, що ці так звані живі плитки насправді можна анімувати, і вони можуть надати інформацію для вас - можливо оновлення по статистиці для гри або показати вам новини з деяких більш ранніх додатків, які тут, на лівій стороні. Там ми йдемо. Я впевнений, що це тільки позитивно і фантастично гарна новина. Тут можна побачити, що це дійсно виклик вашу увагу назад в додаток, кажучи, "Гей, є щось нове тут. Погляньте. Вернись в і подивитися, що нового для вас." Це називається жити плитка, і ви можете зробити повідомлення або прямо з самого додатка або якщо ви подивіться більш докладно, ви дізнаєтеся, як писати віддалений сервіс що насправді може передавати інформацію в плитці, що те, що відбувається з цими новин додатків. Вони насправді отримати новини з хмари і поновлення плитку прямо там щоб люди знали, що є причина, щоб відкрити програму і подивіться на все, що останні новини в будь-який з них або якщо є нові рецепти або новий високий бал, щоб перемогти або друг гра або що на цих додатків. Це те, що, щоб спонукати вас назад дюйма Так ось живі плитки, і це може бути людина, це може бути сайт, а також. Зазвичай це додаток. 

Значною мірою всі ці речі, які я маю тут прийшли з Windows Store. Я запустити це. Це один з додатків, які ви отримуєте за замовчуванням на будь-якій машині, на якому запущена Windows 8. Ви можете прийти сюди, щоб знайти що-небудь ви хотіли б, від речей, які виділяються для ігор, які я не бачив раніше. О, нічого собі, у нас є новий пінбол тут. Ви можете встановити їх прямо тут з магазину, і ми поговоримо про те, як розвивати ці. У вас є багато варіантів в тому, як ви їх створення. Ми будемо фокусуватися на історії JavaScript з HTML і CSS, але для користувача, перед покупцем програми, це не має значення те, що вона була написана дюйма Вони можуть йти вперед і працювати з ним. Я заінтригований цим, так що мені потрібно відкрити це і дивилися. Кожна програма, в тому числі ті, які ви можете представити і продати або віддати безкоштовно, все, що ви хочете зробити в магазині, отримає домашню сторінку, як це. Ви можете подати зі своєю заявою купа скріншотів - ви побачите деякі тут - відомості про програму, і з часом ви будете накопичувати як рейтинги - вони в основному просто зоряний рейтинг - та відгуки, які забезпечують трохи більше розуміння. Насправді, хтось повинен надрукувати що-небудь і розповість вам, як приголомшливо ви, і що увійде в Ваш Відгуки розділі сюди, що я не дивився на. Фантастика. "Не буде навіть відкрити." Як здорово. Ну, для людей, для яких це зробили відкрито і управляють, вони, здається, дійсно подобається. [Сміється] Майте це на увазі. Інтернет. Будь-яка людина може сказати, що вони хочуть з приводу вашої заяви. Тому переконайтеся, що ви робите велику роботу з ним, переконайтеся, що ви робите його максимально комфортним для користувача, як ви можете тому що вони пару кліків від надання відгук, і що буде накопичуватися до вашого загального рейтингу огляду. І ви хочете, щоб зробити все можливе, тому що ви збираєтеся грати проти інших додатків. Там будуть тисячі додатків вже в магазині, і швидше за все, там може бути щось, що робить ті ж функціональні можливості, що ви робите. Так що, якщо ви дійсно можете виділитися з натовпу, що відбувається, щоб бути у ваших інтересах, звичайно. 

Ми увійдемо в магазині трохи пізніше. Я дуже хочу, щоб зосередитися на створенні додатків. Але коротка версія магазину складає поширення в усьому світі, це автоматично частиною Windows 8, люди просто звільнити його і поглянути на різних додатків тут, у вас є плаття-Up наклейку книга і всі види різних додатків. Свіжа фарба, я використовую це багато - погано, але я використовую це багато. Це показує мені, що я вже його власником. Дозвольте мені показати вам те, що я ні - UVideos у мене немає, як новий. Ви бачите тут це безкоштовно, так що ви можете встановити його прямо з магазину. У вас є вибір теж. Ви можете, звичайно, віддавати її. Ви можете помістити рекламу в програми або гри. Ви також можете стягувати за неї плату, і ви могли дуже легко забезпечити випробування для програми, а так що ви можете дозволити людям спробувати його протягом тижня або все, що ви хочете зробити. Ось тільки настроюється через портал. Ви не писати ніякого коду для цього. Так ви говорите, "Ви можете використовувати це протягом тижня, а потім у вас є, щоб купити його," або ви могли б зробити щось на кшталт "Ви могли б грати перші 3 рівня цій грі », А потім ви повинні придбати для доступу до решти." Можна навіть зробити в додаток покупки, так що ви можете сказати, "У нас є додаткові пригоди або набори графіки або речі, які будуть розблоковані - "Більше рецептів, які розблоковані -. Якщо ви купуєте ці розширені набори" І ви можете зробити, що все в межах програми або самої гри. Так, повністю залежить від вас, ваш вибір. Там дуже багато речей, які ви можете зробити в магазині, а потім в основному ви представити його на канал сертифікації. Ми можемо говорити все про те, що трохи пізніше, але це мета. Ви хочете, щоб ваші програми по всьому світу видимість в магазині тут. 

Повернутися на екрані Пуск тут, я хотів би показати вам трохи більше. Якщо я запускаю ці програми, дозвольте мені дати вам приклад деяких функцій крос-додатків тут. Щоб зробити це, я буду запускати свіжою фарбою. Одна річ, ви побачите тут кожен біт екрану, всі пікселі на екрані, перейдіть до вашого додатком. Пішли в минуле ті дні, коли у вас є ці межі навколо вікон з великою кількістю кнопок, які завжди є займають простір весь час. Тепер ви дійсно хочете, щоб піти від цього і просто ваш контент буде в центрі уваги. Ми можемо зробити щось з Windows, шляхом доступу інших видів меню. Один з них насправді те, що називається бар принади, і він виходить з боку екрану. Ви дійсно можете Флік з боку, якщо у вас є сенсорний екран, Ви могли клацніть правою кнопкою миші, якщо у вас миша, є поєднання клавіш для нього, завжди є більше ніж один спосіб зробити щось у навколишньому середовищі тут. Це приносить ряд речей, які ви можете зробити. Найбільш очевидним є, ви можете повернутися на початковий екран, але інші 4 так звані принади. Вони являють собою контракти, можна підключити до як розробник програми. Вони досить прохолодно. Пошук, я впевнений, що те, що ви збираєтеся робити, обміну я покажу вам в секунду, та пристрої і настройки, все це речі, які ваш додаток може підключаються до використовувати Windows, щоб сказати: "Я зробив свою справу "І я хочу для Windows, щоб підтримувати деякі інші функції, », І я не хочу писати багато коду, щоб це відбулося." Це дійсно перевага використання цих можливостей. Дозвольте мені показати вам один. Щоб зробити це, я зроблю нову картину. Я також говорив про використання кожен піксель для вашої програми. За замовчуванням, це те, що фарба додаток виглядає, коли ви використовуєте його. Це дійсно просто про все, що ви малюєте, ваш контент. Я міг зробити жахливі речі тут. Що я повинен зробити? Я не знаю. Каракулі? О, відмінно. Я можу зробити каракулі. Фантастика. Індичка? [Сміється] Це найбільш абстрактні індички ви побачите. Я також можете викликати те, що називається бар додаток, і це дійсно один з ключових способів, які можна використовувати сховатися всі речі, які можна було б на вашому додатку або грі перед просто займають простір весь час. Так що тепер ви можете помістити його тут, і це дійсно один з найпрекрасніших вражень з панелі програми, які я бачив. Покладіть вибір тут для вибору різних кольорів. Ми хотіли індичку, тому ми будемо поставити деякі коричневий тут, почати змішування через пару кольорів. Ми візьмемо проміжний колір тут, а потім повернутися сюди. Ви можете почати малювати. Там твій індички. Фантастика. Я не вмію малювати з самого початку, але зробити це з сенсорною панеллю в передній частині аудиторії, навіть краще. Це є дивним. Ідея, однак, це все, що мене хвилює це прямо тут, на поверхні. Скажімо Я так задоволений цим, що я повинен поділитися нею з кимось. Звичайно те, що ви могли б зробити з іншими версіями Windows, ви б, може бути, зробити знімок екрана, ви могли б зробити деякі копіпаст вашого тексту або тому подібне, які ви хочете ділити, а потім піти і відкрити інший додаток і помістити його в неї. Тут вам не доведеться цього робити. Ви дійсно можете вивести бар принади і сказати: "Я хочу поділитися цим." У цей момент він збирається показати вам всі програми які знають, як працювати з будь-яким в даний час спільно. В даному випадку це картина, тому він збирається сказати: «Я бачу, у вас є знімок." "Ви хочете поділитися цим?" Ви можете бачити, що я по електронній пошті сам матеріал весь час. Він визнає, що, і це мене пропонуючи, що в якості ярлика, але це також показує мені все ок, що знає, як боротися з зйомкою і робити щось з ним. Вони все вказано в Windows, що вони можуть це зробити. У цей момент це Вікна. Користувач просто вибирає те, що вони хочуть зробити з ним. Я зроблю все звичайно з PuzzleTouch. Ви можете бачити, я створив всі види головоломок з плином часу. Я візьму PuzzleTouch і сказати: "Я хочу поділитися цією дивовижною створення з PuzzleTouch." Це буде йти вперед і сказати: "Відмінно. Ви хочете поділитися цим? Чудово». "Ви хочете, щоб зробити пазл, який легко, проміжний, що?" Я зроблю проміжний той тут. Це робить загадку. Це збирається бути жахливим головоломка, тому що це в основному порожнім. Але він готовий, і це насправді ще в іншому додатку. Якби я прийшов сюди, я можу шукати його і запустити його. Тепер, якщо ми виділіть на трохи тут, ми повинні побачити моє творіння десь. Де я? Які загадки я зробив? Хіба я зробити це легко? О, ось вона, прямо там. [Сміється] Це легко впізнавані індички головоломка, яка тут. Але, що я хочу вказати вам, здорово, що тут є додатків нічого один про одного не знають. Вони тільки сказав: "У мене є знімок, щоб розділити, і я знаю, як мати справу з фотографіями." І ви, як розробник, ви не повинні писати цей код. Коли хтось запитує мене поділитися, я збираюся поставити деякі дані в цій маленькій структури даних і я зробив. Інший додаток бере на себе, робить свою справу, і це кінець обміну досвідом. Це всього лише одна річ, яку ви можете зробити - дійсно, дуже потужний - і це буде одна з тих речей, які могли б реально допомогти диференціювати свій додаток а також ваша гра теж в магазині. Люди збираються, щоб мати можливість сказати: «Це дійсно корисно." "Я використовую цю Puzzle Creator весь час. Це просто фантастика". 

Це достатньо про з короткого огляду того, що тут відбувається. Там в пару інших особливостей також, що, може бути, ми виділимо, як ми йдемо через код. Але я хочу, щоб зануритися в слайдах, і щоб зробити це, я збираюся піти в Desktop, який сам по собі інший живий плитки тут. Я можу піти в це і, звичайно ж, я на слайдах, але дозвольте мені показати вам насправді, де ми знаходимося. Ми насправді в режимі Desktop. Це дійсно, де, що я говорив раніше про Windows, несучи вперед для нових вражень показує себе. Це Windows, ви знаєте. Програми для Windows називаються настільні додатки. Вони біжать сюди. Якщо у вас вже є додатки, і ви хочете запускати їх на Windows 8, Ви можете абсолютно зробити це. Це не одне й те саме в якості сховища додатків, які тут, як свіжою фарбою і цих NBC News додатків тощо. Ті, прийде з магазину. Вони можуть підключити до деяких з функцій, які я показував вам та інші, які я не показав вам, тільки поки. Але тільки майте це на увазі. У нас є підтримка обох цих речей. Мені дуже шкода. Щось не показує на екрані? Я втратив його повністю. Це дивно. Добре. Спасибі за вказівку на це. Те, що ви не були бачачи на деякий час це мій показуючи вам, що на робочому столі знаходиться тут. Що таке останнє, що ви бачили? Ви бачили це? Це робочий стіл. Ви вже знаєте, як це виглядає. Це нічого моторошно незвично. Це наша проведення такого досвіду вперед для вас і дозволяючи використовувати те, що ви мали. Наприклад, я буду показувати вам Visual Studio. Це настільний додаток. Це буде працювати в цьому режимі. Це буде підтримувати більш складні середовища з великою кількістю опцій тощо, так що робить його хорошим варіантом в якості настільного програми. 

Проте, давайте повернемося до слайдів для тільки трохи і дати вам деяке вступний вміст, а потім потрапити в справі кодування тут. Доброю новиною є те я чув, ви зосередилися на багато CSS і JavaScript, HTML. Всі ці речі, які ви так довго вчаться нести безпосередньо у створення Windows Store додатків. Те, що ви чули про із застосуванням CSS селектори і всі ті речі, саме те, що ви робите, щоб створити додаток тут для магазину. Ми підемо через ці речі по шматочках. В принципі, я будую на речі, які ви вже знайшли час, щоб вчитися. Це загальна схема технологій, які можна використовувати зробити програми для Windows 8. Матеріал праворуч, настільних додатків, дійсно те, що ми вже знаємо. Це речі, які насправді Windows 7 світ переноситься в Windows 8. Всі з цих варіантів просування вперед: C #, VB, Win32 вид розвитку. Великий. Немає проблем. Новий матеріал знаходиться на лівій стороні. Це Windows Store додатки, що, коли я хочу, щоб моя заява провідний в Windows 8 використовуючи всі ці можливості, отримати його в магазині, і отримати, що дійсно здорово досвід з додатків Windows Store. Щоб зробити це, ви можете подивитися тут у вас є всі ваші вибори з XAML, C + +, C #, VB, ви могли б зробити DirectX, тощо, речі, які виходять за рамки слайда. Але для нас, ми збираємося зосередитися прямо в на тому, що HTML, CSS, і JavaScript дійсно першокласний громадянин для прийняття заявки на Windows 8 і для Windows Store. Так що це добре для всіх тут і людей, що дивляться на відео тому що ви можете просто використовувати всі ті переживання, які у вас є і дійсно зв'язати в те, що пропонує Windows,. Ви збираєтеся зробити це через набір API-інтерфейсів, які не повинно дивувати. Кожен ОС має свої API. Ми викрити те, що ОС Windows може зробити через те, що називається WinRT. Це набір API-інтерфейсів, що просто робить все для вас. Якщо вам потрібно відкривати файли, вам потрібно використовувати камеру, геолокації, такі речі, як, що, вони йдуть через те, що ОС Windows може запропонувати вам. Щоб отримати доступ до, що, у нас є більше наявність що відбувається, щоб зробити його ще простіше для вас, щоб зробити це. Ми повернемося до цього трохи пізніше. Але на сьогоднішній день, це в основному ваша дорожня карта. Те, що ви вже робили зверху деяких API, що допоможе вам працювати з Windows, так само магазин додаток. І це дійсно все, що ви повинні знати, від високого рівня. 

Ми будемо занурюватися справді працює з матеріалом зараз. Те, що ви, мабуть, вже бачили купу, з IE9 деякий час тому ми ввели підтримку багато, в той час, нові стандарти в Web, так багато нових можливостей CSS, багато нового HTML, ECMAScript 5, який дійсно JavaScript. Так що все для цього суворого режиму за винятком був в IE9. Просто тонни матеріалу з CSS, CSS3, все там. І всі ці речі несе вперед в те, що ми робимо з Windows 8. Ви можете використовувати ці речі, і ви можете використовувати все, що нового в IE10. З IE10 введемо підтримку всі ці речі, а також. Вони всі з апаратним прискоренням, так що якщо ви на машині, яка має якусь GPU, що, ймовірно, в значній мірі кожна машина, що ви могли б отримати протягом останніх 8 років, ви збираєтеся бути в змозі мати апаратне прискорення виведення, візуального виведення з CSS, Canvas, SVG. Всі ці речі будуть проходити апаратного прискорення і, що набагато швидше і ефективніше. Коротка версія все це - я не збираюся йти через кожну річ тут - якщо ви бачите його в цьому списку, якщо ви можете зробити це в IE10, якщо це веб-додаток, який ви використовуєте, що працює в IE10, це те, що ви можете зробити, як додаток для Windows Store. І це значною мірою він. Так що, якщо він працює в IE10, він буде працювати в якості програми для Windows Store. Це на стіл, як те, що ви могли б використовувати. 

Там дуже багато тут. Ми не повинні до півночі, так що я не можу ознайомитися тут все. Але є деякі сайти, які допоможуть вам зрозуміти, що ці речі можуть зробити, і я покажу вам один з них в секунду. Я просто хотів би відзначити, деякі з ключових речей, які ви могли б дивитися на. Може бути, ви вже бачили деякі з них у своїх дослідженнях, але вони дійсно корисні, зокрема, з Windows Store додатків, від CSS стороні. Крім того, можливість робити перетворення і переходи, забезпечити рух з анімацією - вони є частиною CSS зараз, і всі вони підтримуються сучасними браузерами, і IE10 і IE9 додали підтримку в часі для всіх цих речей. І так навіщо писати це самостійно, тому пройти через всі неприємності робити ці речі вручну коли ви могли б використовувати простий CSS перетворення для створення 3D-ефекту для вашої програми? Великий. Ось як це працює. Я не можу зробити це складніше, ніж це. Якщо ви знаєте, як це зробити в CSS, ви знаєте, як це зробити в додатку для Windows Store. 

Вихід за межі, що для розмітки, такі речі, як навіть у магазині додатка, але вихід за межі, що, дивлячись на, може бути, прес-додаток, який показує вам статті або рецепти або тому подібне, ці інші види особливостей в CSS дійсно корисні: Сітка, Flexbox, CSS Регіони, швидше, досить нового стандарту, а також. Ці речі все збираємося, щоб допомогти вам викласти вміст і вміст між секціями текти, бути в змозі зробити розбиття на сторінки і переносів без необхідності писати матеріал самостійно. Ви просто говорите: "Будь ласка, виконайте такі дії для мене", і як екран нерухомості відрізняється на різних машинах або як ви побачите в один момент, як ви клацаєте заявку мати меншу кількість простору на екрані, це не проблема для CSS. Він може скористатися - Ми зробимо розмови про ЗМІ запитів в секунду - він може піклуватися про речі з репозиціонування своє утримання, поточний контент з регіонів просто з цими речами, які ви, можливо, вже бачили з веб-технології. 

На боці HTML5, є також купа речей що буде дуже корисно для вас з Windows Store додатків. Знову ж, ми не будемо пройти через все це, але вони просто тут. Так що якщо ви повинні використовувати його, аудіо-відео, якщо ви хочете зробити перевірку від форм, геолокації, все, що ви можете зробити в JavaScript з JavaScript 5 або ECMAScript 5, IndexedDB для локального зберігання даних - все це варіанти для Вас. Якщо ви шукаєте відповідь, просто подивіться на існуючих технологій з HTML5 і CSS і ви знайдете легше відповідей, ніж того, щоб згорнути багато того матеріалу самостійно. Дозвольте мені показати вам навколо трохи тут. У мене є сайт, ми можемо піти. Дозвольте мені потрібно вийти з цього слайда на секунду. 

Якщо ми виходимо в IETestDrive.com, Я не буду робити багато демо тут. IETestDrive.com дійсно показує вам багато, що нового в IE10, речі, які ви можете зробити. Я вважаю, що це дійсно корисно, тому що замість читання через купу офіційних документів, розглянемо декілька демо, і це допоможе вам поставити його на свій особистий радара о, чи має це технологія сенсу навіть робити які-небудь додаткові дослідження з так ви зрозумієте, "Я бачу, що це для". "Я розумію, що запит кадр анімації робить для мене." "Я розумію, як я міг би використовувати Регіони або SVG фільтри." Ви бачите їх у дії, побачити їх на прикладі тут, і вирішити для себе, якщо це буде корисно для вас у ваших власних проектах та за її межами як ви будете продовжувати працювати з веб-технології. Тут я б просто закликаю вас поглянути. Я не думаю, що буду проводити багато часу насправді працює це. У нас є достатньо, щоб показати з написання коду. Ви побачите тут речі з сенсорних ефектів в іграх доторкнутися основі в цьому розділі, анімація, дуже швидко апаратне прискорення анімації там, деякі оптимізації, які ви побачите в деяких з цих зразків, а, і є багато, багато інших. Якщо ви йдете сюди і відкрити карту сайту, там просто смішно кількість зразків тут. Ви можете побачити їх все тут. Якщо ви дивитеся на щось, або ви чули про щось і вам цікаво, може бути, це буде щось здорово використовувати в додатку, спробуйте звернутися тут, і там, напевно, досить добре демо для того, щоб заощадити час. 

Добре? Будь-які питання досі для людей тут? Добре. Ми будемо вести тут. Знову ж, перевірити це. Вони веб-стандарти, так що йти на будь-які інші сайти вітрини яких ви знаєте і подивитися, якщо ці технології мають сенс для того, що ви намагаєтеся зробити. 

Назад до слайдів. Тим не менш, ви рухаєтеся з веб-світу, щоб дійсно встановленої світі місцеве застосування, так що є деякі речі, щоб відзначити тут,. Перш за все, немає веб-сервер бере участь тут. Там немає Apache, немає IIS працює тут обслуговує до сторінки на віддаленому клієнті, на віддалений агент браузера. У цьому випадку, дійсно все упаковано для вас. Ви уявити, що у вашому додатку в магазин, він отримує сертифікацію, це в магазині, а потім люди тисячами буде встановити гру або ваш додаток. Але в принципі, вони потягнувши її вниз локально на свій комп'ютер. Там немає необхідності виходити в Мережу більше, якщо у вас немає виклики, що вимагають віддаленого API, і це абсолютно нормально, а також. Але вони не збираються бути в цьому режимі, де вони повинні піти відповідь на запит з сервера щоб отримати наступну сторінку їх зміст. Так що сказав, є кілька незначних відмінностей API. Це неймовірно незначні. Вони навряд чи потрапив вам у вашій нормальної кодування, але вони, принаймні документально. Вони свого роду крайні випадки є. 

Інша річ, варто відзначити, є відмінності довіру. Я тільки говорю про це, тому що я просто хочу, щоб переконатися, що я сказав, що це так що якщо ви зіткнетеся з нею пізніше, ви будете думати ", сказав щось про це Кріс, "Так що, можливо, та й добре", а потім повернутися назад і з'ясувати, що це було. Контексти має значення. За замовчуванням ми намагаємося захистити користувача від векторів атаки. Є певні речі, які ви можете зробити за замовчуванням і деякі речі, які потрібно змінити контекст для того, щоб. Як ви використовуєте деякі бібліотеки там - you've вже працює з JQuery, але якщо ви подивитеся на інших бібліотек там - ви могли б використовувати деякі функції такого роду виходить за рамки локального використання, робить більш динамічні взаємодії Запити XHR, тощо. Іноді ви можете знайти тих, буде відключена за замовчуванням, і в цьому випадку, просто виконайте пошук, шукати місцевих і веб контексті, і ви дізнаєтеся, як виправити це. Просто переконайтеся, що ви знали про те, що, коли ви почнете використовувати інші механізми, який, я повинен згадати, що ти прекрасно в змозі зробити. Так що, якщо Ви знайшли інші рамки - Ми зробимо говорити про це через секунду - для ігор, і ви хочете використовувати, що, ви хочете використовувати деякі бібліотеки управління, які там і ви не хочете написати, що матеріал самостійно - це гарна ідея, чи не так? - Ви можете абсолютно використовувати цей матеріал. Там немає нічого вас стримує від використання будь-якої бібліотеці, в основу JavaScript, CSS, HTML5. Знову ж, якщо це те, що ви можете зробити в IE10, який є біса багато в ці дні, Ви можете зробити це. Витягніть його у вашому додатку, посилання, бібліотека JavaScript, і використовувати його в своєму додатку, просто маючи на увазі, ви, можливо, вдарив контекст безпеки раз в той час - не дуже часто. 

А потім особливості, ми розглянемо ще декілька з тих, як ми йдемо. UX ви почасти звикаєте до, як ви все більше і більше додатків від Windows Store. Ви отримуєте відчути, як вони працюють і як правило дизайн естетичне працювати в різних додатках і те, що люди будуть використовувати для переживає. Це дійсно важлива частина. Переконайтеся в тому, що, коли вони запустити свій додаток їм не потрібно читати керівництво, які вони ніколи не роблять, до речі. Вони просто повинні бути в змозі почати грати з додатком і з'ясувати це без особливих труднощів. Дотримуючись і дотримуючись багато з цих методів, ви збираєтеся зробити своїм користувачам велику послугу, що робить, що простіше. 

Добре. І останнє, що на боці API, а потім ми отримаємо справді написання коду. WinJS в тому, що річ, яку я згадав дуже коротко з цією складною слайда з усіма цими різними варіантами, що у вас є для подачі заявок. WinJS, ви можете думати про це як приятелем. Це ваш друг, щоб допомогти вам написати матеріал швидше. Це просто JavaScript і CSS. Ви не повинні використовувати його. Ви можете використовувати його. Якщо ви збираєтеся дзвонити в з особливостями ОС Windows, ви в кінцевому підсумку використовувати його, але якщо є такі речі, як деяких шаблонів проектування або управління, які ви дійсно не хочете використовувати, Ви хочете використовувати щось ще, це залежить від вас. Вирішіть, що ви хочете використовувати і стилі, які ви хочете використовувати. Особливості від простору імен і класу покоління - залежить від вас. Якщо ви віддаєте перевагу один або інший, це повністю ваш вибір. Він як і раніше JavaScript і CSS. Але це буде, щоб допомогти вам зробити багато речей. Наприклад, ось частина того, що він може зробити, речі, як допомагаючи асинхронне програмування з обіцянками. Будь-який з вас чули або працював з Node.js? Це загальна картина для роботи з асинхронного програмування. Тому в основному те, що ви говорите, "Іди зробити щось, »І ви збираєтеся дати мені обіцянку, що ви будете повертатися до мене, коли ви закінчите." Це істотно, що відбувається. Так що вам не замерзають додатки, коли користувач збирається і вибрати файл або щось в даний час текли з Інтернету. Інтерфейс користувача залишається працездатним. І ви можете зробити це за допомогою асинхронного програмування. Це звучить смішно складним, але це дійсно просто тому, що ви використовуєте обіцянки і ви тільки що сказали: "Іди зробити це, і коли ви закінчите, передзвонити цьому методу." Це досить багато його. От і все, вбудований в WinJS. Це збирається зробити це набагато легше писати дійсно гнучкі і потужні програми. 

Ви можете побачити інші тут, багато анімації. Ймовірно, це один з найбільш важливих речей, на цьому слайді елементи управління. Я думаю, що у мене є ціле - так, я роблю. Ось приклад того, деякі елементи управління, які можна використовувати в своїх додатках. Це все прямо з WinJS. Ви не пишу ці себе, Ви тільки що сказали, "От як я хочу, щоб скласти свою заяву." "Я буду використовувати вид фліп, щоб я міг піти між різними картинками." Я не показав вам Semantic Zoom. Я покажу вам, що в секунду. ListViews. Там в GridViews. Ви вже бачили сітку як частина магазину додатки, тому можливість використовувати блоки контенту і прокрутки через що. Спливаючих меню ви побачите час від часу. Бар додаток, який я показав вам, що свіжий нанесення фарби, а також, так що ви бачили, як ви можете налаштувати, що, поставивши кнопки на ньому і має, що сховатися, коли ви не дбаєте, щоб використовувати це. Це дійсно повністю залежить від вас, щоб використовувати. Це все елементи управління, які є частиною WinJS. Я покажу вам, як зробити це через секунду, але є більше, ніж просто це, і головним є те, використовувати їх, якщо ви хочете, заощадити час. 

Якщо у вас є інші бібліотеки управління, які ви хотіли б використовувати, це прекрасно також. Такі речі, як JQuery UI зробити багато такого роду ідеї, а, надаючи більше контролю, які розширюють що ви можете зробити в HTML і JavaScript. Давайте заглибимося дюйма Я вже говорив, що. Використовуйте те, що ви хотіли б. Просто майте на увазі, що ви можете зіткнутися з деякими проблемами контексту. Але можна, звичайно, змішувати і поєднувати будь-який вид бібліотек Вас влаштовує, Ви хочете дізнатися, ви хочете використовувати, щоб заощадити час. 

Давайте поговоримо про інструменти на секунду. Ви можете отримати те, що вам потрібно, щоб почати працювати з Windows Store додатків. Якщо я повернуся, я занадто багато речей тут. Якщо ви йдете на цю сторінку, яка dev.windows.com, ви можете завантажити все, що потрібно. Як студенти, у вас є доступ до більш ніж широка громадськість робить, так що ви можете отримати більш високого рівня версії Visual Studio. Едвін згадувалося ви вже можете отримати Windows, а також. Але в цілому, для всіх розробників, ви можете піти на цей сайт і завантажити все, що потрібно, щоб зробити заяву, і все це безкоштовно. Так що є безкоштовна версія Visual Studio, Є деякі інструменти, які будуть встановлені поруч з, що - все, що потрібно для створення та тестування програми. Це тільки тоді, коли ви збираєтеся опублікувати свій додаток до магазину що ви будете потребувати облікового запису розробника. Це теж я вважаю, це безкоштовно. Це безкоштовно для студентів, а? >> [Гуарін] Який? Обліковий запис розробника, фактичне підпорядкування. >> [Гуарін] Так. Це ще одна хороша новина. Ви подивіться на це. Це буде сказати, для людини за замовчуванням це $ 49. Але не підписатися на що, будучи студентом. Ми отримаємо деяку інформацію через ваші програми, які можна отримати обліковий запис безкоштовно, і що дозволить вам потім представити свої додатки аж до магазину, стільки, скільки вам подобається, і все, що добра незабаром підуть. Так от dev.windows.com. Ви можете завантажити інструменти, які можуть знадобитися звідси. І якщо ви хочете, ви можете отримати пробну версію Windows, тут, але знову ж, ви не повинні будете. 

Інший сайт - дозвольте мені відзначити цей для вас швидко - це design.windows.com. Це було dev.windows.com. Design.windows.com, ви можете здогадатися, для чого він потрібен. Це насправді досить дружній сайт. Там дуже багато хорошої інформації тут. Ви можете працювати через нього. Це відбувається, щоб дати вам кілька порад про деякі речі що, можливо, ви не думали про до або мав справу з перш, як проектування для дотику, проектування для різних форм-факторів, проектування для можливостей Windows 8, то, що я вже говорив як пошук і обмін, деякі речі, які я не говорив про ще. Вони всі перераховані тут, і це досить хороший набір корисних сторінок файлів , Яка допоможе вам зрозуміти, як зробити певний вид застосування, як зробити взаємодію, як боротися з призначеним для користувача інтерфейсом і UX вашої програми. Я рекомендую вам поглянути на це, особливо якщо ви в якийсь момент сподіваючись опублікувати додаток в магазин. Ви збираєтеся хочете знати, як зробити хорошу заявку тому що я вже говорив, якщо ви цього не зробите, є ті відгуки знову. Люди збираються, щоб бути нещасним. Вони не зможуть знайти те, що вони очікують в потрібних місцях. Ніхто не хоче, щоб це сталося з вами. 

Забігаючи вперед тут, дозвольте мені закрити, що вниз. Тепер, коли ви знаєте, де отримати речі, я покажу вам, як насправді почати використовувати матеріал. Для початку я насправді показати вам тут приклад настільних додатків на моєму екрані Пуск. Тут ви можете побачити Visual Studio, ви можете побачити суміш і інші інструменти розробника, що у мене є. Вони мають трохи інший плитки. Це тому, що вони настільні додатки, і в тих випадках, вони все збирається запустити назад в моєму робочому столі дійсно як додатки, які ви звикли. Так досвід для Windows, це одне і те ж. Вони не є, наприклад, як озброєний! або ці речі. Дозвольте мені запустити один швидко. Насправді, ось цікавим. Це був розроблений студентів, що працюють у партнерстві на NERD. Додаток в повноекранному режимі, ці види досвіду тут. О, хороші вирізати екрани і всі види прикольних речей. Вони розробили цей. Ми могли б також показати все це в той час як ми на це. Насправді, я працював з ними трохи, дав їм кілька порад про речі тому що вони робили наявність їх застосування. Будь ласка, я не беру до їх роботи, вони зробили всю роботу. Я просто дав їм трохи рад тут і там, але вони зробили деякі великі речі за допомогою передній кінець JavaScript і пов'язуючи в деяких фізичних системах і речей, щоб зробити багато цієї роботи. Перейти. Давайте подивимося, якщо це працює. Нічого собі, це все ще працювало. Гаразд, добре. Але ви зрозуміли ідею. Повний екран додаток, дійсно гарне враження. Це надає підтримку не тільки миша і ручку, якщо у мене є такі речі, як, що, а й доторкнутися. Якби я був сенсорний екран, я міг би просто звернути на нього і продовжувати працювати з цим. 

Одна річ, я не показував, і причина, чому я приношу це вгору це я хотів би мати інший додаток, щоб показати вам, що ви можете зробити, Ви можете насправді взяти додатків в ОС Windows і перетягнути їх в бік екрану. Це називається прив'язки програми. У цьому випадку, я взяв Inkarus і я додав його в сторону тут. В даний час в Прив'язати зору, і що дозволяє мені робити щось ще в той час, що застосування є. Більшість ігор ви знайдете буде просто пауза. Це звичайно пристойна, що потрібно зробити, якщо ваша гра не може якимось чином зменшувати до того, що маленький з резолюції, як, можливо, якийсь настільні ігри або тому подібне з нагоди. Але в цілому, найпростіше зробити, і найбільш підходящим, що потрібно зробити для ігор є призупинення роботи програми. Для додатків, таких як новинні програми, якщо я запускаю цей і тоді я прив'язати його, ви побачите, що насправді суттєво змінює в тому, як це подання даних для вас. Тут він показує вам справді більш вертикальне панорамування, що інформація, але я все ще можу абсолютно використовувати додаток. Так що це ще дуже корисно. Той факт, що це в меншій зору не втримати мене від використання цього додатка. Так що подумайте про це. Це те, що вам потрібно мати ваші програми зробити в деякій мірі, але це до вас, щоб визначити, як функціональна ваші додатки повинні бути в такому меншою середовища. Дозвольте мені закрити цю одну вниз і повернутися в той, де ми були тут. 

Едвін, ви додали фотографію мене вже? >> [Гуарін] Так. >> [Боуен] Подивіться на це. Бачиш? Едвін додав фотографію. [Сміється] 

Давайте повернемося сюди в Visual Studio. Дозвольте мені почати це для вас. Я міг би натиснув на плитці на цьому екрані Пуск. Це повернуло мене в режим Desktop, і це запускає настільний додаток з Visual Studio. Це вікна, які ви вже знаєте. Я можу йти вперед і створити проект тут. Ми знову зосередитися на JavaScript, HTML. Я збираюся вийти і вибрати тут під JavaScript, Windows Store. Там в ряд шаблонів, які можна використовувати. Для продуктивності, я б порекомендував вам поглянути на деякі з цих інших тут як грід і Спліті. Вони дійсно корисні, якщо ви робите заявку що буде мати такий дизайн і навігація. Ви побачите ці багато. Той, який я тільки що показав вам насправді екземпляром грід-додатки. Так що якщо ви думаєте, що ви збираєтеся робити на прес-додаток або RSS Reader або щось в цьому роді, що має справу з безліччю записів, для яких ви хотіли б показати деталі, думаю про використання одного з цих шаблонів для швидкого початку і налаштування його звідти. Але тільки так я можу показати вам всі рухомі частини тут Я збираюся створити порожній додаток, а потім ми підемо трохи глибше в деталі. Я просто зробити це пусте заяву тут. Це збирається створити цілий проект для мене. Я відкрию речі, які я хочу показати вам, за замовчуванням. Дозвольте мені тільки збільшити трохи, щоб показати вам, що створив для нас тут. Те, що ви збираєтеся дивитися на перший все по імені за замовчуванням. Так що ви збираєтеся шукати default.html, default.js і default.css. Крім того, необхідно відзначити, є те, що у нас вже є посилання на те, що я вже говорив. Це WinJS. Ніхто насправді не називає це таким довге ім'я тут. Це WinJS, Бібліотека Вікна для JavaScript. Якщо ви відкриєте його, ви можете побачити все це тут. Там в різні файли CSS, є JavaScript. Це там, щоб допомогти вам. Це дійсно там, щоб забезпечити контроль і стилі і речі, які ви можете просто використовувати автоматично. Але знову ж, якщо є речі, які ви хочете використовувати замість з точки зору стилю та інших елементів управління, це повністю залежить від вас. Я покажу вам, як використовувати пару з тих речей, прямо зараз. 

Повернутися на на нашому лівого боку, дозвольте мені показати вам сторінку за замовчуванням HTML. Ви вже бачили речі WinJS, і це дійсно все, що там відбувається з тих середні лінії розмітки, просто приносячи в CSS за замовчуванням і приведення в пару файлів JavaScript з WinJS. Вам не потрібно бути майстром, що відбувається всередині цих файлів. Це досить цікаво поглянути на них, щоб частково розглянути те, що відбувається в там тому що є досить цікаві проміжні та передові методи, що відбуваються в там, але хороша річ, як розробників, ви можете просто скористатися ними, просто використовувати їх і насправді не доведеться турбуватися про це. Ви все ще можете водити машину, не знаючи, як це працює, чи не так? Так ось така річ, що тут відбувається. Там в органи управління і стилі і речі, які ви можете просто йти вперед і використовувати і код, який можна використовувати в секунду, не знаючи, що там. Ось ваші власні файли. Це ваші місця, які ви можете змінювати свій власний CSS і ваш власний JavaScript, щоб речі прокатки. Ви будете додавати звичайно інші файли JavaScript і, можливо, інші файли CSS як ваш проект росте, але це дійсно всього лише відправна точка. Ось Привіт, світ еквівалент HTML, так що ми ще в тіло тега. У верхній частині, до речі, це тип документа HTML5, так ви зрозумієте, що від того, що ви працювали на. Там повно IntelliSense тут, так що, якщо ви робите речі, як типу у відео тега і розширити, що, ви, напевно, дізналися про те, що вам потрібно зробити, резервний кодування для відео тегів в HTML5 - або, може бути у вас є - для того, щоб різні браузери мають підтримку відео. У нас є такі речі через HTML, через JavaScript, через CSS. Ось вбудована, і я покажу вам CSS в секунду. Тут Ви можете піти далі і почати змінювати код, розмітку. Насправді, перш ніж я нічого змінювати, я збираюся запустити це і показати вам, що ви отримуєте. Ви збираєтеся отримати заставку, які ви можете налаштувати і тоді ви отримаєте Hello, World враження тут. Це просто фантастика, чи не так? Йдемо далі і корабель, який, вірно? Вміст йде тут. Це основна річ. Це буде тільки краще звідти. Ми підемо далі і додати в деякі речі. У мене є трохи розмітки я збираюся копіювати сюди тільки так ви не повинні дивитися на мене друкувати. Відпусти мене виховувати інструментів тут, і я буду покладати це, тому що я буду робити це кілька разів. Ящик для інструменту, якщо ви ще не бачили Visual Studio, де ви збираєтеся знайти купу управління. Ви також можете помістити фрагменти коду в нього, що ви можете використовувати. Тут я просто поп в деяких інших HTML, нічого страшно передових взагалі тут. Це тільки основні HTML кажу, що я є вхід, де я можу ввести, У мене є кнопка, де я можу уявити його, а потім у мене є DIV, що по суті заповнювачем що я можу використовувати для виведення на "Привіт, ви друкую це." Це введення в HTML наприклад. Якщо я запускаю це, ми автоматично отримуємо HTML, але ми також автоматично отримуєте стиль. Це одна з важливих речей, від WinJS. Це збирається дати вам за замовчуванням деякі виглядати і відчувати себе, що дійсно відповідає з іншою частиною, що Windows 8 робить. Тут ви бачите такі речі, як кнопки. Кнопка за умовчанням в HTML не схожий, але він робить тут тому що це стає, що CSS право з цього CSS файлу в WinJS. Якщо ви хочете використовувати щось ще, якщо ви хочете, щоб змінити це, абсолютно нормально, йти вперед і робити те, що ви хотіли б. Але це за замовчуванням. Це збирається бути більш знайомі користувачам. І, звичайно, це не буде нічого робити, тому що я насправді не з'єднувати будь-який код у відповідь на це. Це було просто HTML. Так що я можу позбутися цього, і ми повернемося в наш додаток. 

Дозвольте мені перейти на наших default.js. Це виглядає досить складною, але вона просто робить кілька речей для вас. Це шаблонний. Це збирається бути таким же, у всіх ваших проектів. Єдине, це проробляється тільки частково запитувати: "Як я сюди потрапив?" і каже: «Ви запуску цього додатка в перший раз?" "Ви відновлення додаток від необхідності це буде припинений?" Пару таких речах. Дійсно, в центрі нашої уваги на цей файл тут правий щодо тут. У цей момент, це один рядок коду дуже важливо. Це насправді збирається піти і подивитися всі розмітці, і він збирається, щоб знайти речі, які ви просили, щоб перетворилися на елементи управління, глибокі елементи управління, як в рейтингового контролю, як у вигляді сітки, як спливаючому вікні і ці інші речі, які я показав вам на цьому слайді раніше. Вони не рідні управління HTML. Ви тільки не кажіть спливаюче як елемент і він знає, що робити. Те, що ми насправді це те ж саме, що відбувається в інших видах рамках контролю. JQuery UI робить той же самий вид загального підходу. Ви можете використовувати маркування в HTML, а потім деякі JavaScript приходить через пізніше і каже, "О, я знаю, що це таке. Те просить, щоб це перетворити в цій речі," який є одним більш виразним HTML, щоб зробити як елемент управління оцінкою, що і я покажу вам прямо зараз. Цей рядок коду є обіцянка, що каже: "Коли це обіцянка виконана, "Все, що ви просили потім був створений." І це все. Це виглядає трохи комплекс, але це дійсно те ж саме в кожному проекті. Тут, внизу, де ви можете почати додавати в те, що ви хочете, щоб відбулося, тому ми повернемося до цього в секунду. 

Перш за все, мені потрібно трохи коду, який може реагувати на те, що хтось натиснув на кнопку. Я збираюся йти вперед і покласти, що в тут. Знову ж, я не збираюся робити які-небудь друкувати перед вами тут. Дуже простий JavaScript просто кажу, коли це називається ми збираємося бути надані деякі подробиці про те, як ми отримали тут а потім ми збираємося зробити кілька основних речей. Перейти знайти річ в моєму HTML-сторінки, імені nameInput, схопити його, зайняти своє значення, ляпанця "привіт" на перед ним, і дотримуватися, що результуюча рядок в цю сну тега, який ми мали до цього дійсно не було нічого колись. Тепер ми збираємося, щоб знайти цей тег і зробити його внутрішній зміст дорівнює цього рядка. Дуже простий JavaScript. Сподіваюся ви визнаючи, що є насправді нічого незвичайного тут відбувається. Це просто прямо вгору HTML і JS тут. Якщо я запускаю це зараз, це як і раніше не збирається виконувати будь-яку роботу, тому що я не підключений його щоб отримати подія. Щоб зробити це, я зроблю це прямо тут, знову ж таки повертаючись до моєї панелі інструментів, з'являються його тут. Я очікую, що ви бачили все такого роду речі раніше, тому я не буду більше-це пояснити. Тепер ми збираємося йти отримати helloButton. Ми збираємося сказати, "Button, привітання." "Ось це подія, яку ви зараз реагують на." "Коли користувач натискає на вас, викликати цю функцію, то buttonClickHandler." І ось, що функція, яку ми тільки що додали прямо вниз, на дно там. Ось і все. Так що тепер у нас є дивно функціонального додатки. Я думаю, що ви будете дійсно вражений цим. Кріс. Чекати його. Нічого собі. Добре. Це дивно. [Сміється] Але є ще дещо. Не купуйте ще. Зачекайте. 

Дозвольте мені показати вам трохи більше тут і вийти з повного екрану. Ми збираємося йти до запуску. Дозвольте мені піти і на самому ділі показати вам трохи з CSS. Просто за замовчуванням, якщо ми оглянемося на сторінці тут, всякий раз, коли ми зупинилися в цих речах від WinJS, і ми отримали UI-темний, насправді, ви можете змінити його за замовчуванням для використання світла додатки. щ-темно, що добре для графічних додатків, таких як, використовуючи багато фотографій, Ви показуєте багато візуального контенту. Якщо ви показуєте багато текстового контенту, щ-світло, як правило, хороший вибір. Ви не повинні вибирати його, але я перейшов до нього і тепер ви бачите ту ж розмітку, же все, це просто, використовуючи в основному перевернуту схему тут де все робить його чорний текст на білому тлі. Це все добре. Дозвольте мені вийти тут, і давайте насправді трохи більше за допомогою CSS. Я поклав його назад на темряві, тому що я думаю, що це, ймовірно, легше побачити на екрані коли я починаю робити ці речі. Я збираюся замінити організму ще раз. Я піду тут. Дозвольте мені скинути атомну бомбу це. Наведемо в організмі з класами. Я вважаю, що ви зробили основні селектори з CSS і такі речі, як, що вже, так що ви, напевно, знаєте, що відбувається тут. Просто присвоєння деякі класи в нашому заголовку, і ми створюємо новий DIV обернути решту цього матеріалу, що тепер ми можемо використовувати, щоб стиль все разом. Так що я можу зараз зробити, це перейти до нашої замовчуванням CSS. Ви дивилися на запити засобів масової інформації ще? Ви говорили про те, що на всіх? ЗМІ запитів є частиною цього виходить тенденції - або це усталена тенденція в даний час фактично в Інтернеті - для гнучкої конструкції або адаптивних, і ідея в тому, що ваші програми можуть дійсно пристосуватися належним чином основі того, що пристрій, який вони показували на може зробити. Так що якщо ви на мобільному пристрої, очевидно, ви не збираєтеся мати стільки екрану нерухомості як ви будете на великому 30-дюймовому моніторі, сидячи з робочого столу, велика ПК так. Так старий відповідь на це питання буде мати 5, 6 різних версій одній сторінці і ви б відкрити версію, яка була налаштована для цього певного розміру екрана. Не дуже. Це дуже, дуже повторним і є тонна обслуговування, щоб зробити це. Тепер у нас є те, що називається CSS запити ЗМІ, і ми можемо використовувати це для автоматичного визначення, коли є певні розміри або деякі види використання вашого контенту може бути виконано. Так що ви можете відповісти на це, і ви можете сказати: "Добре, в цьому випадку "Ви, ймовірно, навіть не потрібно, щоб я сказав вам, що тут відбувається." Це просто кажу, якщо цей додаток прив'язується, як я показав вам, перш ніж - хапаючи його і покласти його в бік екрану - то давайте зробимо наступний стиль. Стилізація йде не тільки про квіти і все в такому дусі. Це також про розмірів і полів і відступів і орієнтацій змісту або навіть включити або відключити цілі частини вашої сторінки і, в цьому випадку, ваш додаток або ваша гра також. Так ось що ви можете зробити так само просто, як ви хочете. Це не було б корисно в ваших додатках, але це демо час, так що я збираюся йти вперед і просто додати в основний селектор тіла і сказати, "Коли я відрізав, давайте йти вперед і робити колір фону і давайте щось вибрати." У вас є IntelliSense тут. Насправді це дійсно здорово. У 2012 ми додали багато речей для підтримки CSS і JavaScript і HTML. Ви, звичайно, є що розкривається IntelliSense теж, але це не круто. Відмінна річ, у вас є візуальні селектори для багатьох речей. Таким чином, можна пройти і просто вибрати колір, або ви можете вийти і бути ще більш конкретним, і ви можете вибрати - це буде жахливо. Я насправді вибрати гідний колір тут. Дивитися розмітку занадто, до речі. Це ваш стандартний формат RGB там. Але якби я перейти непрозорість, він збирається перейти на селектор альфа-каналу тут. Таким чином, ви можете бачити, що, колір з суті відсотків прозорості, що у вас є для цього всі запечений прямо там. Я збираюся тримати його за 100%, а потім, коли я закінчу з цим, все добре, і добре. Тепер, якщо я запустити додаток, і ми беремо додаток і ми прив'язати його, що колір фону в даний час регулюється автоматично тільки тому, що у нас є деякі CSS, який говорить: "Іди зробити це." Ви також можете написати наявність також, що буде робити те ж саме або що ви могли б використовувати, щоб фактично призупинити гру, робити речі, як, що. Це, напевно, коли ви будете використовувати JavaScript. Ви б вимкнути ігровий цикл в цій точці. Ви повинні були б деякі наявність тому, що не було б те, що ви б CSS для. Але майте на увазі, що це просто подія. Можна сказати, "Коли мій зміні розмірів вікна програми, "Давайте подивимося, якщо ми різко". І це все. 

Добре? Я говорив багато. Є питання до цих пір від того, де ми знаходимося? Так. [Студент] Чи підручник для тих, хто отримати додаткову інформацію? >> Так. Питання в тому, чи є підручник для цього? Я просто поширити його на все. Є кілька речей, які ви можете піти. Давайте насправді вибратися звідси. Дозвольте мені повернутися сюди. Єдине, що слід відзначити, це саме по собі Visual Studio має підручники вбудовані Дозвольте мені позбавитися від цього. Якщо ви йдете і створити новий проект, що не файлу, Новий проект, і подивіться на лівій стороні, є онлайн вузол в цьому селекторі. Це займе небагато. Я на своєму MyFi тут. Але це буде придумати, і це дасть мені шанс знайти шаблони але і, що більш важливо, зразки, а також. Так що я можу натиснути на JavaScript. Це збирається знайти зразки для мене. Моє рішення є способом високого тут. Як правило, ви побачите список багато різних речей тут. Якщо є щось, що ви хочете спробувати, вибрати мову, JavaScript тут, і сказати: "Я не знаю, як це зробити геолокації." "Я не знаю, як відкрити файл." "Я не знаю, як скористатися веб-камери "Або оптимізувати для сенсорного або тому подібне." Є зразки для всього: обмін, пошук, додаток барів, роблячи віддалені виклики до служби, кодування JSON. Всі ці види речей є зразки для тут, і вони не величезні вибірки, які збираються у вас всю ніч, щоб розтягнути просто знайти, що одна річ, ви хотіли дізнатися. Вони дійсно хороші. Вони маленькі, прямо до справи видів зразків. Я дізнався тонну, проходячи через них себе, і тому я рекомендую, що багато як одна річ. 

Інша річ, щоб відзначити, теж, звичайно, я показав вам dev.windows.com, так що якщо ви повернетеся до того, що ви побачите на дні є також зразки тут. Таким чином, ви можете завантажити всі з них відразу, але є також багато інших ресурсів тут , Які можуть допомогти вам отримати до швидкості. 

Ще одна річ, і я дійсно рекомендую вам спробувати це, У мене вона є в моєму блозі, але я просто йти прямо до нього. Я покажу вам. Мій блог має ресурси тощо. Одна з речей, щоб вказати на це прямо тут, ця річ: твоя ідея. Ваш App. 30 днів. Якщо ви натиснете на це, він збирається привести вас до дійсно попереджувальним сайті. Це набагато більш корисним, ніж ви могли б очікувати. Це буде 30 днів утримання, яке ви можете в основному отримати поради та рекомендації протягом усього цього процесу, ви створюєте додаток. І, як ви не можете очікувати, ви можете фактично отримати його для ігор теж і телефонних додатків, тощо. Тому в основному зареєструватися в ньому, і вони збираються відправляти вам поради та рекомендації щодо, "Чи думали ви про це? Підтримуєте Ви Прив'язати?" "Ось кілька рекомендацій про те, як зробити це добре." "Чи замислювалися Ви про подачу в магазин?" "Чи замислювалися Ви про те, як ви збираєтеся продавати свій додаток?" Це буде йти через всі ці різні речі. А насправді, якщо ви знаходитесь на ігровому треку, в якийсь момент Ви почнете визнаючи людину, що говорить з вами тому що я насправді повинен був піти в Redmint робити ті й записані 2 відео там. Але це все частина ігрової доріжки, і є також повний трек для загального розвитку програми. Це називається Покоління App. Я точно рекомендував би, щоб до вас також на додаток до зразків. 

Там дуже багато відео на сайті під назвою Channel 9, а також. Це, ймовірно, останнє, що я рекомендую, а перш ніж ми перейдемо тут. Channel9.msdn.com. Це дуже зручно, тому що ви не збираєтеся читати через тонн офіційні документи. Це в основному багато відео, відеоролики і речей, які прямо до справи. Я не повинен сказати, що це завжди право на точку. Це залежить, хто робить розмову. Але в цілому, є деякі відео дійсно до-точки тут , Який покаже вам ту чи іншу річ, яку ви, можливо, захочете дізнатися або побачити призначалася. Там також всі наші контенту з нашої конференції, яка відбулася пару тижнів тому називається збірки, і ви побачите, що прямо там. Там в основні технології для ОС Windows 8 ігор. Там ви йдете. Я був там, насправді. Ви не можете мене бачити. Я був тут. Але так чи інакше, це в стороні, я рекомендую вам поглянути на тих відео. Вони досить корисними. Якщо ви застрягли на чомусь або ви просто хочете побачити, що щось може робити, стріляти тих, до. 

[Гуарін] Windows Mail просто послав мені електронного листа з посиланням на утримання для студентів, щоб скачати з прикладом коду і все в такому дусі. >> [Боуен] Великий. Приголомшливо. Спасибі, Едвін. 

Добре. >> [Студент] У мене є питання. >> [Боуен] О. Так, будь ласка. [Нерозбірливість студент питання] >> [Боуен] О, я радий, що ви запитали, що. Так. Питання було, є візуальний інтерфейс для мене створити речі? Едвін, віддасть тобі сторицею за це питання. Існує спосіб зробити це. Чи повинні ми зробити це зараз? Давайте зробимо це зараз. Я збираюся йти до неї просто зараз. Насправді, дозвольте мені додати більше однієї речі до цієї демонстрації, а потім я покажу вам реальну відповідь. Я збирався додати в трохи більш CSS тут. Я був трохи не по дотичним тут. Дозвольте мені поставити в деяких CSS тут, щоб скористатися з класів, які ми додали якийсь час назад, в заголовку, в MainContent DIV, а потім у greetingOutput. Якщо я це зроблю і запустити його, ви можете побачити зараз у нас є трохи дещо інший відступи і поля, тому у нас є насправді деякі зміщення тут. Вони більш до того, що ви збираєтеся очікувати остаточного полірованої застосування. Але я просто показую вам це, тому що це прямо CSS. Так що речі, які ви вже знаєте, ви можете використовувати тут, щоб регулювати вміст, як ви хочете. Ви вже бачили, як зробити фон змінити той шлях. 

Якщо я повернуся до нашого HTML, я збираюся додати більше одного набору розмітки, і це насправді відбувається, щоб бути контроль з WinJS. Я збираюся піти і захопити це, мітку. Дозвольте мені переконатися, що я роблю це в потрібному місці. Напевно досить добре. Ось я тільки що додав - і ми підемо на повний екран так що ви можете бачити все це - Я додав мітку на наступний дів. Справ називається ratingControlDiv. Саме по собі це нічого не буде робити. Якщо ви відкриєте цей у браузері, ви би дивлячись на порожній, сам DIV. Але через цю таємничу рядку коду, що я показав тобі, процес все, це буде шукати те, що виглядає так - Дані виграшу-контроль - і це буде знайти все, що в цьому параметрі. Це збирається зробити екземпляр що б це ні він, вказуючи на. У цьому випадку, це контроль рейтинг, тому я кажу: "Будь ласка, підіть і замінити цю річ "З тим, що вам потрібно зробити, щоб зробити контроль рейтинг." Це може бути контроль фліп, це може бути кільце прогрес чи що контроль ви хочете використовувати. Вони все працюватиме практично так само,. Ви використовуєте стандартний HTML5 розмітку, щоб вказати, що ви хочете, а потім ви збираєтеся отримати контроль в кінці цього. Дозвольте мені запустити цей. Я просто скопіював, що в, і тепер, коли розмітка стає це, яка насправді досить багато HTML елементів. Всі ці окремі зображення, і є діви навколо них з селекторів. Сподіваюся, ви зможете побачити, що. Це трохи тонше. Я можу наведіть курсор на різних пунктів, і це буде, щоб дозволити мені побачити рейтинг тут. Я можу натиснути на неї, і вона пам'ятає рейтинг, але це про нього. Це насправді не роблять нічого з рейтингом. 

Той, останнє, що я хочу показати вам, на цьому перш, ніж ми перейти в більш візуального досвіду проектування трохи коду, який я можу використовувати, щоб відповісти на ці елементи управління WinJS. Дозвольте мені вибратися звідти, назад з повноекранному режимі, і перейти на JS тут секунду. Я можу зробити це прямо тут. Я думаю, що я заміню все це справа. Насправді, я думаю, що він замінить все це, але ми дізнаємося разом. Я покладу це тут. Так. Я збираюся видалити це теж. Що я можу додати? Це виглядає як багато. Це не багато. Я просто продовжений цей рядок коду, який я вже говорили раніше, і я кажу: "Коли все буде зроблено, коли всі мої управління були зроблені, », То зробити це." Отже запустити цю функцію з ім'ям завершена. У цьому випадку, це матеріал, який ви можете з'ясувати. Знайди, що контроль справ. Насправді, є одна річ, я повинен відзначити,. Це наступна рядок фактично говорить: "У мене є, що ratingControlDiv." "Я хочу поговорити з нею, як якщо б це був реальний контроль, контроль WinJS." Так в основному, ви просите, що від нього. Ви говорите, "Я хочу поговорити з вами в якості контролю." І тоді ви можете почати говорити такі речі, як: "Ми збираємося додати слухача для вас "Тому, коли ви змінили ми можемо відповісти на це." І тоді ми зможемо також робити речі, як це. Насправді, це старий код там. Я думаю, що мені не вистачає вставки більше однієї функції, і це було б реальне функція, яка буде реагувати на рейтингового контролю необхідно змінити. Дозвольте мені поп, що в прямо тут, десь навколо там. І в цьому випадку, єдине, що новим є те, що ми збираємося в що контроль рейтинг говорить нам і ми просимо те, що називається tentativeRating. Там купа різних інших речей, які, що контроль може сказати вам, і він йде контроль з контролю. Це дуже просто. Ви зможете не зрозуміти це без проблем взагалі. Я запускаю це, і тепер, коли я міняти рейтинги і натиснути на рейтингу, Ви можете бачити зараз це насправді відповідь на нього. Це покласти, що оцінка на екрані в цей порожньому сну тега нижче рейтингового контролю. Це магія багато матеріалу тут теж. Так як ви створюєте додатки для Windows Store, є тонна елементів управління, які ви можете просто використовувати. Вони всі працюють, як це. 

Дозвольте мені показати вам візуальній стороні проектування для цих додатків. Доброю новиною є те ви будете вже є цей інструмент при установці всі якщо ви йдете в цій скачування, і ви отримаєте Visual Studio. Я можу клацніть правою кнопкою миші на цьому. Я не буду збільшення масштабу Це просто говорить Відкрити в Blend. Суміш є ще одним інструментом, який працює пліч-о-пліч з Visual Studio і орієнтований більше на проектній сторону речей, так що це дійсно поверхонь інструментів, які оптимізовані для створення стилів, створення анімації, роботи з CSS, багато речей в такому ключі. Ось що повинно бути дуже цікаво і досить очевидно відразу, ми дивимося на додатки. Сподіваюся, ми до цих пір. Замість того, щоб код, який ми досі побачити на дні, ми бачимо фактичне подання додатка. Більш того, це не просто подання додатка, це насправді додаток працює. І ось що дійсно приємно про Blend. Команда виконала велику роботу, щоб принести HTML і JavaScript і CSS в цьому інструменті. Тепер ви можете насправді, якщо вам цікаво, "Що це означає? Що я можу зробити?" Я можу насправді дизайн до цього додатку, хоча такі речі не існують в моїй розмітки. Пам'ятайте, що контроль рейтинг? Це був просто справ тег. Цей матеріал, що зірка, існує тільки під час виконання. Як я дізнаюся, що? Там в трохи чарівництва тут. Подивитися ці блискавки? Кожен раз, коли ви бачите блискавку, це означає, що він був створений щось під час виконання. Деякі JavaScript побіг і повернувся щось в тій чи створив це з деякою логіки. Ці зірки, які ви бачите там були створені JavaScript на WinJS. Приємно те, це не має значення для мене, я все ще можу оформити його, Я все ще можу піти і змінити його, я можу дізнатися, що тут відбувається, Я можу подивитися на CSS, я можу піти далі і з'ясувати, чому колір так воно і є, Я можу почати возитися з речами і робити речі жахливо, все, що я хочу зробити. Насправді, я залишу в спокої речі. Але ви можете подивитися тут це все CSS і він показує вам тут. Якщо я піду до там, він збирається показати вам все, що вони називають Перемога, Таким чином, правила CSS, які є найбільш конкретним і найбільш обраний для цього елемента, які ви, ймовірно, вже перейшли в ваших класах, де ви можете сказати, що є спільне шрифт, ми застосовуємо до всього, а тому, що це h1 і у мене є колір, визначений для H1S, це буде цей колір, і це тому, що це більш конкретним, ніж body1. Це одна річ прямо тут показує вам все, що, і це дійсно потужна штука, як ви отримаєте більш складною, Ви ставите питанням, чому ці речі, як вони є. Це буде насправді сказати вам, і ви можете вибрати будь-який з цих елементів тут. Цей колір не так вже погано, насправді. Ви можете вибрати їх. Сподіваюся, ви зможете переконатися в цьому. За все, що у вас є у вашому додатку, ви бачите цілий каскад всього CSS, які могли б застосовуватися в тому, що і який з них перемагає, якою насправді взяли верх. Вони є свого роду нудно. Там не багато всього відбувається в деяких з них. Якщо я піду і змінити колір, то ви почнете бачити деякі каскадирование там. Ви також можете використовувати HTML і тут. Я можу пройти і змінити HTML властивості для всіх цих речей, як я хочу. Там просто тонни матеріалу тут. 

Я не хочу, щоб зайняти час, пройшовши через усі тут. Просто знаю, що це тут. Там дуже багато функціональності дизайну, орієнтованих на це тільки для вас так що ви можете залишитися візуально, роботи з додатком, і не потрібно робити багато гадати що ви повинні були б зробити нормально і велоспорт назад з браузера назад в ваш дизайн, назад в браузер. Це дійсно цікавий матеріал для цього, і, як ви розробити додаток Windows Store, він збирається зробити вас багато більш продуктивним. 

Ви також побачите, що вона стежить за розмітку тут і ваш CSS як ви працюєте через різні речі. Це, напевно, дійсно важко для вас, щоб побачити, що, особливо на відео, але ось що тут відбувається, і я рекомендував би вам ознайомитися з цим. Це заощадить вам багато часу. Це суміш. Якщо ви вносите жодних змін тут, вони автоматично йдуть вони відвезти назад на в Visual Studio. Це одні і ті ж файли, це те ж саме все. Я залишу його в спокої. У мене є кращий приклад, який я хочу вам показати. Але якщо б я зробив зміни там і врятував його, і я повернувся в Visual Studio, він би сказав, "Гей, ти щойно змінив щось. Можу я перезавантажити його для вас?" Так. І ви використовуєте один і той же матеріал там. Це кінець цього конкретного зразка. 

Я хочу показати вам більш високого рівня зразок просто щоб дати вам уявлення про інших функціональних можливостей Ви могли б думати про, як добре. Це зразок додаток, яке ви можете скачати. Якщо ви подивитеся на те, що називається Windows, табір в коробці, Є деякі зразки, які в тому, і один з них є Contoso Куховарська книга. Я можу просто запустити це для вас. Власну заставку. Це думка Сітка додаток. Вони пов'язані деякі дані користувача тут. Ви можете переміщатися через це. Ви можете піти і поглянути на різні речі, які зроблять нас голодними в п'ятницю вдень. Я не знаю. Що збирається зробити мене самим голодним? Я не знаю. Я просто хочу, щоб вибрати один. Ви йдете в ці речі. Він покаже вам рецепт. Ви могли б також, замість натискання на елемент, Ви можете піти прямо до тієї категорії контенту, тієї частини змісту. У цьому випадку, ви можете прочитати багато підробленої латині кажу вам все про ці рецептів тут , А потім перейти прямо в конкретного рецепта. Це також підтримує такі речі, як обмін, що я показав вам, перш ніж із зображеннями. Ви можете також шукати в цьому додатку також. Це дуже просто зробити пошук. В принципі, ви тільки рядок тексту з вікон і вам вирішувати, як ви хочете обробляти пошук з цим. Це кілька рядків коду, щоб отримати це, а потім те, що ви з ним робити після цього повністю залежить від вас. 

Ось вони і є додаток бар, де вони використовують деякі інші функції. Я просто скажу, що це таке. Нагадаємо збирається використовувати те, що називається сповіщення тост. Це дійсно зручно, що дозволяє користувачеві знати, коли речі сталися, як додаток було встановлено або щось було завершено. Це також добре для ігор теж. Якщо у вас є постійний мир або дошці лідерів та послуги, який хостинг, що може бути, на окремому комп'ютері, ці повідомлення можуть бути відправлені в машину і навіть якщо користувач не використовує свою гру, граючи свою гру або працює ваш додаток, вони як і раніше можуть отримувати повідомлення про тих видів подій. Таким чином, можна сказати: «Ваш замок був зруйнований або просто про знищені." "Вернись і захищати її", або щось в цьому роді. Ви натискаєте на повідомлення, ви відразу повернутися в гру, і ви можете грати в неї. Так що ті види речей може допомогти дійсно залучити людей назад у додаток досить ефективно. 

Там також підтримка у цьому додатку для використання мікрофона, веб-камеру, робити відео і робити фотографії. Ви також можете закріпити вторинний плитку. Це корисно, якщо ви хочете, щоб просто мати плитку, яка йде прямо до певних змістом. У цьому випадку, він переходить право цього рецепта. Все, що я згадати Я лише показую тому що це речі, які ви можете думати про використання, а також. Здебільшого, вони дуже прості у використанні. Я просто рекомендую вам виховувати цей зразок дослідник і знайти зразок, який може показати вам, як це зробити. Це досить просто, щоб притягнути винних у ваших додатків там також. 

Я збираюся показати вам щось інше, що це дуже здорово тут. Я зламаю це додаток, і я збираюся повернутися в Visual Studio. Ця програма працює. Це працює з Visual Studio. Що я можу зробити деякі досить прикольних речей з цим. Я насправді є можливість вибрати елемент, і я можу піти сюди, щоб живий застосування і можу сказати, "Я задаюся питанням, чому Час приготування трохи світлий сірий, ніж сам титул?" Я можу натиснути на неї. Це буде синхронізувати, що назад в Visual Studio, і він збирається показати мені точно згенерований контент, який привів до тієї частини інтерфейсу користувача. Так що в цьому випадку, це річ-субтитрів і h4 подвійною конструкцією, і що, ймовірно, говорить нам, що ми повинні знати, тому що в якості h4 в цьому контексті, він збирається отримати певний вид шрифту. Але якщо я все ще не знаю, чому, я можу натиснути на Трейс стилів. Потім я можу розширити її колір, і я можу точно з'ясувати, чому це колір не колір кузова але насправді це щось інше. Це, по суті засобів розробки від Internet Explorer до такої міри, були ввезені в Visual Studio. Якщо ви працювали з Chrome Dev Tools, Firebug, тощо, ці види інструментів, які в браузері, що вид функціональності, було доведено прямо в Visual Studio так що ви насправді не повинні запустити браузер і працювати з цими інструментами окремо. Тепер у мене є додаток Windows Store просто працює, і я можу почати тягнути його на частини і з'ясувати, чому речі роблять те, що вони є. 

Я також можу зробити це таким чином теж. Я можу піти й просто вибрати щось правильно з розмітки і з'ясувати, що це таке в самому додатку. Я думаю, що я пішов на все. Тут я завис над цим. Я можу вибрати його. Це збирається показати мені, в реальному додатку проточною де ця річ є що я тепер натиснувши на в розмітці. Дійсно цікавий матеріал. Як ви намагаєтеся з'ясувати, що відбувається і що HTML робить, що CSS робить, майте це на увазі. Пам'ятайте, що це тут для вас а також, що суміш може працювати з живим запущеного додатку. 

Той, останнє, що я хотів показати вам, за допомогою цього додатка - До речі, він показує вам дельт як все змінюється занадто, так що ви можете стежити за тим жовтими деталями. Ті речі, які щойно змінили у додатку. Але одна остання річ. Я хочу повернутися до Змішайте хоч на секунду тут. Ми відкриємо цю гру, Відкрити в Blend, і того ж додатка, то ж все. Я просто хочу показати вам досвід тут не просто ви застрягли на головній сторінці дивлячись на речі, які ви будете отримувати за замовчуванням при запуску програми, і нехай сидять там. Ви також можете включити цю досить невеликий значок тут. Вона називається Інтерактивний режим. Ви натискаєте на що. Це буде виховувати вашої програми. Ти не в режимі конструктора більше, так що ви не збираєтеся бути натиснувши на речі змінити функціональність, але ви можете працювати з додатком зараз. Ви можете натиснути через, ви можете робити що завгодно, дістатися до рецепт, що ви дбаєте про або до категорії. Підемо в цій категорії. Я кажу: "Добре, ось те, де я хочу, щоб дизайн." Потім натисніть кнопку цю кнопку ще раз, він принесе вас назад в поверхню конструктора, і тепер ви можете робити всі ті речі, які я мав на увазі насамперед. Я буду тримати клацання, поки не отримаю цей обраний, дізнатися її розміри, дізнатися HTML для нього, в CSS для нього для запущеного додатку, деякі пізніше частина програми. Дуже, дуже корисно. Я покажу вам це. Будь ласка, майте на увазі, якщо ви шукаєте в написанні коду з цим тому що це буде вам заощадити багато клопоту, і це досить хороший матеріал. Це значною мірою все, що я хотів показати вам, на Blend, і в Visual Studio для всього цього. 

Будь-які питання по кожній з цих інструментів? Все, що завгодно? >> [Гуарін] У мене є матеріал, щоб видавати, так хороші питання, хороший матеріал. 

[Боуен сміється] Я вже показав вам свої демо тут. Я збираюся поставити його на сторінці ресурсів і звернутися до питань зараз. Це перша згадка в тому, що сайт покоління App з ігровою доріжки і додатки трасі. Зареєструватися для тех. Ви не повинні чекати 30 днів, щоб отримати зміст. Ви можете почати рухатися і, дивлячись на утримання, як ви хочете. Я розумію ваші тимчасові рамки може відрізнятися від - [сміється] Тому, коли це Хакатон? Ось пару тижнів, чи не так? Так що вам не мають 30 днів, щоб чекати. Так що так, ви можете підписатися на це, а потім просто почати вилучення вмісту з нього. Також Дів і дизайн-центрів. І я не говорю про це, але є також магазин Docs. Це було б для після Hackathon як ви будете готові почати представляти свої додатки для магазину. Є деякі корисні рекомендації тут, деякі рекомендації про те, як отримати речі в магазин, деякі загальні проблеми, які можуть збити вас з пантелику, і що це кінець цих ресурсів. 

Так що в тебе на думці? Все інше, що ви - [Гуарін] Хто думає про виконання додаток для Windows для CS50? Круто. [Боуен] Прохолодний. Великий. 

Будь-які питання про речі, які ви бачили до сих пір, і як він до цього ставиться? Наприклад, з великою кількістю часу, я міг взяти гру, яка я написав і що працює в браузері і тільки частково пройти через процес з чого, що в Visual Studio і робить його додаток Магазин Windows. Це займає більше часу, ніж ми насправді повинні були включати в себе сьогодні, але коротка версія є його той же код, що у вас працює в браузері, і те, що ви змінити речі, які ви вирішите підключити до Windows 8. Так що якщо ви хочете використовувати принади, якщо ви хочете знайти або поділитися, вам потрібно створити додаток бар, щоб сховатися деяку функціональність на що, це ті речі, які ви б змінити. Але в основі вашого веб-додаток може залишатися без змін. Знову ж, до тих пір, як він працює в IE10, що це збирається бути дуже легко порт довести цей матеріал в Visual Studio, в Blend, і зробити його додаток Магазин Windows. Знову ж, єдине, що ви повинні будете дізнатися ті інші особливості що ви можете використовувати, щоб висвітлити заяву, як живий плитки і подібні речі. 

Так. >> [Студент] У мене питання про роботу мобільного. Так що якщо ви зробити додаток, який працює як додаток на робочому столі, це дійсно легко перенести його на мобільний, або їсти - Питання в тому, якщо я зроблю додаток Windows Store, що насправді оптимізований для цього середовища і я хочу довести його до мобільному світі, що участь з, що робити? Це, як і багато питань, завжди постійно змінюється відповідь. Доброю новиною є те, якщо ви дотримуватися HTML і JavaScript, CSS, якщо ви починаєте з додатком Магазині Windows, це буде, щоб ви привести його в Інтернеті і потім використовувати ці види техніки, такі як засоби масової інформації запитів і речей, щоб адаптуватися до різних пристроїв розміру. Тим не менш, завжди є рамки і нині там що підтримка розширення різні технології, різні платформи. Це весь час змінюється. Ми також змінити стан речей, а також ми дивимося до того, що ми маємо зараз насправді з Windows Phone 8. У нас є деякі загальні основні інфраструктури запропонував між додатками для цих середовищах. Таким чином, матеріал, який ви робите, щоб створити додаток Windows Store, багато чого можна перенести в телефон 8 додатків в ОС Windows, а також. Це знову є новим історія, так що деякі контент про те, що в Build. У SDK щойно вийшов якийсь час назад. Було тільки що випустила якийсь час назад. Але з точки зору інших платформ теж, ви, ймовірно, зіткнетеся з багатьма рамках крос-платформних, а також. Доброю новиною є те речі, які ви робите тут, основна функціональність є прямо веб стандартного матеріалу. Єдині речі, які не будуть переводити легко ті речі, які Windows 8 робить, але це не дивно, тому що це функція Windows,. Ви не збираєтеся знайти спільне або аналогічні види контрактів на будь-який інший платформі. Так що ті речі, які ви хотіли б з точки зору проектування переконайтеся, що у вас є способи роду абстрактний, що, так що ви можете сказати, "Якщо я біжу на цьому, я можу зробити це." Якщо я не, є деякі шаблони проектування, які можна використовувати, щоб частково приховати цей матеріал далеко. Але майте це на увазі. Так. Вибачте. Йдемо далі. 

[Студент] Якщо я хочу перевірити моє додаток Windows, на вершині [нерозбірливо] [Боуен] Так. Я пропустив ще одну річ теж. Так. Я відповім на ваше запитання, а потім я покажу вам функцію я забув згадати. У нас є деякі машини, доступні локально. Мені дуже шкода. Питання було, як мені перевірити речі на пристроях якщо я не пощастило мати багато речей, щоб вибрати з? [Гуарін] Ми надали вам, хлопці, я думаю, 5 або 6. Скільки вам потрібно? [Студент] Ми отримали 4 з них. >> Добре. Ви, хлопці отримали 4 сланці, щоб пограти с. Так виразно нехай всі знають, будь ласка. [Сміється] >> [Боуен] Приголомшливо. Це навіть краще, відповідь, ніж я збираюся дати вам. У нас є робочі години для розробників, які ми робимо в нашому офісі і тепер найближчим часом в Microsoft Store більше в Пру, але Едвін вже подбала про вас. Є 4 сланці, доступні для кредитування, для тестування. Там ми йдемо. Там в приклад одного там. Так що так, абсолютно. Великий. Абсолютно безумовно кращий спосіб перевірити це має бути на пристрої. Якщо ви не пощастило мати його ще немає або ви не хочете йти по кампусу в снігу щоб захопити один або всі, що є спосіб зробити це ще в Visual Studio. Якщо я повернуся в, де я був тут, тут замість використання локального комп'ютера, ви могли б підключитися до віддаленої машині, але це не те, що я говорю тут. Симулятор це те, що ви, можливо, захочете поглянути на. Я побіжу це, і дійсно, що це таке, це по суті вікна на вашій системі. Тут насправді моя система працює, працює Contoso, але таким чином, що дозволяє мені змінити деякі параметри виконання, параметри навколишнього середовища. Тому я можу сказати тут: «Ви знаєте, що?" О. Я вже це працює в моделюється 27-дюймовий монітор з роздільною здатністю 2560. Я можу легко впасти, що вниз і подивитися, що моя заява буде робити з меншим екраном або шляхом зміни налаштувань DPI або будь-який інший. Так на маленькому екрані, 10.6, що він збирається робити? Це все ще виглядає досить добре, чи не так? Ви хочете, щоб це зробити, особливо якщо ви відправляєте в магазин, тому що ми робимо як частина процесу тестування. А якщо є проблеми, як, що, , То ви можете зіткнутися з проблемою отримання сертифікованих для магазину. Але це частина тренажера. Дійсно здорово. Дуже легко зробити це. Ви також можете використовувати такі функції, як обертаючи її, а також. Я можу натиснути кнопку тут, його вирощують, бачити те, що комусь доведеться як досвід обертових їх шифер, їх таблетка, і за допомогою програми з цим. Є й інші речі, занадто, як сенсорний емуляції і деякі інші речі, установка GPS. Я можу робити вигляд, що я в іншому місці і подивитися, що моя заява робить коли я роблю вигляд, що я повернувся в Сіетл або щось. Але це дійсно корисна функція, і він побудований в і до Visual Studio і в Blend. Так. Ваше питання. 

[Студент] Якщо ви пишете гру, робить Visual Studio мають ніякої підтримки для анімації? Так. Питання в тому, навколо підтримкою анімації, особливо в іграх. Це залежить від багатьох чинників. [Сміється] За допомогою JavaScript я скажу там, напевно, менше підтримки, ніж є на стороні XAML, який має тимчасові рамки, має розкадровки і речі, які вбудовані Для анімації на додатках JavaScript, я не знаю, скільки з відповіді я хочу дати вам. У мене є ресурси на моєму блозі, які йдуть через багато варіантів для обох фізики анімації, Варіанти для JavaScript-орієнтованих ігор на Windows 8. Я хотів би послатися ви до тем. В принципі, є так багато варіантів. Причина, чому я соромлячись є так багато варіантів для робити анімацію з JavaScript. Це може бути CSS, це може бути полотно основі, це може бути просто основні DOM анімації, це може бути багато різних речей, так що це дійсно залежить від вашого вибору. Якщо ви вирішили використовувати щось на зразок Create.js або вапна або інших видів рамок - Ну, я навіть не впевнений, що ви збираєтеся бути в змозі використати більш високого рівня, рамки подобається впливу або Побудувати. Це, як правило, генерують більше коду, ніж ви могли б розглянути з нуля. Але в цих випадках ще можна було використовувати симулятор, ви можете використовувати середовища, і я, як правило, просто використовувати цю середу для моєї тестової платформи в тих випадках, як я займаюся розробкою гри. Я був у порядку, особливо з Полотно анімації, які, ймовірно, найбільш поширена річ. Найкраще, що ви збираєтеся, ймовірно, знайти це Засоби розробки в браузері і Засоби розробки в Visual Studio. Вид звивистій відповідь є, але, сподіваюся, я отримав відповідь на своє питання. Так. Ви. 

[Студент] Які варіанти зберігання даних для Windows 8 додатків? Які варіанти зберігання даних для Windows 8 додатків, Windows Store додатки? Ваші варіанти насправді кожен додаток отримує власний басейн локального зберігання для налаштування і для передачі даних, але це також безглуздо простий у використанні роумінгу зберігання, використовувати хмарну зберігання. Це безкоштовно. Що відбувається, ви в основному вибрати інший клас, і ви говорите, "Налаштування Роумінг, Зберегти, це певний набір контенту," і їх облік Microsoft, що вони увійшли як, збирається бути ключем до роумінгу цю інформацію навколо. Так що, якщо я використовую свою гру на моєму ноутбуці, і потім я увійти з таким же рахунком і я грати в гру на поверхні або таблетку, , Які будуть автоматично переміщатися цю настройку і дані між цими машинами. Це річ за замовчуванням. Це добре для певних обсягів даних. Ви б не поставити величезну базу даних на тих. Для цього вам потрібно піти до інших видів рішень, як розміщеної базі даних у хмарі, такі речі, як, що. Є й інші варіанти співтовариство навколо інших видів технологій передачі даних. Я бачив деякі SQLite опції в спільноти навколо там теж. Так більше і більше з'являються, але ті є основними речі, які ви глянув би на для гри або програми. І у вас було питання в спину теж. 

[Студент] З точки зору мережі [нерозбірливо] завантаження або скачування файлів [нерозбірливо] [Боуен] Ваше питання, як ви можете бачити, що і як ви можете налагоджувати, що і це перевірити? [Студент] Як ви можете налагоджувати його [нерозбірливо] Вибачте. Я не можу чути все це. [Студент] Як ви отримуєте це помилка випробування, а також [нерозбірливо] Великий. Великий. Як ви працюєте з мережею? Як ви можете бачити, що відбувається? Там в багато різних відповідей на це, але дозвольте мені показати вам, ймовірно, найлегші речі. Дозвольте мені позбутися тренажера на секунду. Просто пару параметри налагодження для мереж. Там в повний мережевий стек запечений прямо в як на рівні WinRT і від WinJS, так що ви можете дуже легко зробити XHR, тип AJAX дзвінки з грою або додатком, щоб зробити це. У першу чергу, я вважаю за краще використовувати 2 речі. Я використовувати фактичні самі інструменти розробника, які мають мережевий стек спечений у них. Дозвольте мені показати вам домашню сторінку Windows. Я можу про це не, і там насправді мережевий проксі запечений у цих інструментів тут. Так що я можу зробити це, я можу відновити сторінку, і він збирається показати мені всі взаємодії, в тому числі AJAX закликає до цієї сесії, для тривалості цього запиту. Це корисно. Це буде дуже корисно для додатків на основі браузера. Для інших видів додатків, в тому числі Windows Store додатків, Я використовувати інструмент під назвою Скрипаль. Ви збираєтеся отримати гру у відповідь. [Сміється] Скрипаль є простою проксі. Я думаю, що можна показати, що для вас. Це просто GetFiddler.com, який, що цікаво, я відстеження мій мережевий стек збирається GetFiddler. Але так чи інакше, Скрипаль був написаний одним із прем'єрів в команді IE, так що він знає, що він робить. Це хороший проксі, які можна використовувати для налагодження мережевого трафіку. Я рекомендував би, щоб. Питання там теж. 

[Студент] Є простий спосіб інтегрувати введення іноземних мов, як японський або китайський, в додатках Windows? Я не можу сказати, що я зробив занадто багато себе, але це випікається дюйма Є варіанти для звичайно випромінюючих додатки - Пробачте, я не говорив, питання - варіанти навколо глобалізації, локалізація контенту, в тому числі речі, як можливість продавати на різних ринках і мета, яка версію програми для тих окремих мов або культури або тому подібне. Абсолютно вбудованого У нас було підтримку, що для вічно, і що несе вперед у ваші варіанти для Windows Store. Ви можете зробити це в самому магазині, продати на різних ринках, Ви можете зробити це в додатку, а також з використанням ресурсів, щоб визначити, "Якщо я розробив для цієї культури, а потім використовувати ці перевизначення для мого текстового контенту "Або використовувати справа наліво читача." Це все частина WinJS за замовчуванням і WinRT API. Хороше питання. 

Як у нас справи? Будь-які інші? І якщо хтось на відео є питання, я cbowen @ Microsoft, так що я з задоволенням відповім на будь-які ваші питання з майбутнього. Дуже - З майбутнього, в майбутньому [імітує відлуння]. Так от я. Дозвольте мені покласти назад мій контакт тут. Так що просто послати мені записку, cbowen @ Microsoft, і я повернуся до вас, як тільки зможу. 

Все інше, що вам цікаво? Невже ми добре? Великий. Добре. Спасибі всім велике. Я ціную це. [Оплески] 

[CS50.TV]