1 00:00:00,000 --> 00:00:02,420 [Powered by Google Translate] [Seminar - Windows 8 - Pengembangan App / Game dengan HTML5] 2 00:00:02,420 --> 00:00:05,090 [Chris Bowen, Edwin Guarin - Harvard University] 3 00:00:05,090 --> 00:00:07,350 [Ini adalah CS50. - CS50.TV] 4 00:00:07,350 --> 00:00:10,290 >> Hey, semua orang. Nama saya Edwin Guarin. Ini adalah Chris Bowen. 5 00:00:10,290 --> 00:00:12,310 Aku akan membiarkan dia memperkenalkan dirinya dalam satu detik. 6 00:00:12,310 --> 00:00:14,100 Aku hanya ingin membuat pengumuman cepat. 7 00:00:14,100 --> 00:00:18,340 Pertama-tama, semua yang Anda CS50 siswa mendapatkan Windows 8 secara gratis. 8 00:00:18,340 --> 00:00:23,150 Jadi, jika Anda berpikir tentang benar-benar menggunakannya untuk proyek akhir Anda, itu milikmu. 9 00:00:23,150 --> 00:00:25,740 Nate akan mengirimkan email nanti untuk instruksi. 10 00:00:25,740 --> 00:00:32,850 Hal kedua adalah jika Anda memutuskan untuk menulis sebuah aplikasi Windows 8 untuk proyek akhir CS50 Anda, 11 00:00:32,850 --> 00:00:35,870 kita akan melakukan beberapa hadiah: Xbox, 12 00:00:35,870 --> 00:00:38,870 kita mungkin bisa memberikan batu tulis jauh, hal-hal seperti itu. 13 00:00:38,870 --> 00:00:42,460 Jadi jika ada sesuatu yang menahan Anda, biarkan Chris atau saya tahu 14 00:00:42,460 --> 00:00:45,010 bagaimana kami dapat membantu Anda membangun sesuatu yang sangat keren. 15 00:00:45,010 --> 00:00:48,580 Jadi terima kasih lagi untuk datang hari ini, dan saya akan menyerahkannya kepada Chris. 16 00:00:48,580 --> 00:00:50,500 >> Terima kasih, Edwin. 17 00:00:51,000 --> 00:00:52,740 Terima kasih, semua orang, untuk bergabung dengan kami hari ini. 18 00:00:52,740 --> 00:00:55,800 Saya Chris Bowen. Aku salah satu dari rekan Edwin di sini di Timur Laut. 19 00:00:55,800 --> 00:00:58,310 Aku hanya ingin menghabiskan sedikit waktu dengan Anda berbicara tentang 20 00:00:58,310 --> 00:01:03,730 bagaimana membuat aplikasi Windows Store dengan HTML5, JavaScript, dan CSS 21 00:01:03,730 --> 00:01:07,310 dan jenis mendapatkan pertanyaan yang Anda miliki tentang hal itu menjawab untuk Anda 22 00:01:07,310 --> 00:01:12,920 karena Anda melihat ke arah berpikir tentang mungkin menggunakannya untuk final kesempatan CS50. 23 00:01:12,920 --> 00:01:14,980 >> Yang mengatakan, kami hanya akan menyelam langsung masuk 24 00:01:14,980 --> 00:01:17,190 Aku akan pergi ke slide di sini. 25 00:01:17,190 --> 00:01:19,440 Jika Anda memiliki pertanyaan, jangan ragu untuk mengirim saya email. 26 00:01:19,440 --> 00:01:23,460 Aku cbowen@microsoft.com, dan ada blog saya dan Twitter saya. 27 00:01:23,460 --> 00:01:26,330 Namun Anda ingin berhubungan dengan saya, itu bagus. 28 00:01:26,330 --> 00:01:30,110 Aku punya sekitar satu jam dari hal-hal, dan saya ingin mendapatkan pertanyaan Anda di sepanjang jalan, 29 00:01:30,110 --> 00:01:33,720 jadi jangan malu-malu tentang memiliki pertanyaan selama ini. 30 00:01:33,720 --> 00:01:36,470 Mereka tidak bisa melihat siapa yang mengajukan pertanyaan pada rekaman, 31 00:01:36,470 --> 00:01:39,090 sehingga Anda akan sebagai anonim yang Anda inginkan untuk menjadi. 32 00:01:39,090 --> 00:01:42,780 >> Biarkan aku menyelam kanan, hanya memberikan pengenalan cepat untuk Windows 8, 33 00:01:42,780 --> 00:01:47,400 dan menampilkan beberapa hal tentang Windows Toko aplikasi yang bisa Anda pertimbangkan 34 00:01:47,400 --> 00:01:49,530 karena Anda berpikir tentang pengembangan aplikasi. 35 00:01:49,530 --> 00:01:52,660 Kami sedang melihat Windows 8. Kami sudah keluar selama beberapa minggu sekarang. 36 00:01:52,660 --> 00:01:55,810 Banyak adopsi yang kuat di luar sana sudah. 37 00:01:55,810 --> 00:01:59,800 Anda mungkin telah melihat sudah mesin Permukaan yang kita miliki juga. 38 00:01:59,800 --> 00:02:03,730 Ada satu di sini sebenarnya Anda dapat melihat di jika Anda berada di sini secara pribadi. 39 00:02:03,730 --> 00:02:07,530 Aku benar-benar ingin berbicara dengan Anda, menunjukkan Anda di sekitar sedikit tentang Windows 8. 40 00:02:07,530 --> 00:02:10,759 Ide dengan Windows 8, itu benar-benar membawa ke depan semua hal yang Anda tahu tentang Windows 41 00:02:10,759 --> 00:02:16,840 ke beberapa pengalaman baru - khususnya, hal-hal seperti pada mesin Surface dengan sentuhan, 42 00:02:16,840 --> 00:02:20,000 semacam ini lebih banyak perangkat mobile yang sekarang di pasar, 43 00:02:20,000 --> 00:02:22,360 tetapi juga Windows sama intinya. 44 00:02:22,360 --> 00:02:25,850 Jadi itu berarti Anda dapat menginstal itu benar-benar pada apa pun yang menjalankan Windows 7, 45 00:02:25,850 --> 00:02:30,770 dari tiga SLI rig game terbesar Anda ke laptop Anda 46 00:02:30,770 --> 00:02:36,200 dan mengkilap perangkat lain yang baru Anda bahwa Anda mungkin mengambil hari ini. 47 00:02:36,200 --> 00:02:38,450 Mereka akan menjalankan Windows 8. 48 00:02:38,450 --> 00:02:40,530 Aku akan menunjukkan kepada Anda sekitar hanya sedikit, 49 00:02:40,530 --> 00:02:44,670 dan semua pengalaman yang akan Anda lihat di sini adalah hal-hal yang dapat Anda buat. 50 00:02:44,670 --> 00:02:47,760 Idenya adalah apakah itu sentuhan, mouse, keyboard, 51 00:02:47,760 --> 00:02:51,870 apapun perangkat adalah bahwa Anda menjalankan aplikasi Anda, itu akan menjalankan besar. 52 00:02:51,870 --> 00:02:55,180 Windows 8 akan membantu dengan semua skenario tersebut. 53 00:02:55,180 --> 00:02:59,600 >> Slide ini samping, mari kita mendapatkan hak untuk mengambil melihat-lihat di sini. 54 00:02:59,600 --> 00:03:03,270 Mari saya tunjukkan di sekitar layar rumah saya. Ini adalah layar Mulai saya. 55 00:03:03,270 --> 00:03:05,810 Saya hanya akan memberikan sedikit tur di sini. 56 00:03:05,810 --> 00:03:09,610 Aku pada mesin non-touch, sehingga sebanyak yang saya ingin menyentuh layar laptop saya, 57 00:03:09,610 --> 00:03:13,400 itu tidak akan melakukan apa-apa, jadi aku hanya akan gulir di sini sedikit dan menunjukkan. 58 00:03:13,400 --> 00:03:17,950 Beberapa hal yang mungkin melihat adalah fakta bahwa apa yang disebut live tiles 59 00:03:17,950 --> 00:03:21,470 benar-benar dapat menghidupkan, dan mereka dapat memberikan informasi kepada Anda - 60 00:03:21,470 --> 00:03:24,750 mungkin update pada statistik untuk permainan 61 00:03:24,750 --> 00:03:30,970 atau menunjukkan berita dari beberapa aplikasi sebelumnya bahwa di sini di sisi kiri. 62 00:03:30,970 --> 00:03:35,350 Di sana kami pergi. Saya yakin itu hanya positif dan berita fantastis besar. 63 00:03:35,350 --> 00:03:38,450 Anda bisa lihat di sini itu benar-benar menarik perhatian Anda kembali ke aplikasi, mengatakan, 64 00:03:38,450 --> 00:03:43,010 "Hei, ada sesuatu yang baru di sini. Lihatlah. Ayo kembali dan melihat apa yang baru untuk Anda." 65 00:03:43,010 --> 00:03:45,320 Itulah yang disebut ubin hidup, dan Anda dapat melakukan pemberitahuan 66 00:03:45,320 --> 00:03:47,070 baik langsung dari aplikasi itu sendiri 67 00:03:47,070 --> 00:03:52,220 atau jika anda melihat secara lebih rinci, Anda akan mengetahui bagaimana menulis sebuah layanan remote 68 00:03:52,220 --> 00:03:54,340 yang benar-benar dapat mendorong informasi ke ubin, 69 00:03:54,340 --> 00:03:56,520 yang adalah apa yang terjadi dengan aplikasi berita ini. 70 00:03:56,520 --> 00:04:00,080 Mereka benar-benar mendapatkan berita dari awan dan memperbarui ubin di sana 71 00:04:00,080 --> 00:04:03,710 sehingga orang tahu ada alasan untuk membuka aplikasi dan melihat 72 00:04:03,710 --> 00:04:06,950 pada apa pun berita terbaru adalah dalam salah satu 73 00:04:06,950 --> 00:04:10,060 atau jika ada resep baru atau skor tinggi baru untuk mengalahkan 74 00:04:10,060 --> 00:04:13,560 atau teman bermain atau apa pun pada aplikasi ini. 75 00:04:13,560 --> 00:04:15,550 Ini sesuatu untuk menarik perhatian Anda kembali masuk 76 00:04:15,550 --> 00:04:18,640 Jadi itulah ubin hidup, dan itu bisa menjadi seseorang, itu bisa menjadi sebuah situs web juga. 77 00:04:18,640 --> 00:04:20,790 Biasanya itu sebuah aplikasi. 78 00:04:20,790 --> 00:04:25,320 >> Hampir semua hal yang saya miliki di sini berasal dari Windows Store. Saya akan memulai itu. 79 00:04:25,320 --> 00:04:27,890 Ini salah satu aplikasi yang Anda dapatkan secara default 80 00:04:27,890 --> 00:04:30,350 pada setiap mesin yang menjalankan Windows 8. 81 00:04:30,350 --> 00:04:33,040 Anda bisa datang ke sini untuk menemukan apa pun yang Anda ingin, 82 00:04:33,040 --> 00:04:37,240 dari hal-hal yang disorot untuk game yang saya belum lihat sebelumnya. 83 00:04:37,240 --> 00:04:39,440 Oh, wow, kita punya pinball baru di sini. 84 00:04:39,440 --> 00:04:41,580 Anda dapat menginstal ini di sini dari toko, 85 00:04:41,580 --> 00:04:43,420 dan kita akan berbicara tentang bagaimana untuk mengembangkan ini. 86 00:04:43,420 --> 00:04:45,670 Anda memiliki banyak pilihan dalam cara Anda menciptakan mereka. 87 00:04:45,670 --> 00:04:49,020 Kami akan fokus pada cerita JavaScript dengan HTML dan CSS, 88 00:04:49,020 --> 00:04:52,790 tetapi kepada pengguna, untuk pembeli dari aplikasi, tidak peduli apa itu ditulis masuk 89 00:04:52,790 --> 00:04:54,670 Mereka bisa pergi ke depan dan bekerja dengannya. 90 00:04:54,670 --> 00:04:57,870 Saya tertarik dengan yang satu ini, jadi saya harus membuka ini dan melihat. 91 00:04:57,870 --> 00:05:02,310 Setiap aplikasi, termasuk orang-orang yang Anda bisa mengirimkan dan menjual atau memberikan secara gratis, 92 00:05:02,310 --> 00:05:06,240 apa pun yang Anda ingin lakukan di toko, akan mendapatkan halaman rumah seperti ini. 93 00:05:06,240 --> 00:05:10,750 Anda bisa mengirimkan aplikasi Anda dengan sekelompok screen shot - Anda melihat beberapa di sini - 94 00:05:10,750 --> 00:05:15,970 rincian tentang aplikasi, dan dari waktu ke waktu Anda akan mengumpulkan kedua peringkat - 95 00:05:15,970 --> 00:05:19,020 mereka pada dasarnya hanya rating bintang - dan ulasan, 96 00:05:19,020 --> 00:05:20,690 yang memberikan sedikit wawasan. 97 00:05:20,690 --> 00:05:24,380 Sebenarnya, seseorang harus mengetik sesuatu dan memberitahu Anda bagaimana awesome Anda, 98 00:05:24,380 --> 00:05:29,300 dan yang akan masuk ke bagian Ulasan Anda di sini, yang saya belum melihat. 99 00:05:29,300 --> 00:05:33,890 Fantastic. "Bahkan tidak akan terbuka." Betapa besar. 100 00:05:33,890 --> 00:05:39,000 Nah, untuk orang-orang untuk siapa ini tidak membuka dan menjalankan, mereka tampaknya benar-benar menikmatinya. [Tertawa] 101 00:05:39,000 --> 00:05:43,770 Ingatlah ini. The Internet. Siapapun dapat mengatakan apa yang mereka inginkan tentang aplikasi Anda. 102 00:05:43,770 --> 00:05:45,780 Jadi, pastikan Anda melakukan pekerjaan yang besar dengan itu, 103 00:05:45,780 --> 00:05:49,030 pastikan Anda menjadikannya sebagai nyaman bagi pengguna yang Anda bisa 104 00:05:49,030 --> 00:05:52,720 karena mereka beberapa klik saja dari menyediakan review, 105 00:05:52,720 --> 00:05:55,870 dan itu akan terakumulasi hingga keseluruhan rating review anda. 106 00:05:55,870 --> 00:05:58,990 Dan Anda ingin melakukan yang terbaik Anda karena Anda akan melawan aplikasi lain. 107 00:05:58,990 --> 00:06:01,830 Akan ada ribuan aplikasi yang sudah di toko, 108 00:06:01,830 --> 00:06:06,880 dan kemungkinan besar, mungkin ada sesuatu yang tidak fungsionalitas mirip dengan apa yang Anda lakukan. 109 00:06:06,880 --> 00:06:12,740 Jadi, jika Anda benar-benar dapat berdiri keluar dari keramaian, yang akan untuk keuntungan Anda, tentu saja. 110 00:06:12,740 --> 00:06:15,300 >> Kita akan masuk ke toko sedikit di kemudian hari. 111 00:06:15,300 --> 00:06:17,090 Aku benar-benar ingin fokus pada pembuatan aplikasi. 112 00:06:17,090 --> 00:06:20,760 Tapi versi pendek dari toko adalah distribusi di seluruh dunia, 113 00:06:20,760 --> 00:06:25,430 itu secara otomatis bagian dari Windows 8, orang hanya api itu dan lihatlah berbagai aplikasi di sini, 114 00:06:25,430 --> 00:06:29,070 Anda memiliki Dress-Up Sticker Book dan segala macam berbagai aplikasi. 115 00:06:29,070 --> 00:06:33,690 Cat segar, saya menggunakan ini banyak - buruk, tapi saya menggunakannya banyak. 116 00:06:33,690 --> 00:06:36,080 Ini menunjukkan bahwa aku sudah memilikinya. 117 00:06:36,080 --> 00:06:41,280 Mari saya tunjukkan sesuatu yang saya tidak memiliki - UVideos Saya tidak punya sebagai merek baru. 118 00:06:41,280 --> 00:06:43,660 Anda lihat di sini itu gratis, sehingga Anda dapat menginstalnya langsung dari toko. 119 00:06:43,660 --> 00:06:46,430 Anda memiliki pilihan juga. Anda tentu saja dapat memberikannya. 120 00:06:46,430 --> 00:06:49,660 Anda dapat menempatkan iklan di aplikasi atau game. 121 00:06:49,660 --> 00:06:54,770 Anda juga dapat biaya untuk itu, dan Anda bisa sangat mudah memberikan percobaan untuk aplikasi serta 122 00:06:54,770 --> 00:06:58,220 sehingga Anda dapat membiarkan orang mencobanya selama seminggu atau apa pun yang Anda ingin lakukan. 123 00:06:58,220 --> 00:07:01,540 Itu hanya disesuaikan melalui portal. Anda tidak menulis kode untuk itu. 124 00:07:01,540 --> 00:07:03,990 Jadi Anda mengatakan, "Anda dapat menggunakan ini selama seminggu dan kemudian Anda harus membelinya," 125 00:07:03,990 --> 00:07:07,130 atau Anda bisa melakukan hal-hal seperti, "Kamu bisa memainkan 3 tingkat pertama dari permainan ini 126 00:07:07,130 --> 00:07:09,820 "Dan kemudian Anda harus membeli untuk mengakses sisanya." 127 00:07:09,820 --> 00:07:12,310 Anda bahkan bisa dilakukan di-app pembelian juga, sehingga Anda bisa mengatakan, 128 00:07:12,310 --> 00:07:17,880 "Kami punya petualangan tambahan atau set grafis atau hal-hal yang akan dibuka - 129 00:07:17,880 --> 00:07:21,430 "Lebih resep yang akan dibuka -. Jika Anda membeli set ini diperpanjang" 130 00:07:21,430 --> 00:07:24,260 Dan Anda bisa melakukan itu semua dalam aplikasi atau game itu sendiri. 131 00:07:24,260 --> 00:07:26,070 Jadi, benar-benar terserah Anda, pilihan Anda. 132 00:07:26,070 --> 00:07:28,070 Ada banyak hal yang dapat Anda lakukan di toko, 133 00:07:28,070 --> 00:07:31,660 dan kemudian pada dasarnya Anda mengirimkan ke saluran sertifikasi. 134 00:07:31,660 --> 00:07:35,380 Kita bisa bicara tentang itu sedikit nanti, tapi ini adalah tujuan. 135 00:07:35,380 --> 00:07:40,410 Anda ingin mendapatkan aplikasi visibilitas di seluruh dunia Anda di toko di sini. 136 00:07:40,410 --> 00:07:44,170 >> Kembali pada layar Mulai di sini, saya ingin menunjukkan kepada Anda sekitar sedikit lebih. 137 00:07:44,170 --> 00:07:50,580 Jika saya memulai aplikasi ini, izinkan saya memberi Anda sebuah contoh dari beberapa fungsi cross-app di sini. 138 00:07:50,580 --> 00:07:53,070 Untuk melakukan itu, saya akan memulai Cat segar. 139 00:07:53,070 --> 00:07:55,550 Satu hal yang Anda akan melihat di sini adalah setiap bit tunggal dari layar, 140 00:07:55,550 --> 00:07:58,040 semua piksel layar, pergi ke aplikasi Anda. 141 00:07:58,040 --> 00:08:01,990 Lewatlah sudah hari-hari di mana Anda memiliki perbatasan di sekitar jendela ini 142 00:08:01,990 --> 00:08:05,120 dengan banyak tombol yang selalu ada mengambil ruang sepanjang waktu. 143 00:08:05,120 --> 00:08:09,430 Sekarang Anda benar-benar ingin pergi dari itu dan hanya memiliki konten Anda menjadi fokus. 144 00:08:09,430 --> 00:08:13,710 Kita bisa melakukan hal-hal dengan Windows dengan mengakses jenis lain dari menu. 145 00:08:13,710 --> 00:08:16,840 Salah satunya adalah benar-benar apa yang disebut pesona bar, 146 00:08:16,840 --> 00:08:18,870 dan keluar dari sisi layar. 147 00:08:18,870 --> 00:08:21,270 Anda benar-benar dapat beralih dari sisi jika Anda memiliki layar sentuh, 148 00:08:21,270 --> 00:08:24,840 Anda bisa klik kanan jika Anda memiliki mouse, ada cara pintas keyboard untuk itu, 149 00:08:24,840 --> 00:08:29,490 selalu ada lebih dari satu cara untuk melakukan sesuatu di lingkungan sini. 150 00:08:29,490 --> 00:08:31,680 Yang membawa keluar beberapa hal yang dapat Anda lakukan. 151 00:08:31,680 --> 00:08:33,870 Yang paling jelas adalah Anda dapat kembali ke layar Start, 152 00:08:33,870 --> 00:08:36,780 tapi yang lain 4 adalah apa yang disebut pesona. 153 00:08:36,780 --> 00:08:41,059 Mereka adalah kontrak yang dapat Anda plug ke sebagai pengembang app. Mereka cukup keren. 154 00:08:41,059 --> 00:08:43,340 Cari, aku yakin itu adalah sesuatu yang Anda akan lakukan, 155 00:08:43,340 --> 00:08:44,950 berbagi Aku akan menunjukkan kepada Anda dalam hitungan detik, 156 00:08:44,950 --> 00:08:48,450 dan Devices and Settings, ini adalah segala sesuatu yang aplikasi Anda dapat plug ke 157 00:08:48,450 --> 00:08:51,960 untuk memanfaatkan Windows, untuk mengatakan, "Saya telah melakukan bagian saya 158 00:08:51,960 --> 00:08:54,700 "Dan aku ingin Windows untuk mendukung beberapa fungsi lainnya, 159 00:08:54,700 --> 00:08:56,750 "Dan saya tidak ingin menulis banyak kode untuk membuat itu terjadi." 160 00:08:56,750 --> 00:08:59,480 Itu benar-benar manfaat dari menggunakan fitur ini. 161 00:08:59,480 --> 00:09:01,340 Mari saya tunjukkan satu. 162 00:09:01,340 --> 00:09:05,170 Untuk melakukan itu, saya akan membuat sebuah lukisan baru. 163 00:09:05,170 --> 00:09:08,240 Saya juga berbicara tentang menggunakan setiap pixel untuk aplikasi Anda. 164 00:09:08,240 --> 00:09:11,850 Secara default, ini adalah apa aplikasi cat tampak seperti ketika Anda menggunakannya. 165 00:09:11,850 --> 00:09:14,960 Ini benar-benar hanya tentang apa pun yang Anda menggambar, konten Anda. 166 00:09:14,960 --> 00:09:20,850 Aku bisa melakukan hal-hal mengerikan di sini. Apa yang harus saya menarik? Saya tidak tahu. 167 00:09:20,850 --> 00:09:23,110 Coretan? Oh, bagus. Aku bisa melakukan coretan. Fantastic. 168 00:09:23,110 --> 00:09:25,130 A kalkun? [Tertawa] 169 00:09:25,130 --> 00:09:28,500 Ini adalah kalkun paling abstrak Anda akan melihat. 170 00:09:28,500 --> 00:09:31,780 Saya juga bisa memunculkan apa yang disebut bar app, 171 00:09:31,780 --> 00:09:33,850 dan ini benar-benar salah satu cara utama yang dapat Anda gunakan 172 00:09:33,850 --> 00:09:37,210 untuk menyembunyikan diri semua hal yang mungkin telah di app atau permainan sebelum 173 00:09:37,210 --> 00:09:39,570 hanya mengambil ruang sepanjang waktu. 174 00:09:39,570 --> 00:09:43,270 Jadi sekarang Anda bisa menempatkannya di sini, dan ini benar-benar salah satu pengalaman yang lebih indah 175 00:09:43,270 --> 00:09:46,380 dengan bar app yang pernah saya lihat. 176 00:09:46,380 --> 00:09:48,800 Letakkan pilihan di sini untuk memilih warna yang berbeda. 177 00:09:48,800 --> 00:09:54,310 Kami ingin kalkun, jadi kita akan menaruh beberapa cokelat di sini, mulai pencampuran dalam beberapa warna. 178 00:09:54,310 --> 00:09:58,790 Kami akan mengambil warna antara sini dan kemudian kembali ke sini. 179 00:09:58,790 --> 00:10:02,990 Anda dapat mulai menggambar. Ada kalkun Anda. Fantastic. 180 00:10:02,990 --> 00:10:07,660 Saya tidak bisa menggambar untuk memulai dengan, tapi untuk melakukannya dengan touchpad di depan penonton bahkan lebih baik. 181 00:10:07,660 --> 00:10:09,640 Ini mengagumkan. 182 00:10:09,640 --> 00:10:13,030 Idenya, meskipun, adalah segala sesuatu yang saya pedulikan adalah di sini di permukaan. 183 00:10:13,030 --> 00:10:17,060 Katakanlah aku sangat puas dengan ini bahwa saya harus berbagi dengan seseorang. 184 00:10:17,060 --> 00:10:19,680 Biasanya apa yang akan Anda lakukan dengan versi lain dari Windows, 185 00:10:19,680 --> 00:10:22,900 Anda mungkin akan mengambil screen shot, Anda akan melakukan beberapa copy-paste teks Anda 186 00:10:22,900 --> 00:10:24,950 atau hal-hal seperti itu yang Anda inginkan untuk berbagi keluar, 187 00:10:24,950 --> 00:10:27,260 dan kemudian pergi dan membuka aplikasi lain dan memasukkannya ke dalamnya. 188 00:10:27,260 --> 00:10:28,630 Di sini Anda tidak perlu melakukan itu. 189 00:10:28,630 --> 00:10:32,400 Anda benar-benar dapat membawa keluar pesona bar dan berkata, "Saya ingin berbagi ini." 190 00:10:32,400 --> 00:10:35,000 Pada titik ini akan menampilkan semua aplikasi 191 00:10:35,000 --> 00:10:38,080 yang tahu bagaimana bekerja dengan apa pun yang sedang dibagi. 192 00:10:38,080 --> 00:10:41,590 Dalam hal ini adalah gambar, sehingga akan mengatakan, "Saya melihat Anda punya gambar." 193 00:10:41,590 --> 00:10:45,590 "Apakah Anda ingin berbagi?" Anda dapat melihat saya email sendiri hal-hal sepanjang waktu. 194 00:10:45,590 --> 00:10:49,420 Ia mengakui bahwa, dan itu menawarkan saya bahwa sebagai cara pintas, 195 00:10:49,420 --> 00:10:53,270 tapi itu juga menunjukkan kepada saya setiap aplikasi yang tahu bagaimana berurusan dengan mengambil gambar 196 00:10:53,270 --> 00:10:55,520 dan melakukan sesuatu dengan itu. 197 00:10:55,520 --> 00:10:57,890 Ini semua menunjukkan ke Windows bahwa mereka bisa melakukan itu. 198 00:10:57,890 --> 00:10:59,240 Pada titik ini ini adalah Windows. 199 00:10:59,240 --> 00:11:01,680 Pengguna hanya memilih apa yang mereka ingin lakukan dengan itu. 200 00:11:01,680 --> 00:11:06,610 Aku akan melakukan yang biasa PuzzleTouch. Anda dapat melihat saya telah membuat segala macam teka-teki dari waktu ke waktu. 201 00:11:06,610 --> 00:11:11,790 Aku akan mengambil PuzzleTouch dan berkata, "Saya ingin berbagi kreasi luar biasa ini dengan PuzzleTouch." 202 00:11:11,790 --> 00:11:16,670 Ini akan pergi ke depan dan berkata, "Bagus. Anda ingin berbagi ini? Fantastic." 203 00:11:16,670 --> 00:11:19,260 "Apakah Anda ingin membuat teka-teki yang mudah, menengah, apa pun?" 204 00:11:19,260 --> 00:11:20,800 Aku akan membuat satu perantara di sini. 205 00:11:20,800 --> 00:11:24,890 Itu membuat teka-teki. Ini akan menjadi teka-teki yang mengerikan karena itu sebagian besar kosong. 206 00:11:24,890 --> 00:11:28,100 Tapi itu siap, dan itu sebenarnya kembali dalam aplikasi lain. 207 00:11:28,100 --> 00:11:32,360 Jika saya datang ke sini, aku dapat mencari dan meluncurkannya. 208 00:11:32,360 --> 00:11:38,100 Sekarang jika kita gulir atas hanya sedikit di sini, kita harus melihat ciptaan saya di suatu tempat. 209 00:11:38,100 --> 00:11:42,930 Mana aku pergi? Apa jenis puzzle yang saya buat? Apakah aku membuatnya mudah? 210 00:11:42,930 --> 00:11:46,110 Oh, itu dia, di sana. 211 00:11:46,110 --> 00:11:49,550 [Terkekeh] Ini kalkun teka-teki mudah dikenali yang ada di sini. 212 00:11:49,550 --> 00:11:52,360 Tapi hal yang saya ingin menunjukkan kepada Anda, hal yang keren di sini 213 00:11:52,360 --> 00:11:54,710 adalah aplikasi tidak tahu apa-apa tentang satu sama lain. 214 00:11:54,710 --> 00:11:58,740 Mereka hanya berkata, "Aku punya gambar untuk berbagi, dan saya tahu bagaimana menangani dengan gambar." 215 00:11:58,740 --> 00:12:01,420 Dan Anda sebagai pengembang, Anda tidak perlu menulis kode yang. 216 00:12:01,420 --> 00:12:05,350 Ketika seseorang meminta saya untuk berbagi, aku akan menaruh beberapa data ke dalam struktur data kecil ini 217 00:12:05,350 --> 00:12:06,740 dan aku sudah selesai. 218 00:12:06,740 --> 00:12:10,990 Aplikasi lain mengambil alih, melakukan hal tersebut, dan itulah akhir dari pengalaman berbagi. 219 00:12:10,990 --> 00:12:14,550 Itu baru satu hal yang dapat Anda lakukan - benar-benar, benar-benar kuat - 220 00:12:14,550 --> 00:12:17,570 dan itu akan menjadi salah satu hal yang benar-benar bisa membantu membedakan aplikasi Anda 221 00:12:17,570 --> 00:12:20,090 dan juga permainan Anda juga di toko. 222 00:12:20,090 --> 00:12:22,220 Orang-orang akan bisa mengatakan, "Ini benar-benar berguna." 223 00:12:22,220 --> 00:12:25,430 "Saya menggunakan pencipta teka-teki ini sepanjang waktu. Ini fantastis." 224 00:12:25,430 --> 00:12:30,490 >> Itu sekitar cukup gambaran singkat tentang apa yang terjadi di sini. 225 00:12:30,490 --> 00:12:33,670 Ada beberapa fitur lain juga yang mungkin kita akan menyoroti seperti yang kita pergi melalui kode. 226 00:12:33,670 --> 00:12:37,710 Tapi aku ingin menyelam ke dalam slide, dan untuk melakukan itu, aku akan pergi ke Desktop, 227 00:12:37,710 --> 00:12:40,940 yang itu sendiri genteng hidup lain di sini. 228 00:12:40,940 --> 00:12:43,840 Aku bisa pergi ke ini dan, tentu saja, aku pada slide saya, 229 00:12:43,840 --> 00:12:46,320 tapi biarkan saya menunjukkan Anda benar-benar di mana kita berada. 230 00:12:46,320 --> 00:12:48,460 Kami benar-benar dalam mode Desktop. 231 00:12:48,460 --> 00:12:52,580 Ini benar-benar di mana apa yang saya katakan sebelumnya tentang Windows membawa ke depan 232 00:12:52,580 --> 00:12:54,850 terhadap pengalaman baru menunjukkan dirinya. 233 00:12:54,850 --> 00:12:56,450 Ini adalah Windows Anda tahu. 234 00:12:56,450 --> 00:12:59,730 Aplikasi Windows yang disebut aplikasi desktop. Mereka berjalan di sini. 235 00:12:59,730 --> 00:13:02,730 Jika Anda telah ada aplikasi dan Anda ingin menjalankannya pada Windows 8, 236 00:13:02,730 --> 00:13:04,710 Anda benar-benar bisa melakukan itu. 237 00:13:04,710 --> 00:13:07,590 Ini bukan hal yang sama seperti aplikasi toko, yang ada di sini, 238 00:13:07,590 --> 00:13:12,240 seperti Paint Segar dan aplikasi ini NBC News dan hal-hal seperti itu. Mereka akan datang dari toko. 239 00:13:12,240 --> 00:13:14,450 Mereka dapat menyambung ke beberapa fitur yang saya menunjukkan kepada Anda 240 00:13:14,450 --> 00:13:16,620 dan lain-lain yang saya belum menunjukkan Anda hanya belum. 241 00:13:16,620 --> 00:13:21,460 Tapi ingatlah bahwa dalam pikiran. Kami memiliki dukungan untuk kedua hal ini juga. 242 00:13:21,460 --> 00:13:27,000 Maafkan aku. Adalah sesuatu yang tidak tampak di layar? Aku sudah kehilangan sepenuhnya. Itu aneh. 243 00:13:29,000 --> 00:13:31,000 Oke. Terima kasih untuk menunjukkan hal itu. 244 00:13:31,000 --> 00:13:34,770 Apa yang Anda belum melihat untuk sementara adalah saya menunjukkan kepada Anda bahwa desktop adalah di sini. 245 00:13:34,770 --> 00:13:37,540 Apa hal terakhir yang Anda lihat? Apakah Anda melihat ini? 246 00:13:37,540 --> 00:13:39,490 Ini adalah desktop. Anda sudah tahu apa yang tampak seperti. 247 00:13:39,490 --> 00:13:42,070 Ini tidak ada yang sangat tidak biasa. 248 00:13:42,070 --> 00:13:46,940 Ini kami membawa pengalaman yang maju untuk Anda dan membiarkan Anda menggunakan hal-hal yang Anda punya. 249 00:13:46,940 --> 00:13:50,460 Sebagai contoh, saya akan menunjukkan kepada Anda Visual Studio. Itu adalah sebuah aplikasi desktop. 250 00:13:50,460 --> 00:13:52,600 Ini akan berjalan dalam mode ini. 251 00:13:52,600 --> 00:13:54,960 Ini akan mendukung lingkungan yang lebih kompleks 252 00:13:54,960 --> 00:14:01,470 dengan banyak pilihan dan hal-hal seperti itu, sehingga membuatnya menjadi pilihan yang baik sebagai aplikasi desktop. 253 00:14:01,470 --> 00:14:04,810 >> Yang mengatakan, mari kita pergi ke slide untuk hanya sedikit 254 00:14:04,810 --> 00:14:09,720 dan memberikan beberapa konten pengantar dan kemudian benar-benar masuk ke coding di sini. 255 00:14:09,720 --> 00:14:14,070 Kabar baiknya adalah saya pernah mendengar Anda telah berfokus pada banyak CSS dan JavaScript, HTML. 256 00:14:14,070 --> 00:14:18,110 Semua hal-hal yang Anda telah membawa pembelajaran langsung untuk membuat Windows apps Store. 257 00:14:18,110 --> 00:14:22,920 Hal-hal yang Anda telah mendengar tentang dengan menerapkan CSS dan semua hal-hal 258 00:14:22,920 --> 00:14:27,180 adalah apa yang Anda lakukan untuk membuat aplikasi di sini untuk toko. 259 00:14:27,180 --> 00:14:29,640 Kita akan pergi melalui hal-hal ini sedikit demi sedikit. 260 00:14:29,640 --> 00:14:34,130 Pada dasarnya, saya sedang membangun pada hal-hal yang Anda sudah meluangkan waktu untuk belajar. 261 00:14:34,130 --> 00:14:36,520 Ini adalah bagan keseluruhan teknologi yang dapat Anda gunakan 262 00:14:36,520 --> 00:14:38,790 untuk membuat aplikasi untuk Windows 8. 263 00:14:38,790 --> 00:14:42,840 Hal-hal di sebelah kanan, yang aplikasi desktop, benar-benar apa yang sudah kita ketahui. 264 00:14:42,840 --> 00:14:46,840 Itulah hal-hal yang benar-benar Windows 7 dunia dipindahkan ke Windows 8. 265 00:14:46,840 --> 00:14:51,920 Semua pilihan tersebut meneruskan: C #, VB, Win32 jenis pembangunan. 266 00:14:51,920 --> 00:14:54,450 Besar. Ah, itu bukan apa-apa. Hal-hal baru di sisi kiri. 267 00:14:54,450 --> 00:14:58,220 Itu Windows apps Store, saat itulah saya ingin mendapatkan aplikasi saya kabel ke Windows 8 268 00:14:58,220 --> 00:15:02,300 menggunakan semua fitur tersebut, mendapatkan ke toko, dan mendapatkan pengalaman yang benar-benar keren 269 00:15:02,300 --> 00:15:05,260 dari aplikasi Windows Store. 270 00:15:05,260 --> 00:15:10,350 Untuk melakukan itu, Anda bisa lihat di sini Anda punya semua pilihan Anda dengan XAML, C + +, 271 00:15:10,350 --> 00:15:14,100 C #, VB, Anda bisa melakukan DirectX, hal-hal seperti itu, hal-hal yang melampaui slide. 272 00:15:14,100 --> 00:15:18,650 Tetapi bagi kita, kita akan fokus tepat di pada kenyataan bahwa HTML, CSS, dan JavaScript 273 00:15:18,650 --> 00:15:22,890 benar-benar warga negara kelas pertama untuk membuat aplikasi untuk Windows 8 274 00:15:22,890 --> 00:15:24,960 dan untuk Store Windows. 275 00:15:24,960 --> 00:15:27,950 Jadi ini adalah baik untuk semua orang di sini dan orang-orang menonton video 276 00:15:27,950 --> 00:15:30,760 karena Anda hanya dapat memanfaatkan semua pengalaman-pengalaman yang Anda miliki 277 00:15:30,760 --> 00:15:33,900 dan benar-benar mengikat ke dalam apa yang menawarkan Windows. 278 00:15:33,900 --> 00:15:37,870 Kau akan melakukan itu melalui satu set API, yang seharusnya tidak mengejutkan. 279 00:15:37,870 --> 00:15:39,920 Setiap OS memiliki API sendiri. 280 00:15:39,920 --> 00:15:43,530 Kami mengekspos apa yang Windows dapat melakukannya melalui apa yang disebut WinRT. 281 00:15:43,530 --> 00:15:46,370 Ini satu set API yang hanya melakukan semuanya untuk Anda. 282 00:15:46,370 --> 00:15:51,650 Jika Anda perlu membuka file, Anda perlu menggunakan kamera, geolocation, hal-hal seperti itu, 283 00:15:51,650 --> 00:15:55,700 mereka pergi melalui apa yang Windows dapat menawarkan kepada Anda. 284 00:15:55,700 --> 00:15:59,370 Untuk mengakses, kita memiliki beberapa JavaScript yang lebih yang akan membuatnya lebih mudah 285 00:15:59,370 --> 00:16:02,510 bagi Anda untuk melakukan itu. Kita akan mendapatkan bahwa dalam beberapa saat. 286 00:16:02,510 --> 00:16:04,060 Tapi untuk saat ini, yang pada dasarnya peta jalan Anda. 287 00:16:04,060 --> 00:16:06,770 Hal-hal yang Anda sudah lakukan di atas beberapa API 288 00:16:06,770 --> 00:16:11,280 yang membantu Anda bekerja dengan Windows sama dengan app store. 289 00:16:11,280 --> 00:16:14,210 Dan itu benar-benar tentang semua yang Anda harus tahu dari tingkat tinggi. 290 00:16:14,210 --> 00:16:17,370 >> Kita akan menyelam ke benar-benar bekerja dengan hal-hal yang sekarang. 291 00:16:18,940 --> 00:16:21,950 Hal-hal yang Anda mungkin sudah melihat banyak, 292 00:16:21,950 --> 00:16:26,760 dengan IE9 sedikit waktu kembali kami memperkenalkan dukungan untuk banyak, pada saat itu, 293 00:16:26,760 --> 00:16:30,340 standar baru di Web, sehingga banyak fitur CSS baru, 294 00:16:30,340 --> 00:16:34,380 banyak baru HTML, ECMAScript 5, yang benar-benar JavaScript. 295 00:16:34,380 --> 00:16:38,090 Jadi semuanya untuk itu kecuali untuk modus ketat berada di IE9. 296 00:16:38,090 --> 00:16:42,290 Hanya satu ton barang dengan CSS, CSS3, semua ada di sana. 297 00:16:42,290 --> 00:16:45,300 Dan semua hal ini membawa maju ke apa yang kita lakukan dengan Windows 8. 298 00:16:45,300 --> 00:16:49,350 Anda dapat menggunakan hal-hal ini, dan Anda dapat menggunakan segala sesuatu yang baru di IE10. 299 00:16:49,350 --> 00:16:54,640 Dengan IE10 kami memperkenalkan dukungan untuk semua hal-hal ini juga. 300 00:16:54,640 --> 00:16:59,340 Mereka semua hardware-accelerated, jadi jika Anda berada di sebuah mesin yang memiliki beberapa jenis GPU, 301 00:16:59,340 --> 00:17:04,190 yang mungkin cukup banyak setiap mesin yang Anda bisa mendapatkan dalam 8 tahun terakhir, 302 00:17:04,190 --> 00:17:07,609 Anda akan dapat memiliki output hardware-accelerated, 303 00:17:07,609 --> 00:17:11,770 keluaran visual dengan CSS, Canvas, SVG. 304 00:17:11,770 --> 00:17:14,339 Semua hal akan melalui akselerasi hardware 305 00:17:14,339 --> 00:17:16,060 dan menjadi yang jauh lebih cepat dan lebih efisien. 306 00:17:16,060 --> 00:17:20,440 Versi pendek dari semua ini - aku tidak akan pergi melalui setiap hal di sini - 307 00:17:20,440 --> 00:17:23,200 jika Anda melihatnya dalam daftar ini, jika Anda dapat melakukannya di IE10, 308 00:17:23,200 --> 00:17:25,650 jika itu adalah aplikasi web yang Anda menjalankan yang bekerja di IE10, 309 00:17:25,650 --> 00:17:28,640 itu adalah sesuatu yang dapat Anda lakukan sebagai aplikasi Windows Store. 310 00:17:28,640 --> 00:17:33,100 Dan itu cukup banyak itu. Jadi jika bekerja di IE10, itu akan bekerja sebagai aplikasi Windows Store. 311 00:17:33,100 --> 00:17:36,370 Ini di atas meja sebagai sesuatu yang dapat Anda gunakan. 312 00:17:36,370 --> 00:17:40,510 >> Ada banyak di sini. Kami tidak memiliki waktu sampai tengah malam, jadi aku tidak bisa meninjau semuanya di sini. 313 00:17:40,510 --> 00:17:44,060 Tapi ada beberapa situs yang akan membantu Anda memahami apa yang bisa melakukan hal-hal ini, 314 00:17:44,060 --> 00:17:45,520 dan aku akan menunjukkan kepada Anda salah satu dari mereka dalam hitungan detik. 315 00:17:45,520 --> 00:17:48,410 Aku hanya ingin menunjukkan beberapa hal penting yang mungkin Anda melihat. 316 00:17:48,410 --> 00:17:51,560 Mungkin Anda sudah melihat beberapa dari ini dalam studi Anda, 317 00:17:51,560 --> 00:17:56,610 tetapi ini benar-benar membantu, khususnya dengan Windows apps Store, dari sisi CSS. 318 00:17:56,610 --> 00:18:02,420 Jadi mampu melakukan transformasi dan transisi, memberikan gerak dengan animasi - 319 00:18:02,420 --> 00:18:07,010 ini semua bagian dari CSS sekarang, dan mereka semua didukung oleh browser modern, 320 00:18:07,010 --> 00:18:11,370 dan IE10 dan IE9 telah menambahkan dukungan dari waktu ke waktu untuk semua hal-hal ini. 321 00:18:11,370 --> 00:18:15,220 Dan jadi mengapa menulis sendiri, mengapa harus melalui semua kesulitan melakukan hal-hal ini dengan tangan 322 00:18:15,220 --> 00:18:19,970 ketika Anda bisa menggunakan mengubah CSS sederhana untuk menciptakan efek 3D untuk aplikasi Anda? 323 00:18:19,970 --> 00:18:22,740 Besar. Itulah cara kerjanya. 324 00:18:22,740 --> 00:18:24,530 Saya tidak bisa membuatnya lebih sulit dari itu. 325 00:18:24,530 --> 00:18:28,330 Jika Anda tahu bagaimana melakukannya di CSS, Anda tahu bagaimana melakukannya dalam aplikasi Windows Store. 326 00:18:28,330 --> 00:18:32,080 >> Di luar itu untuk tata letak, hal-hal seperti bahkan app store, 327 00:18:32,080 --> 00:18:35,350 tetapi akan lebih dari itu, melihat mungkin app berita yang menunjukkan Anda artikel 328 00:18:35,350 --> 00:18:40,160 atau resep atau hal-hal seperti itu, ini jenis lain dari fitur dalam CSS benar-benar berguna: 329 00:18:40,160 --> 00:18:45,610 Grid, Flexbox, CSS Kawasan lebih dari standar yang cukup baru juga. 330 00:18:45,610 --> 00:18:51,190 Hal-hal ini semua akan membantu Anda lay out konten dan aliran konten antara bagian, 331 00:18:51,190 --> 00:18:55,470 dapat melakukan pagination dan hyphenation tanpa Anda harus menulis hal-hal sendiri. 332 00:18:55,470 --> 00:18:57,500 Anda hanya mengatakan, "Silakan lakukan hal berikut untuk saya," 333 00:18:57,500 --> 00:19:00,850 dan sebagai layar real estat berbeda pada mesin yang berbeda 334 00:19:00,850 --> 00:19:03,850 atau karena Anda akan lihat sebentar lagi, setelah Anda snap aplikasi 335 00:19:03,850 --> 00:19:07,920 memiliki jumlah yang lebih kecil ruang pada layar, itu tidak masalah untuk CSS. 336 00:19:07,920 --> 00:19:11,160 Hal ini dapat mengambil keuntungan dari - talk Kita akan tentang permintaan media dalam kedua - 337 00:19:11,160 --> 00:19:15,880 dapat mengurus hal-hal dengan reposisi konten Anda, mengalir konten dari daerah 338 00:19:15,880 --> 00:19:21,240 hanya dengan hal-hal yang Anda mungkin telah melihat dengan teknologi web. 339 00:19:21,240 --> 00:19:25,470 >> Di sisi HTML5, ada juga banyak hal 340 00:19:25,470 --> 00:19:28,140 yang akan sangat membantu bagi Anda dengan Windows apps Store. 341 00:19:28,140 --> 00:19:30,980 Sekali lagi, kita tidak akan melalui semua ini, tapi mereka hanya di sini. 342 00:19:30,980 --> 00:19:35,470 Jadi jika Anda perlu untuk menggunakannya, audio-video, jika Anda ingin melakukan validasi dari bentuk, 343 00:19:35,470 --> 00:19:40,570 geolocation, semua hal yang dapat Anda lakukan dalam JavaScript dengan JavaScript 5 atau ECMAScript 5, 344 00:19:40,570 --> 00:19:44,070 IndexedDB untuk penyimpanan lokal - ini semua pilihan untuk Anda. 345 00:19:44,070 --> 00:19:49,300 Jika Anda sedang mencari jawaban, hanya melihat ke teknologi yang sudah ada dengan HTML5 dan CSS 346 00:19:49,300 --> 00:19:53,880 dan Anda akan menemukan jawaban lebih mudah daripada harus memutar banyak hal yang sendiri. 347 00:19:53,880 --> 00:19:55,510 Mari saya menunjukkan sekitar sedikit di sini. 348 00:19:55,510 --> 00:19:57,920 Aku punya situs kita bisa pergi ke. 349 00:19:57,920 --> 00:20:01,590 Biarkan aku berhenti dari geser ini untuk kedua. 350 00:20:01,590 --> 00:20:06,450 >> Jika kita pergi ke IETestDrive.com, 351 00:20:06,450 --> 00:20:08,960 Aku tidak akan berbuat banyak dari demo di sini. 352 00:20:08,960 --> 00:20:14,360 IETestDrive.com benar-benar menunjukkan Anda banyak apa yang baru dengan IE10, 353 00:20:14,360 --> 00:20:16,220 hal-hal yang dapat Anda lakukan. 354 00:20:16,220 --> 00:20:19,130 Saya menemukan ini benar-benar berguna karena bukannya membaca melalui sekelompok kertas putih, 355 00:20:19,130 --> 00:20:23,020 melihat beberapa demo, dan itu akan membantu Anda meletakkannya di radar pribadi Anda sendiri 356 00:20:23,020 --> 00:20:26,620 tentang apakah teknologi masuk akal bahkan melakukan penelitian yang lebih dengan 357 00:20:26,620 --> 00:20:29,070 sehingga Anda akan memahami, "Aku melihat apa yang ini adalah untuk." 358 00:20:29,070 --> 00:20:32,780 "Saya mengerti apa Request Animasi Bingkai tidak bagi saya." 359 00:20:32,780 --> 00:20:36,900 "Saya mengerti bagaimana saya bisa menggunakan Daerah atau filter SVG." 360 00:20:36,900 --> 00:20:40,190 Anda melihat mereka beraksi, melihat mereka pada contoh di sini, 361 00:20:40,190 --> 00:20:44,930 dan memutuskan untuk diri sendiri jika itu akan berguna untuk Anda dalam proyek Anda sendiri dan di luar 362 00:20:44,930 --> 00:20:47,840 Anda terus bekerja dengan teknologi web. 363 00:20:47,840 --> 00:20:49,900 Di sini saya hanya akan mendorong Anda untuk melihat. 364 00:20:49,900 --> 00:20:52,880 Saya tidak berpikir saya akan menghabiskan banyak waktu benar-benar berjalan ini. 365 00:20:52,880 --> 00:20:56,030 Kami punya cukup untuk menunjukkan dengan menulis kode. 366 00:20:56,030 --> 00:21:01,640 Anda akan melihat di sini hal-hal dari efek sentuh untuk game berbasis sentuhan di bagian tersebut, 367 00:21:01,640 --> 00:21:06,050 animasi, hardware-accelerated sangat cepat animasi di sana, 368 00:21:06,050 --> 00:21:11,230 beberapa optimasi yang akan Anda lihat dalam beberapa sampel ini juga, 369 00:21:11,230 --> 00:21:12,770 dan ada banyak, banyak lagi. 370 00:21:12,770 --> 00:21:15,330 Jika Anda pergi di sini dan membuka peta situs, 371 00:21:15,330 --> 00:21:19,070 hanya ada sejumlah konyol sampel di sini. 372 00:21:19,070 --> 00:21:20,690 Anda dapat melihat mereka semua di sini. 373 00:21:20,690 --> 00:21:22,900 Jika Anda sedang mencari sesuatu atau Anda mendengar tentang sesuatu 374 00:21:22,900 --> 00:21:25,850 dan Anda ingin tahu mungkin ini akan menjadi sesuatu yang keren untuk digunakan dalam aplikasi, 375 00:21:25,850 --> 00:21:31,720 coba cari di sini, dan mungkin ada demo yang cukup baik untuk itu untuk menyelamatkan diri beberapa waktu. 376 00:21:31,720 --> 00:21:35,980 >> Oke? Setiap pertanyaan sejauh ini untuk orang-orang di sini? 377 00:21:35,980 --> 00:21:39,620 Oke. Kami akan terus di sini. 378 00:21:39,620 --> 00:21:41,920 Sekali lagi, hanya memeriksa yang keluar. 379 00:21:41,920 --> 00:21:45,450 Mereka adalah standar web, jadi pergi ke situs-situs showcase lain yang Anda tahu 380 00:21:45,450 --> 00:21:50,550 dan melihat apakah teknologi tersebut masuk akal untuk apa yang Anda coba lakukan. 381 00:21:50,550 --> 00:21:53,190 >> Kembali ke slide. 382 00:21:53,190 --> 00:22:00,290 Yang mengatakan, Anda pindah dari dunia Web untuk benar-benar dipasang dunia aplikasi lokal, 383 00:22:00,290 --> 00:22:01,850 sehingga ada beberapa hal untuk menunjukkan di sini. 384 00:22:01,850 --> 00:22:03,690 Pertama-tama, tidak ada web server yang terlibat di sini. 385 00:22:03,690 --> 00:22:06,120 Tidak ada Apache, tidak ada IIS berjalan di sini 386 00:22:06,120 --> 00:22:10,170 melayani sampai halaman ke klien remote, ke agen remote browser. 387 00:22:10,170 --> 00:22:13,000 Dalam hal ini, benar-benar semuanya dikemas untuk Anda. 388 00:22:13,000 --> 00:22:16,630 Anda mengirimkan aplikasi Anda ke toko, hal itu akan disertifikasi, 389 00:22:16,630 --> 00:22:22,190 itu keluar di toko, dan kemudian orang-orang dengan ribuan akan menginstal permainan atau aplikasi Anda. 390 00:22:22,190 --> 00:22:24,780 Tapi pada dasarnya, mereka menariknya ke bawah secara lokal untuk mesin mereka. 391 00:22:24,780 --> 00:22:29,080 Tidak perlu untuk pergi keluar ke Web lagi kecuali jika Anda memiliki panggilan yang membutuhkan API terpencil, 392 00:22:29,080 --> 00:22:31,790 dan itu sangat normal serta juga. 393 00:22:31,790 --> 00:22:35,330 Tapi mereka tidak akan berada di mode mana mereka harus pergi respon permintaan dari server 394 00:22:35,330 --> 00:22:37,910 untuk mendapatkan halaman berikutnya dari konten mereka. 395 00:22:37,910 --> 00:22:41,380 Jadi mengatakan bahwa, ada beberapa perbedaan kecil API beberapa. Ini adalah sangat kecil. 396 00:22:41,380 --> 00:22:46,850 Mereka tidak akan memukul Anda di coding normal, tapi mereka setidaknya didokumentasikan. 397 00:22:46,850 --> 00:22:50,030 Mereka jenis tepi kasus ada. 398 00:22:50,030 --> 00:22:53,370 >> Hal lain yang bernilai menunjukkan adalah perbedaan kepercayaan. 399 00:22:53,370 --> 00:22:58,070 Saya hanya menyebutkan hal ini karena saya hanya ingin memastikan aku mengatakannya 400 00:22:58,070 --> 00:23:01,580 jadi jika Anda mengalami nanti, Anda akan berpikir, "kata Chris sesuatu tentang hal ini, 401 00:23:01,580 --> 00:23:04,890 "Jadi mungkin, ya, oke," dan kemudian Anda kembali dan Anda mencari tahu apa itu. 402 00:23:04,890 --> 00:23:06,480 Konteks masalah. 403 00:23:06,480 --> 00:23:11,450 Secara default kita mencoba untuk melindungi pengguna dari vektor serangan. 404 00:23:11,450 --> 00:23:13,400 Ada hal-hal tertentu yang dapat Anda lakukan secara default 405 00:23:13,400 --> 00:23:16,130 dan hal-hal tertentu Anda perlu mengubah konteks untuk mengaktifkan. 406 00:23:16,130 --> 00:23:19,860 Saat Anda menggunakan beberapa perpustakaan di luar sana - Anda sudah sudah bekerja dengan jQuery, 407 00:23:19,860 --> 00:23:23,650 tetapi jika Anda mencari perpustakaan lain di luar sana - Anda mungkin menggunakan beberapa fungsi 408 00:23:23,650 --> 00:23:28,000 semacam itu melampaui penggunaan lokal, apakah interaksi yang lebih dinamis 409 00:23:28,000 --> 00:23:30,360 Permintaan XHR, hal-hal seperti itu. 410 00:23:30,360 --> 00:23:33,090 Kadang-kadang Anda mungkin menemukan mereka akan dinonaktifkan secara default, 411 00:23:33,090 --> 00:23:37,790 dan dalam hal ini, hanya melakukan pencarian, mencari konteks lokal dan web, 412 00:23:37,790 --> 00:23:39,560 dan Anda akan menemukan cara untuk memperbaikinya. 413 00:23:39,560 --> 00:23:42,580 Pastikan Anda tahu tentang hal itu ketika Anda mulai menggunakan kerangka kerja lainnya, 414 00:23:42,580 --> 00:23:45,720 yang, saya harus menyebutkan, kau sangat mampu yang dapat dilakukan. 415 00:23:45,720 --> 00:23:49,290 Jadi jika Anda menemukan beberapa kerangka lain - talk Kita akan tentang hal ini dalam satu detik - 416 00:23:49,290 --> 00:23:54,000 untuk gaming dan Anda ingin menggunakannya, Anda ingin menggunakan beberapa perpustakaan kontrol yang di luar sana 417 00:23:54,000 --> 00:23:57,990 dan Anda tidak ingin menulis hal-hal yang sendiri - itu adalah ide yang baik, kan? - 418 00:23:57,990 --> 00:23:59,560 Anda benar-benar dapat menggunakan hal-hal ini. 419 00:23:59,560 --> 00:24:03,660 Tidak ada yang menahan Anda menggunakan jenis perpustakaan yang didasarkan pada JavaScript, 420 00:24:03,660 --> 00:24:05,380 CSS, HTML5. 421 00:24:05,380 --> 00:24:09,740 Sekali lagi, jika itu adalah sesuatu yang dapat Anda lakukan di IE10, yang merupakan heck of a lot hari ini, 422 00:24:09,740 --> 00:24:11,220 Anda bisa melakukannya. 423 00:24:11,220 --> 00:24:14,800 Tarik ke dalam aplikasi Anda, referensi perpustakaan JavaScript, dan menggunakannya dalam aplikasi Anda, 424 00:24:14,800 --> 00:24:19,880 hanya dengan mengingat Anda mungkin memukul konteks keamanan sekali-sekali - tidak terlalu sering. 425 00:24:19,880 --> 00:24:24,150 >> Dan kemudian fitur, kita akan pergi ke beberapa dari mereka seperti yang kita pergi. 426 00:24:24,150 --> 00:24:27,500 UX Anda akan jenis terbiasa seperti yang Anda lihat semakin banyak aplikasi 427 00:24:27,500 --> 00:24:29,250 dari Toko Windows. 428 00:24:29,250 --> 00:24:33,870 Anda bisa merasakan bagaimana mereka bekerja dan bagaimana estetika desain cenderung bekerja 429 00:24:33,870 --> 00:24:37,720 seluruh aplikasi yang berbeda dan apa yang orang akan digunakan untuk mengalami. 430 00:24:37,720 --> 00:24:39,660 Itu benar-benar bagian penting. 431 00:24:39,660 --> 00:24:42,460 Pastikan bahwa ketika mereka jalankan aplikasi Anda, mereka tidak perlu membaca manual, 432 00:24:42,460 --> 00:24:44,300 yang tidak pernah mereka lakukan, by the way. 433 00:24:44,300 --> 00:24:46,650 Mereka hanya harus dapat mulai bermain dengan aplikasi Anda 434 00:24:46,650 --> 00:24:49,450 dan memahaminya tanpa banyak kesulitan. 435 00:24:49,450 --> 00:24:52,660 Dengan tetap berpegang dan mengikuti banyak praktek-praktek ini, 436 00:24:52,660 --> 00:24:57,640 Anda akan melakukan pengguna Anda nikmat yang besar, membuat yang lebih mudah. 437 00:24:57,640 --> 00:25:01,810 >> Oke. Satu hal terakhir di sisi API dan kemudian kita akan masuk ke dalam benar-benar menulis kode. 438 00:25:01,810 --> 00:25:05,660 WinJS adalah bahwa hal yang saya sebutkan sangat singkat dengan slide yang kompleks 439 00:25:05,660 --> 00:25:08,850 dengan semua pilihan yang berbeda yang Anda miliki untuk membuat aplikasi. 440 00:25:08,850 --> 00:25:10,890 WinJS, Anda dapat menganggapnya sebagai seorang teman. 441 00:25:10,890 --> 00:25:13,680 Ini teman Anda untuk membantu Anda menuliskan hal-hal lebih cepat. 442 00:25:13,680 --> 00:25:18,820 Hanya saja JavaScript dan CSS. Anda tidak harus menggunakannya. Anda dapat menggunakannya. 443 00:25:18,820 --> 00:25:22,180 Jika Anda akan menelepon ke fitur Windows, Anda akan berakhir menggunakannya, 444 00:25:22,180 --> 00:25:27,210 tetapi jika ada hal-hal seperti beberapa pola desain atau kontrol yang Anda benar-benar tidak ingin menggunakan, 445 00:25:27,210 --> 00:25:29,090 Anda ingin menggunakan sesuatu yang lain, itu terserah Anda. 446 00:25:29,090 --> 00:25:32,580 Tentukan apa yang ingin Anda gunakan dan gaya yang ingin Anda gunakan. 447 00:25:32,580 --> 00:25:37,250 Fitur dari namespacing dan kelas generasi - terserah Anda. 448 00:25:37,250 --> 00:25:41,650 Jika Anda memilih satu atau yang lain, itu sepenuhnya pilihan Anda. Ini masih JavaScript dan CSS. 449 00:25:41,650 --> 00:25:43,860 Tapi itu akan membantu Anda melakukan banyak hal. 450 00:25:43,860 --> 00:25:47,780 Sebagai contoh, inilah bagian dari apa yang dapat dilakukan, 451 00:25:47,780 --> 00:25:50,790 hal-hal seperti membantu pemrograman asynchronous dengan janji-janji. 452 00:25:50,790 --> 00:25:54,000 Setiap Anda mendengar atau bekerja dengan Node.js? 453 00:25:54,000 --> 00:25:59,520 Ini adalah pola umum untuk bekerja dengan pemrograman asynchronous. 454 00:25:59,520 --> 00:26:02,370 Jadi pada dasarnya apa yang Anda katakan adalah, "Pergi melakukan sesuatu, 455 00:26:02,370 --> 00:26:05,790 "Dan Anda akan memberi saya sebuah janji bahwa Anda akan kembali ke saya ketika Anda sudah selesai." 456 00:26:05,790 --> 00:26:08,400 Itu dasarnya apa yang terjadi. 457 00:26:08,400 --> 00:26:12,400 Jadi Anda tidak membeku aplikasi Anda saat pengguna akan dan memilih file 458 00:26:12,400 --> 00:26:15,810 atau sesuatu sedang mengalir dari Web. 459 00:26:15,810 --> 00:26:17,210 UI tetap responsif. 460 00:26:17,210 --> 00:26:19,410 Dan Anda dapat melakukannya dengan menggunakan pemrograman asynchronous. 461 00:26:19,410 --> 00:26:23,620 Kedengarannya ridiculously rumit, tapi itu benar-benar mudah karena Anda menggunakan janji-janji 462 00:26:23,620 --> 00:26:27,900 dan Anda hanya mengatakan, "Pergilah melakukan ini dan ketika Anda sudah selesai, memanggil kembali ke metode ini." 463 00:26:27,900 --> 00:26:30,270 Itu cukup banyak itu. Itu semua dibangun untuk WinJS. 464 00:26:30,270 --> 00:26:35,120 Ini akan membuat lebih mudah untuk menulis aplikasi yang benar-benar fleksibel dan kuat. 465 00:26:35,120 --> 00:26:37,870 >> Anda dapat melihat sisa di sini, banyak animasi. 466 00:26:37,870 --> 00:26:41,240 Mungkin salah satu hal yang lebih penting pada slide ini adalah kontrol. 467 00:26:41,240 --> 00:26:44,680 Saya rasa saya memiliki keseluruhan - ya, saya lakukan. 468 00:26:44,680 --> 00:26:48,900 Berikut ini adalah contoh hanya beberapa kontrol yang dapat Anda gunakan dalam aplikasi Anda. 469 00:26:48,900 --> 00:26:51,060 Ini semua lurus ke atas dari WinJS. 470 00:26:51,060 --> 00:26:53,430 Anda tidak menulis ini sendiri, 471 00:26:53,430 --> 00:26:55,990 Anda hanya mengatakan, "Berikut adalah cara saya ingin menulis aplikasi saya." 472 00:26:55,990 --> 00:26:59,420 "Saya akan menggunakan tampilan sandal sehingga saya bisa pergi antara gambar yang berbeda." 473 00:26:59,420 --> 00:27:03,380 Aku belum menunjukkan Anda Semantic Zoom. Aku akan menunjukkan kepada Anda bahwa dalam satu detik. 474 00:27:03,380 --> 00:27:05,700 ListViews. Ada GridViews. 475 00:27:05,700 --> 00:27:08,680 Anda sudah melihat grid sebagai bagian dari aplikasi toko, 476 00:27:08,680 --> 00:27:12,170 sehingga mampu menggunakan blok konten dan bergulir di itu. 477 00:27:12,170 --> 00:27:15,660 Menu flyout Anda akan melihat dari waktu ke waktu. 478 00:27:15,660 --> 00:27:19,090 Bar app saya menunjukkan Anda dengan aplikasi Cat segar juga, 479 00:27:19,090 --> 00:27:22,190 sehingga Anda melihat bagaimana Anda dapat menyesuaikan bahwa dengan menempatkan tombol di atasnya 480 00:27:22,190 --> 00:27:26,360 dan memiliki yang menyembunyikan diri ketika Anda tidak peduli untuk menggunakan. 481 00:27:26,360 --> 00:27:28,120 Itu benar-benar benar-benar terserah pada Anda untuk menggunakan. 482 00:27:28,120 --> 00:27:30,210 Ini semua adalah kontrol yang merupakan bagian dari WinJS. 483 00:27:30,210 --> 00:27:33,640 Saya akan menunjukkan cara untuk membuat ini hanya satu detik, tapi ada lebih dari sekedar ini, 484 00:27:33,640 --> 00:27:37,060 dan kuncinya adalah menggunakan mereka jika Anda inginkan, menghemat waktu. 485 00:27:37,060 --> 00:27:40,830 >> Jika Anda memiliki perpustakaan kontrol lain yang Anda ingin gunakan, itu baik-baik saja juga. 486 00:27:40,830 --> 00:27:46,300 Hal-hal seperti jQuery UI melakukan banyak jenis ide juga, 487 00:27:46,300 --> 00:27:51,280 menyediakan lebih banyak kontrol yang memperpanjang apa yang dapat Anda lakukan dalam HTML dan JavaScript. 488 00:27:52,690 --> 00:27:55,680 Mari kita menyelam masuk saya sudah mengatakan bahwa. Gunakan apa yang Anda inginkan. 489 00:27:55,680 --> 00:27:59,680 Hanya perlu diingat bahwa Anda mungkin mengalami beberapa masalah konteks. 490 00:27:59,680 --> 00:28:03,380 Tapi Anda pasti bisa mencampur dan mencocokkan apa pun jenis perpustakaan Anda merasa nyaman dengan, 491 00:28:03,380 --> 00:28:06,770 Anda ingin belajar, Anda ingin menggunakan, untuk menyelamatkan diri beberapa waktu. 492 00:28:06,770 --> 00:28:09,850 >> Mari kita bicara tentang alat hanya sedetik. 493 00:28:09,850 --> 00:28:12,400 Anda bisa mendapatkan apa yang Anda butuhkan untuk mulai bekerja dengan Windows apps Store. 494 00:28:12,400 --> 00:28:17,360 Jika aku kembali keluar, saya memiliki terlalu banyak hal di sini. 495 00:28:17,360 --> 00:28:21,770 Jika Anda pergi ke halaman ini, yang dev.windows.com, 496 00:28:21,770 --> 00:28:23,300 Anda dapat men-download semua yang anda butuhkan. 497 00:28:23,300 --> 00:28:28,170 Sebagai mahasiswa, Anda memiliki akses ke lebih dari masyarakat umum tidak, 498 00:28:28,170 --> 00:28:30,670 sehingga Anda bisa mendapatkan versi akhir yang lebih tinggi dari Visual Studio. 499 00:28:30,670 --> 00:28:34,090 Edwin menyebut Anda sudah bisa mendapatkan Windows juga. 500 00:28:34,090 --> 00:28:36,790 Tapi secara umum, untuk semua pengembang, Anda dapat pergi ke situs ini 501 00:28:36,790 --> 00:28:40,380 dan men-download semua yang anda butuhkan untuk membuat aplikasi, dan itu semua gratis. 502 00:28:40,380 --> 00:28:42,460 Jadi ada versi gratis dari Visual Studio, 503 00:28:42,460 --> 00:28:44,450 ada beberapa alat yang akan menginstal bersama itu - 504 00:28:44,450 --> 00:28:47,240 semua yang anda butuhkan untuk membuat dan menguji aplikasi Anda. 505 00:28:47,240 --> 00:28:50,130 Ini hanya jika Anda akan mempublikasikan aplikasi Anda ke toko 506 00:28:50,130 --> 00:28:52,470 bahwa Anda akan memerlukan account pengembang. 507 00:28:52,470 --> 00:28:56,100 Hal ini juga saya percaya adalah gratis. Apakah gratis untuk siswa juga? >> [Guarin] Mana? 508 00:28:56,100 --> 00:28:57,970 The account pengembang, pengajuan sebenarnya. >> [Guarin] Ya. 509 00:28:57,970 --> 00:28:59,580 Itu lebih kabar baik. 510 00:28:59,580 --> 00:29:00,840 Anda akan pergi melihat ini. 511 00:29:00,840 --> 00:29:03,840 Ini akan mengatakan bagi seorang individu secara default adalah $ 49. 512 00:29:03,840 --> 00:29:06,140 Tapi jangan mendaftar untuk itu sebagai mahasiswa. 513 00:29:06,140 --> 00:29:10,250 Kita akan mendapatkan beberapa informasi melalui program Anda bahwa Anda dapat mendapatkan account gratis, 514 00:29:10,250 --> 00:29:13,980 dan yang akan membiarkan Anda kemudian mengirimkan aplikasi Anda sampai ke toko, 515 00:29:13,980 --> 00:29:17,370 sebanyak yang Anda suka, dan semua kebaikan yang akan segera menyusul. 516 00:29:17,370 --> 00:29:19,710 Jadi itu dev.windows.com. 517 00:29:19,710 --> 00:29:22,170 Anda dapat men-download alat yang mungkin Anda butuhkan dari sini. 518 00:29:22,170 --> 00:29:25,310 Dan jika Anda ingin, Anda bisa mendapatkan versi percobaan Windows di sini, 519 00:29:25,310 --> 00:29:27,160 tapi sekali lagi, Anda tidak perlu. 520 00:29:27,160 --> 00:29:32,880 >> Situs lain - biarkan saya menunjukkan satu ini untuk Anda dengan cepat - adalah design.windows.com. 521 00:29:32,880 --> 00:29:34,770 Itu dev.windows.com. 522 00:29:34,770 --> 00:29:37,770 Design.windows.com, Anda bisa menebak apa itu untuk. 523 00:29:37,770 --> 00:29:40,380 Ini sebenarnya sebuah situs cukup ramah. Ada banyak informasi yang baik di sini. 524 00:29:40,380 --> 00:29:41,770 Anda dapat bekerja melalui itu. 525 00:29:41,770 --> 00:29:43,960 Ini akan memberikan beberapa saran tentang beberapa hal 526 00:29:43,960 --> 00:29:46,760 bahwa mungkin Anda belum terpikirkan sebelumnya atau harus berurusan dengan sebelumnya, 527 00:29:46,760 --> 00:29:50,780 seperti merancang untuk sentuhan, merancang untuk faktor bentuk yang berbeda, 528 00:29:50,780 --> 00:29:55,310 merancang untuk kemampuan Windows 8, hal-hal yang saya sebutkan sebelumnya 529 00:29:55,310 --> 00:29:58,740 seperti mencari dan berbagi, beberapa hal yang saya belum bicara tentang belum. 530 00:29:58,740 --> 00:30:05,570 Mereka semua tercantum di sini, dan itu adalah set cukup baik membantu halaman berkas 531 00:30:05,570 --> 00:30:08,670 yang akan membantu Anda memahami bagaimana untuk membuat jenis tertentu dari aplikasi, 532 00:30:08,670 --> 00:30:14,250 bagaimana melakukan interaksi, bagaimana berurusan dengan UI dan UX aplikasi Anda. 533 00:30:14,250 --> 00:30:18,630 Saya akan merekomendasikan bahwa Anda melihat pada ini, terutama jika Anda berada di beberapa titik 534 00:30:18,630 --> 00:30:22,960 berharap untuk menerbitkan sebuah aplikasi ke toko. 535 00:30:22,960 --> 00:30:25,250 Anda akan ingin tahu bagaimana membuat aplikasi yang baik 536 00:30:25,250 --> 00:30:28,300 karena yang saya sebutkan sebelumnya jika Anda tidak, ada ulasan mereka lagi. 537 00:30:28,300 --> 00:30:29,930 Orang-orang akan menjadi bahagia. 538 00:30:29,930 --> 00:30:32,960 Mereka tidak akan dapat menemukan hal-hal yang mereka harapkan di tempat yang tepat. 539 00:30:32,960 --> 00:30:36,590 Tidak ada yang ingin hal itu terjadi pada Anda. 540 00:30:36,590 --> 00:30:39,220 >> Bergerak ke depan di sini, biarkan aku menutup yang turun. 541 00:30:39,220 --> 00:30:43,700 Sekarang Anda tahu di mana untuk mendapatkan sesuatu, saya akan menunjukkan cara untuk benar-benar mulai menggunakan barang-barang. 542 00:30:43,700 --> 00:30:48,520 Untuk memulai, saya benar-benar akan menunjukkan di sini contoh aplikasi desktop pada layar Mulai saya. 543 00:30:48,520 --> 00:30:53,600 Di sini Anda dapat melihat Visual Studio, Anda dapat melihat Blend dan alat-alat pengembang lain yang saya miliki. 544 00:30:53,600 --> 00:30:55,890 Mereka memiliki ubin sedikit berbeda. 545 00:30:55,890 --> 00:30:57,930 Itu karena mereka adalah aplikasi desktop, 546 00:30:57,930 --> 00:31:00,960 dan dalam kasus-kasus mereka semua akan meluncurkan kembali ke desktop saya 547 00:31:00,960 --> 00:31:05,350 benar-benar hanya sebagai aplikasi yang Anda terbiasa. 548 00:31:05,350 --> 00:31:06,960 Jadi pengalaman Windows, itu hal yang sama. 549 00:31:06,960 --> 00:31:12,940 Mereka tidak, misalnya, seperti Bersenjata! atau hal-hal ini. Biarkan saya memulai satu dengan cepat. 550 00:31:12,940 --> 00:31:14,340 Sebenarnya, inilah salah satu yang menarik. 551 00:31:14,340 --> 00:31:19,210 Ini dikembangkan oleh mahasiswa yang bekerja dalam kemitraan di NERD. 552 00:31:19,210 --> 00:31:23,430 Aplikasi layar penuh, jenis-jenis pengalaman di sini. 553 00:31:23,430 --> 00:31:26,290 Oh, layar dipotong bagus dan segala macam hal yang menyenangkan. 554 00:31:26,290 --> 00:31:34,330 Mereka mengembangkan ini. Kami mungkin juga menunjukkan semuanya sementara kita berada di dalamnya. 555 00:31:37,510 --> 00:31:41,070 Bahkan, saya bekerja dengan mereka sedikit, memberi mereka beberapa saran pada hal-hal 556 00:31:41,070 --> 00:31:44,160 karena mereka melakukan JavaScript untuk aplikasi mereka. 557 00:31:44,160 --> 00:31:46,460 Tolong, aku tidak mengambil kredit untuk pekerjaan mereka, mereka melakukan semua pekerjaan. 558 00:31:46,460 --> 00:31:48,990 Saya hanya memberi mereka sedikit saran di sana-sini, 559 00:31:48,990 --> 00:31:52,400 tetapi mereka melakukan beberapa hal besar dengan menggunakan front end JavaScript 560 00:31:52,400 --> 00:31:56,920 dan mengikat di beberapa mesin fisika dan hal-hal untuk membuat banyak pekerjaan ini. 561 00:32:00,120 --> 00:32:03,360 Pergi. Mari kita lihat apakah yang bekerja. 562 00:32:03,360 --> 00:32:07,010 Wow, itu masih bekerja. Baiklah, baik. Tapi Anda mendapatkan ide. 563 00:32:07,010 --> 00:32:09,350 Sebuah aplikasi layar penuh, pengalaman yang benar-benar baik. 564 00:32:09,350 --> 00:32:14,250 Hal ini tidak hanya mendukung mouse dan pena saya jika saya memiliki hal-hal seperti itu, tetapi juga menyentuh. 565 00:32:14,250 --> 00:32:19,420 Kalau aku punya layar sentuh, saya hanya bisa menggambar di atasnya dan terus bekerja dengan itu. 566 00:32:19,420 --> 00:32:21,440 >> Satu hal yang saya tidak menunjukkan, dan alasan mengapa aku membawa ini 567 00:32:21,440 --> 00:32:23,840 adalah saya ingin memiliki aplikasi lain untuk menunjukkan apa yang dapat Anda lakukan, 568 00:32:23,840 --> 00:32:29,480 Anda benar-benar dapat mengambil aplikasi di Windows dan menyeret mereka ke sisi layar. 569 00:32:29,480 --> 00:32:33,070 Ini disebut gertakan aplikasi. 570 00:32:33,070 --> 00:32:37,800 Dalam hal ini, saya telah mengambil Inkarus dan saya telah menambahkan ke samping di sini. 571 00:32:37,800 --> 00:32:42,990 Sekarang di Snap pandangan, dan yang memungkinkan saya untuk melakukan sesuatu yang lain, sementara aplikasi yang ada. 572 00:32:42,990 --> 00:32:46,210 Kebanyakan permainan Anda akan menemukan hanya hanya akan berhenti. 573 00:32:46,210 --> 00:32:51,090 Itu biasanya yang layak untuk dilakukan kecuali permainan Anda entah bagaimana dapat menurunkan 574 00:32:51,090 --> 00:32:54,210 untuk yang kecil resolusi, seperti mungkin semacam permainan papan 575 00:32:54,210 --> 00:32:55,620 atau hal-hal seperti itu pada kesempatan. 576 00:32:55,620 --> 00:32:58,570 Tapi secara umum, hal termudah untuk dilakukan dan hal yang paling tepat yang harus dilakukan untuk game 577 00:32:58,570 --> 00:33:00,620 adalah untuk menghentikan aplikasi. 578 00:33:00,620 --> 00:33:09,440 Untuk aplikasi seperti aplikasi berita, jika saya memulai satu ini dan kemudian saya jepret itu, 579 00:33:09,440 --> 00:33:16,170 Anda akan melihat itu benar-benar berubah secara signifikan dalam bagaimana hal itu menyajikan data kepada Anda. 580 00:33:16,170 --> 00:33:20,070 Di sini itu menunjukkan Anda benar-benar dalam panci yang lebih vertikal yang informasi, 581 00:33:20,070 --> 00:33:23,340 tapi aku masih bisa benar-benar menggunakan aplikasi ini. 582 00:33:23,340 --> 00:33:25,640 Jadi masih sangat berguna. 583 00:33:25,640 --> 00:33:29,870 Fakta bahwa itu dalam tampilan yang lebih kecil tidak menjaga aku dari menggunakan aplikasi tersebut. Jadi pikirkan tentang itu. 584 00:33:29,870 --> 00:33:32,090 Ini adalah sesuatu yang Anda harus memiliki aplikasi Anda lakukan untuk beberapa derajat, 585 00:33:32,090 --> 00:33:35,370 tapi itu terserah Anda untuk menentukan bagaimana fungsional aplikasi Anda harus 586 00:33:35,370 --> 00:33:39,080 dalam jenis lingkungan yang lebih kecil. 587 00:33:39,080 --> 00:33:44,780 Izinkan saya menutup satu yang turun dan kembali ke tempat kami berada di sini. 588 00:33:44,780 --> 00:33:48,110 >> Edwin, Anda menambahkan foto saya sudah? >> [Guarin] Ya. >> [Bowen] Lihat itu. 589 00:33:48,110 --> 00:33:51,510 Lihat itu? Edwin menambahkan foto. [Tertawa] 590 00:33:51,510 --> 00:33:54,410 >> Mari kita kembali ke sini ke Visual Studio. Biarkan aku memulai ini untuk Anda. 591 00:33:54,410 --> 00:33:58,170 Aku bisa mengklik ubin di layar Start. 592 00:33:58,170 --> 00:34:02,630 Ini membawa saya kembali ke mode Desktop, dan itu meluncurkan aplikasi desktop Visual Studio. 593 00:34:02,630 --> 00:34:06,790 Ini adalah Windows yang sudah Anda ketahui. 594 00:34:06,790 --> 00:34:09,100 Aku bisa pergi ke depan dan membuat sebuah proyek di sini. 595 00:34:09,100 --> 00:34:11,159 Kami akan fokus lagi pada JavaScript, HTML. 596 00:34:11,159 --> 00:34:16,510 Aku akan pergi keluar dan memilih sampai di sini di bawah JavaScript, Windows Store. 597 00:34:16,510 --> 00:34:19,010 Ada sejumlah template yang dapat Anda gunakan. 598 00:34:19,010 --> 00:34:21,710 Untuk produktivitas, saya akan merekomendasikan Anda mengambil melihat beberapa dari anak-anak lain di sini 599 00:34:21,710 --> 00:34:23,489 seperti Grid dan Split. 600 00:34:23,489 --> 00:34:25,270 Mereka benar-benar berguna jika Anda membuat sebuah aplikasi 601 00:34:25,270 --> 00:34:28,960 itu akan memiliki jenis desain dan navigasi. Anda akan melihat ini banyak. 602 00:34:28,960 --> 00:34:33,070 Yang saya hanya menunjukkan Anda benar-benar sebuah contoh dari aplikasi Grid. 603 00:34:33,070 --> 00:34:36,880 Jadi jika Anda berpikir Anda akan membuat aplikasi berita atau RSS reader 604 00:34:36,880 --> 00:34:43,120 atau sesuatu seperti itu yang berhubungan dengan beberapa entri yang Anda ingin menunjukkan detail, 605 00:34:43,120 --> 00:34:45,989 berpikir tentang menggunakan salah satu template ini untuk memulai dengan cepat 606 00:34:45,989 --> 00:34:48,380 dan menyesuaikan dari sana. 607 00:34:48,380 --> 00:34:50,120 Tapi jadi saya bisa menunjukkan semua bagian yang pindah ke sini 608 00:34:50,120 --> 00:34:56,120 Aku akan membuat app kosong, dan kemudian kita akan pergi sedikit lebih dalam rincian. 609 00:34:56,120 --> 00:34:58,690 Aku hanya membuat aplikasi kosong di sini. 610 00:34:58,690 --> 00:35:01,270 Ini akan membuat seluruh proyek untuk saya. 611 00:35:01,270 --> 00:35:03,290 Aku akan membuka hal-hal yang saya ingin menunjukkan kepada Anda secara default. 612 00:35:03,290 --> 00:35:08,550 Biarkan aku hanya memperbesar sedikit untuk menunjukkan apa yang diciptakan untuk kita di sini. 613 00:35:08,550 --> 00:35:11,350 Hal-hal yang Anda akan melihat pada awalnya diberi semua default. 614 00:35:11,350 --> 00:35:15,970 Jadi Anda akan mencari default.html, default.js, dan default.css. 615 00:35:15,970 --> 00:35:19,590 Hal lain yang perlu menunjukkan adalah bahwa kita sudah memiliki referensi ke apa yang saya sebutkan sebelumnya. 616 00:35:19,590 --> 00:35:24,530 Ini adalah WinJS. Tidak ada yang benar-benar menyebutnya nama panjang ini di sini. 617 00:35:24,530 --> 00:35:27,710 Ini adalah WinJS, Perpustakaan Windows for JavaScript. 618 00:35:27,710 --> 00:35:29,530 Jika Anda membukanya, Anda dapat melihat itu semua di sini. 619 00:35:29,530 --> 00:35:31,820 Ada file CSS yang berbeda, ada JavaScript. 620 00:35:31,820 --> 00:35:33,520 Itu ada di sana untuk membantu Anda keluar. 621 00:35:33,520 --> 00:35:37,190 Ini benar-benar ada untuk memberikan kontrol dan gaya dan hal-hal yang Anda hanya dapat menggunakan secara otomatis. 622 00:35:37,190 --> 00:35:41,240 Tetapi sekali lagi, jika ada hal yang ingin Anda gunakan sebagai pengganti dalam hal styling dan kontrol lainnya, 623 00:35:41,240 --> 00:35:45,600 itu sepenuhnya terserah Anda. Aku akan menunjukkan kepada Anda bagaimana menggunakan beberapa hal-hal sekarang. 624 00:35:45,600 --> 00:35:51,020 >> Kembali ke sisi kiri kami, biarkan saya menunjukkan halaman HTML default. 625 00:35:51,020 --> 00:35:54,490 Anda sudah melihat hal-hal WinJS, dan itu benar-benar semua yang terjadi di sana 626 00:35:54,490 --> 00:35:59,930 dengan garis-garis tengah markup, hanya membawa CSS secara default 627 00:35:59,930 --> 00:36:02,370 dan membawa beberapa file JavaScript dari WinJS. 628 00:36:02,370 --> 00:36:06,400 Anda tidak perlu menjadi master apa yang terjadi di dalam file tersebut. 629 00:36:06,400 --> 00:36:10,110 Hal ini cukup menarik untuk kita lihat pada mereka untuk jenis meninjau apa yang terjadi di sana 630 00:36:10,110 --> 00:36:14,410 karena ada teknik menengah dan lanjutan yang cukup menarik terjadi di sana, 631 00:36:14,410 --> 00:36:18,100 tapi hal yang menyenangkan adalah sebagai pengembang, Anda hanya dapat mengambil keuntungan dari mereka, hanya menggunakannya 632 00:36:18,100 --> 00:36:19,510 dan tidak benar-benar perlu khawatir tentang hal itu. 633 00:36:19,510 --> 00:36:21,960 Anda masih bisa mengendarai mobil tanpa harus tahu cara kerjanya, kan? 634 00:36:21,960 --> 00:36:24,180 Jadi itulah jenis hal yang terjadi di sini. 635 00:36:24,180 --> 00:36:26,930 Ada kontrol dan gaya dan hal-hal yang Anda hanya dapat melanjutkan dan penggunaan 636 00:36:26,930 --> 00:36:31,460 dan kode yang dapat Anda gunakan dalam hitungan detik tanpa harus tahu apa yang ada di sana. 637 00:36:31,460 --> 00:36:33,200 Berikut adalah file Anda sendiri. 638 00:36:33,200 --> 00:36:35,860 Ini adalah tempat Anda bahwa Anda dapat memodifikasi CSS Anda sendiri 639 00:36:35,860 --> 00:36:38,400 dan JavaScript Anda sendiri untuk mendapatkan sesuatu bergulir. 640 00:36:38,400 --> 00:36:43,300 Anda akan menambahkan file JavaScript tentu lain dan file lainnya mungkin CSS 641 00:36:43,300 --> 00:36:47,480 sebagai proyek Anda tumbuh, tapi ini benar-benar hanya titik awal. 642 00:36:47,480 --> 00:36:52,570 Berikut adalah Hello, setara dunia dari HTML, jadi kita kembali pada tag body. 643 00:36:52,570 --> 00:36:55,990 Di bagian atas, by the way, itu adalah DOCTYPE HTML5, 644 00:36:55,990 --> 00:37:00,060 sehingga Anda akan menyadari bahwa dari apa yang Anda kerjakan. 645 00:37:00,060 --> 00:37:04,600 Ada penuh IntelliSense di sini juga, jadi jika Anda melakukan hal-hal seperti jenis dalam tag video yang 646 00:37:04,600 --> 00:37:07,340 dan memperluas yang keluar, Anda mungkin telah belajar tentang fakta 647 00:37:07,340 --> 00:37:12,760 yang perlu Anda lakukan encoding fallback untuk tag video dalam HTML5 - atau mungkin Anda memiliki - 648 00:37:12,760 --> 00:37:17,490 untuk memastikan bahwa browser yang berbeda memiliki dukungan untuk video Anda. 649 00:37:17,490 --> 00:37:22,610 Kami memiliki hal-hal seperti ini di HTML, JavaScript di, di CSS. 650 00:37:22,610 --> 00:37:26,020 Itu dibangun dalam, dan saya akan menunjukkan CSS dalam satu detik. 651 00:37:26,020 --> 00:37:29,430 Di sini Anda dapat pergi ke depan dan mulai kode, markup memodifikasi. 652 00:37:29,430 --> 00:37:33,700 Bahkan, sebelum saya mengubah apa pun, aku akan menjalankan ini dan menunjukkan kepada Anda apa yang Anda dapatkan. 653 00:37:33,700 --> 00:37:35,700 Anda akan mendapatkan splash screen yang dapat disesuaikan 654 00:37:35,700 --> 00:37:40,940 dan kemudian Anda mendapatkan Halo, pengalaman dunia di sini. Ini fantastis, bukan? 655 00:37:40,940 --> 00:37:42,640 Pergi ke depan dan kapal itu, kan? 656 00:37:42,640 --> 00:37:45,970 Konten goes here. Itu hal dasar. 657 00:37:45,970 --> 00:37:48,740 Hal ini hanya bisa mendapatkan lebih baik dari sana. 658 00:37:48,740 --> 00:37:51,300 Kami akan pergi ke depan dan menambahkan beberapa hal. 659 00:37:51,300 --> 00:37:53,470 Aku punya sedikit markup aku akan copy di sini 660 00:37:53,470 --> 00:37:55,740 hanya sehingga Anda tidak harus menonton saya mengetik. 661 00:37:55,740 --> 00:38:02,620 Biarkan aku pergi membawa kotak peralatan di sini, dan saya akan pin ini karena saya akan melakukan ini beberapa kali. 662 00:38:02,620 --> 00:38:05,650 Toolbox, jika Anda belum melihat Visual Studio, adalah di mana Anda akan menemukan sekelompok kontrol. 663 00:38:05,650 --> 00:38:09,050 Anda juga dapat menempatkan potongan kode ke dalamnya bahwa Anda dapat menggunakan kembali. 664 00:38:09,050 --> 00:38:16,360 Di sini saya hanya akan muncul dalam beberapa lain HTML, tidak ada yang sangat maju sama sekali di sini. 665 00:38:16,360 --> 00:38:20,170 Ini hanya dasar HTML mengatakan bahwa saya memiliki masukan di mana saya bisa mengetik, 666 00:38:20,170 --> 00:38:23,860 Saya memiliki tombol mana saya bisa menyerahkan itu, dan kemudian saya memiliki div yang dasarnya placeholder 667 00:38:23,860 --> 00:38:27,360 yang bisa saya gunakan untuk output "Halo, Anda mengetik ini." 668 00:38:27,360 --> 00:38:32,780 Ini adalah intro untuk contoh HTML. 669 00:38:32,780 --> 00:38:39,340 Jika saya menjalankan ini, kita secara otomatis mendapatkan HTML, tetapi kita juga secara otomatis mendapatkan styling. 670 00:38:39,340 --> 00:38:42,270 Ini adalah salah satu hal penting dari WinJS. 671 00:38:42,270 --> 00:38:47,250 Ini akan memberi Anda secara default beberapa tampilan dan nuansa yang benar-benar konsisten 672 00:38:47,250 --> 00:38:50,520 dengan sisa apa Windows 8 lakukan. 673 00:38:50,520 --> 00:38:52,110 Disini anda melihat hal-hal seperti tombol. 674 00:38:52,110 --> 00:38:55,890 Tombol secara default di HTML tidak terlihat seperti itu, tapi tidak di sini 675 00:38:55,890 --> 00:39:00,880 karena itu mendapatkan bahwa CSS yang tepat dari file CSS di WinJS. 676 00:39:00,880 --> 00:39:04,680 Jika Anda ingin menggunakan sesuatu yang lain, jika Anda ingin mengubah itu, benar-benar baik, 677 00:39:04,680 --> 00:39:06,790 pergi ke depan dan melakukan apa yang Anda inginkan. Tapi itu default. 678 00:39:06,790 --> 00:39:09,610 Ini akan menjadi lebih akrab bagi pengguna. 679 00:39:09,610 --> 00:39:13,510 Dan tentu saja ini tidak akan melakukan apa-apa karena saya tidak benar-benar memasang sebuah jenis kode 680 00:39:13,510 --> 00:39:16,630 untuk menanggapi itu. Itu hanya HTML. 681 00:39:16,630 --> 00:39:20,630 Jadi saya dapat menyingkirkan itu, dan kami akan datang kembali ke aplikasi kita. 682 00:39:20,630 --> 00:39:25,310 >> Mari saya beralih ke default.js kami. 683 00:39:25,310 --> 00:39:29,030 Hal ini terlihat cukup rumit, tapi itu hanya melakukan beberapa hal untuk Anda. 684 00:39:29,030 --> 00:39:33,120 Ini boilerplate. Ini akan menjadi sama di semua proyek Anda. 685 00:39:33,120 --> 00:39:36,620 Satu-satunya hal ini lakukan adalah hanya semacam bertanya, "Bagaimana aku sampai di sini?" 686 00:39:36,620 --> 00:39:39,090 dan berkata, "Apakah Anda meluncurkan aplikasi ini untuk pertama kalinya?" 687 00:39:39,090 --> 00:39:42,640 "Apakah Anda melanjutkan aplikasi dari memiliki itu ditunda?" 688 00:39:42,640 --> 00:39:44,510 Beberapa hal seperti itu. 689 00:39:44,510 --> 00:39:50,300 Sungguh, fokus kami pada file ini di sini adalah benar tentang di sini. 690 00:39:50,300 --> 00:39:54,490 Pada titik ini, baris ini salah satu kode cukup penting. 691 00:39:54,490 --> 00:39:57,070 Ini benar-benar akan pergi dan melihat melalui semua markup Anda, 692 00:39:57,070 --> 00:40:01,640 dan itu akan menemukan hal-hal yang Anda telah diminta untuk telah berubah menjadi kontrol, 693 00:40:01,640 --> 00:40:07,220 kontrol yang lebih dalam seperti kontrol rating, seperti tampilan grid, seperti flyout 694 00:40:07,220 --> 00:40:09,570 dan hal-hal lain yang saya tunjukkan pada slide itu sebelumnya. 695 00:40:09,570 --> 00:40:12,550 Mereka tidak kontrol HTML asli. 696 00:40:12,550 --> 00:40:17,860 Anda hanya tidak mengatakan flyout sebagai unsur dan memilikinya tahu apa yang harus dilakukan. 697 00:40:17,860 --> 00:40:22,120 Apa yang kita benar-benar lakukan adalah hal yang sama yang terjadi dalam jenis lain dari kerangka kontrol. 698 00:40:22,120 --> 00:40:26,200 jQuery UI melakukan jenis yang sama pendekatan umum. 699 00:40:26,200 --> 00:40:30,800 Anda menggunakan tanda dalam HTML Anda, dan kemudian beberapa JavaScript datang melalui kemudian dan mengatakan, 700 00:40:30,800 --> 00:40:35,900 "Oh, aku tahu apa itu. Itu meminta ini akan berubah menjadi hal-hal ini," 701 00:40:35,900 --> 00:40:39,850 yang merupakan HTML lebih ekspresif lain untuk membuat seperti peringkat kontrol, 702 00:40:39,850 --> 00:40:41,790 yang adalah apa yang akan saya tunjukkan sekarang. 703 00:40:41,790 --> 00:40:46,140 Baris kode ini adalah janji itu mengatakan, "Ketika janji ini terpenuhi, 704 00:40:46,140 --> 00:40:49,090 "Segala sesuatu yang Anda telah meminta untuk yang kemudian dibuat." 705 00:40:49,090 --> 00:40:52,780 Dan itu saja. Ini terlihat sedikit rumit, tapi itu benar-benar sama dalam setiap proyek. 706 00:40:52,780 --> 00:40:56,690 Di sini adalah di mana Anda dapat mulai menambahkan dalam apa pun yang Anda inginkan terjadi, 707 00:40:56,690 --> 00:40:58,280 jadi kita akan kembali ke bahwa dalam satu detik. 708 00:40:58,280 --> 00:41:01,480 >> Pertama-tama, saya perlu sedikit kode yang dapat merespon fakta 709 00:41:01,480 --> 00:41:03,320 bahwa seseorang telah mengklik tombol. 710 00:41:03,320 --> 00:41:06,330 Aku akan pergi ke depan dan menempatkan bahwa di bawah sini. 711 00:41:06,330 --> 00:41:09,620 Sekali lagi, aku tidak akan melakukan mengetik apapun di depan Anda di sini. 712 00:41:09,620 --> 00:41:12,560 Sangat mendasar JavaScript hanya mengatakan saat ini disebut 713 00:41:12,560 --> 00:41:15,270 kami akan memberikan beberapa rincian tentang bagaimana kita sampai di sini 714 00:41:15,270 --> 00:41:17,630 dan kemudian kita akan melakukan beberapa hal dasar. 715 00:41:17,630 --> 00:41:21,300 Pergi menemukan benda di dalam halaman HTML saya yang bernama nameInput, 716 00:41:21,300 --> 00:41:28,490 ambil itu, mengambil nilainya, slap "Hello" di bagian depan itu, dan tongkat string yang dihasilkan 717 00:41:28,490 --> 00:41:31,960 ke dalam tag div yang kita miliki sebelum itu benar-benar tidak memiliki apa-apa sebelumnya. 718 00:41:31,960 --> 00:41:37,220 Sekarang kita akan menemukan tag itu dan membuat konten dalamnya sama dengan string yang. 719 00:41:37,220 --> 00:41:38,880 JavaScript sangat sederhana. 720 00:41:38,880 --> 00:41:42,240 Mudah-mudahan Anda mengakui bahwa ada benar-benar tidak biasa terjadi di sini. 721 00:41:42,240 --> 00:41:45,360 Hanya saja lurus ke atas HTML dan JS di sini. 722 00:41:45,360 --> 00:41:48,220 Jika saya menjalankan ini sekarang, itu masih tidak akan melakukan pekerjaan apapun karena saya belum kabel itu 723 00:41:48,220 --> 00:41:50,030 untuk menerima acara tersebut. 724 00:41:50,030 --> 00:41:55,710 Untuk melakukan itu, saya akan melakukannya di sini, sekali lagi kembali ke toolbox saya, 725 00:41:55,710 --> 00:41:58,730 muncul di sini. 726 00:41:58,730 --> 00:42:03,060 Saya berharap Anda telah melihat semua hal semacam ini sebelumnya, jadi saya tidak akan over-menjelaskannya. 727 00:42:03,060 --> 00:42:05,060 Sekarang kita akan pergi mendapatkan helloButton. 728 00:42:05,060 --> 00:42:07,730 Kita akan mengatakan, "Button, selamat." 729 00:42:07,730 --> 00:42:10,130 "Ini adalah suatu peristiwa yang Anda sekarang menanggapi." 730 00:42:10,130 --> 00:42:13,420 "Ketika seseorang mengklik pada Anda, memanggil fungsi ini, buttonClickHandler." 731 00:42:13,420 --> 00:42:17,070 Dan itulah fungsi kami hanya menambahkan sampai di bagian bawah sana. Itu saja. 732 00:42:17,070 --> 00:42:20,980 Jadi sekarang kita punya sebuah aplikasi luar biasa fungsional. 733 00:42:20,980 --> 00:42:24,720 Saya pikir Anda akan benar-benar terkesan dengan ini. 734 00:42:24,720 --> 00:42:32,320 Chris. Tunggu. Wow. Oke. Itu luar biasa. [Tertawa] 735 00:42:32,320 --> 00:42:36,570 Tapi masih ada lagi. Jangan membelinya belum. Tunggu. 736 00:42:36,570 --> 00:42:39,610 >> Mari saya tunjukkan sedikit lebih di sini dan keluar dari layar penuh. 737 00:42:39,610 --> 00:42:42,690 Kita akan berjalan sebelum kita jalankan. 738 00:42:42,690 --> 00:42:45,530 Biarkan aku pergi dan benar-benar menunjukkan sedikit dengan CSS. 739 00:42:45,530 --> 00:42:49,480 Hanya dengan default, jika kita melihat kembali halaman di sini, 740 00:42:49,480 --> 00:42:53,570 setiap kali kami berhenti di hal-hal ini dari WinJS dan kami mendapat ui-gelap, 741 00:42:53,570 --> 00:42:58,550 pada kenyataannya, Anda dapat mengubahnya ke default untuk menggunakan aplikasi ringan. 742 00:42:58,550 --> 00:43:03,450 ui-hitam baik untuk aplikasi grafis seperti menggunakan banyak gambar, 743 00:43:03,450 --> 00:43:05,740 Anda menunjukkan banyak konten visual. 744 00:43:05,740 --> 00:43:12,560 Jika Anda menunjukkan banyak konten tekstual, yang ui-cahaya umumnya merupakan pilihan yang baik. 745 00:43:12,560 --> 00:43:15,160 Anda tidak harus memilih itu, tapi aku sudah beralih ke itu 746 00:43:15,160 --> 00:43:17,690 dan sekarang kau melihat markup yang sama, semuanya sama, 747 00:43:17,690 --> 00:43:20,320 itu hanya menggunakan pada dasarnya skema terbalik di sini 748 00:43:20,320 --> 00:43:24,770 di mana semuanya membuat teks hitam putih. 749 00:43:24,770 --> 00:43:26,460 Itu semua baik dan bagus. 750 00:43:26,460 --> 00:43:30,680 Biarkan aku keluar dari sini, dan mari kita benar-benar melakukan sedikit lebih dengan CSS. 751 00:43:30,680 --> 00:43:34,830 Aku akan mengembalikannya ke gelap karena saya pikir itu mungkin lebih mudah untuk melihat pada layar 752 00:43:34,830 --> 00:43:36,970 ketika saya mulai melakukan hal-hal ini. 753 00:43:36,970 --> 00:43:40,150 Aku akan menggantikan tubuh sekali lagi. 754 00:43:40,150 --> 00:43:44,040 Aku akan pergi di sini. Mari saya nuke ini. 755 00:43:44,040 --> 00:43:48,690 Mari kita membawa tubuh dengan kelas. 756 00:43:48,690 --> 00:43:53,000 Saya percaya Anda telah melakukan penyeleksi dasar dengan CSS dan hal-hal seperti yang sudah, 757 00:43:53,000 --> 00:43:55,380 sehingga Anda mungkin tahu apa yang terjadi di sini. 758 00:43:55,380 --> 00:43:59,250 Hanya menempatkan beberapa kelas untuk kepala kami, dan kami membuat div baru 759 00:43:59,250 --> 00:44:04,430 untuk membungkus sisa bahwa barang-barang yang sekarang kita dapat menggunakan untuk gaya semua bersama-sama. 760 00:44:04,430 --> 00:44:07,760 Jadi apa yang bisa saya lakukan sekarang adalah pergi ke CSS default kita. 761 00:44:07,760 --> 00:44:11,900 Apakah Anda melihat pertanyaan media belum? Apakah Anda berbicara tentang itu sama sekali? 762 00:44:11,900 --> 00:44:17,220 Media query adalah bagian dari tren yang muncul ini - 763 00:44:17,220 --> 00:44:19,660 atau itu sebuah tren yang didirikan sekarang benar-benar di Web - 764 00:44:19,660 --> 00:44:22,760 untuk desain responsif atau adaptif, 765 00:44:22,760 --> 00:44:28,480 dan idenya adalah bahwa aplikasi Anda benar-benar dapat menyesuaikan diri dengan tepat 766 00:44:28,480 --> 00:44:31,910 berdasarkan apa perangkat yang mereka sedang ditampilkan pada bisa melakukannya. 767 00:44:31,910 --> 00:44:35,040 Jadi jika Anda berada pada perangkat mobile, jelas Anda tidak akan memiliki banyak layar real estat 768 00:44:35,040 --> 00:44:41,520 karena anda akan di monitor besar 30 inci duduk dengan desktop, PC besar seperti itu. 769 00:44:41,520 --> 00:44:46,710 Jadi jawaban tua untuk itu akan memiliki 5, 6 versi yang berbeda dari halaman yang sama 770 00:44:46,710 --> 00:44:51,350 dan Anda akan membuka versi yang disetel untuk itu ukuran layar tertentu. 771 00:44:51,350 --> 00:44:55,420 Tidak besar. Ini sangat, sangat berulang-ulang dan ada satu ton pemeliharaan untuk melakukan itu. 772 00:44:55,420 --> 00:44:58,120 Sekarang kita memiliki sesuatu yang disebut CSS pertanyaan media, 773 00:44:58,120 --> 00:45:02,530 dan kita dapat menggunakan ini untuk secara otomatis mendeteksi ketika ada ukuran tertentu 774 00:45:02,530 --> 00:45:07,030 atau penggunaan tertentu konten Anda sedang dilakukan. 775 00:45:07,030 --> 00:45:09,580 Sehingga Anda dapat menanggapi hal itu dan Anda bisa mengatakan, "Oke, dalam hal ini 776 00:45:09,580 --> 00:45:12,580 "Anda mungkin bahkan tidak perlu saya untuk memberitahu Anda apa yang terjadi di sini." 777 00:45:12,580 --> 00:45:18,020 Ini hanya mengatakan jika aplikasi ini bentak, seperti saya menunjukkan Anda sebelumnya - 778 00:45:18,020 --> 00:45:20,830 meraih itu dan memasukkannya ke sisi layar - 779 00:45:20,830 --> 00:45:23,910 kemudian mari kita lakukan styling berikut. 780 00:45:23,910 --> 00:45:25,850 Styling bukan hanya tentang warna dan hal-hal seperti itu. 781 00:45:25,850 --> 00:45:29,860 Ini juga tentang ukuran dan margin dan bantalan dan orientasi dari konten 782 00:45:29,860 --> 00:45:34,040 atau bahkan menonaktifkan atau mengaktifkan seluruh bagian halaman Anda 783 00:45:34,040 --> 00:45:36,420 dan, dalam hal ini, aplikasi atau permainan Anda juga. 784 00:45:36,420 --> 00:45:39,210 Jadi di sini Anda dapat melakukan yang sederhana seperti yang Anda inginkan. 785 00:45:39,210 --> 00:45:46,720 Hal ini tidak akan berguna dalam aplikasi Anda, tetapi saatnya demo, 786 00:45:46,720 --> 00:45:50,530 jadi aku akan pergi ke depan dan hanya menambahkan pemilih dasar tubuh dan berkata, 787 00:45:50,530 --> 00:45:58,360 "Ketika saya bentak, mari kita pergi ke depan dan melakukan background-color dan mari kita memilih sesuatu." 788 00:45:58,360 --> 00:46:00,400 Anda punya IntelliSense di sini. Ini sebenarnya benar-benar keren. 789 00:46:00,400 --> 00:46:05,720 Pada tahun 2012 kami telah menambahkan banyak hal untuk dukungan CSS dan JavaScript dan HTML. 790 00:46:05,720 --> 00:46:08,690 Kau tentu punya drop-down IntelliSense juga, tapi itu bukan hal yang keren. 791 00:46:08,690 --> 00:46:11,730 Yang keren adalah Anda punya penyeleksi visual untuk banyak hal juga. 792 00:46:11,730 --> 00:46:14,120 Jadi Anda bisa pergi melalui dan hanya memilih warna, 793 00:46:14,120 --> 00:46:17,580 atau Anda dapat pergi keluar dan menjadi lebih spesifik dan Anda dapat memilih - 794 00:46:17,580 --> 00:46:22,330 ini akan menjadi mengerikan. Aku benar-benar akan memilih warna yang layak di sini. 795 00:46:22,330 --> 00:46:26,500 Perhatikan markup juga, by the way. Itu format standar RGB Anda di sana. 796 00:46:26,500 --> 00:46:30,780 Tapi jika saya beralih opacity, itu akan beralih ke selektor channel alpha sini. 797 00:46:30,780 --> 00:46:36,910 Sehingga Anda dapat melihat bahwa, warna dasarnya dengan transparansi persen yang Anda miliki untuk itu 798 00:46:36,910 --> 00:46:38,860 semua dipanggang tepat di sana. 799 00:46:38,860 --> 00:46:42,530 Aku akan menyimpannya sebagai 100% dan kemudian ketika aku sudah selesai dengan itu, semuanya baik-baik dan baik. 800 00:46:42,530 --> 00:46:46,160 Sekarang jika saya menjalankan aplikasi dan kita mengambil app dan kami snap, 801 00:46:46,160 --> 00:46:49,000 bahwa warna latar belakang akan disesuaikan secara otomatis 802 00:46:49,000 --> 00:46:53,410 hanya karena kita memiliki beberapa CSS yang mengatakan, "Pergilah melakukan itu." 803 00:46:53,410 --> 00:46:55,580 Anda juga dapat menulis JavaScript juga yang akan melakukan hal yang sama 804 00:46:55,580 --> 00:47:03,010 atau yang dapat Anda gunakan untuk benar-benar berhenti permainan, melakukan hal-hal seperti itu. 805 00:47:03,010 --> 00:47:04,310 Itu mungkin saat Anda akan menggunakan JavaScript. 806 00:47:04,310 --> 00:47:06,610 Anda akan mematikan loop permainan pada saat itu. 807 00:47:06,610 --> 00:47:09,970 Anda akan membutuhkan beberapa JavaScript karena itu tidak akan menjadi sesuatu yang Anda akan CSS untuk. 808 00:47:09,970 --> 00:47:11,760 Namun perlu diingat itu hanya sebuah acara. 809 00:47:11,760 --> 00:47:14,860 Anda bisa mengatakan, "Ketika aplikasi saya diubah ukurannya, 810 00:47:14,860 --> 00:47:17,780 "Mari kita lihat apakah kita bentak." Dan itu saja. 811 00:47:17,780 --> 00:47:24,440 >> Oke? Saya telah berbicara banyak. Apakah ada pertanyaan tentang sejauh mana kita berada? Ya. 812 00:47:24,440 --> 00:47:29,310 [Mahasiswa] Apakah ada tutorial bagi siapa saja untuk mendapatkan informasi lebih lanjut? >> Ya. 813 00:47:29,310 --> 00:47:33,510 Pertanyaannya adalah, apakah ada tutorial untuk ini? Aku hanya akan memperpanjang untuk semuanya. 814 00:47:33,510 --> 00:47:37,490 Ada beberapa hal yang dapat Anda pergi ke. Mari kita benar-benar pergi dari sini. 815 00:47:37,490 --> 00:47:40,150 Biarkan aku pergi kembali di sini. 816 00:47:40,150 --> 00:47:45,180 Satu hal yang menunjukkan adalah Visual Studio itu sendiri memiliki built in tutorial 817 00:47:45,180 --> 00:47:47,650 Biarkan aku menyingkirkan ini. 818 00:47:47,650 --> 00:47:51,520 Jika Anda pergi dan membuat proyek baru, jangan File New Project, 819 00:47:51,520 --> 00:47:56,750 dan melihat sisi kiri, ada simpul Online pemilih ini. 820 00:47:56,750 --> 00:47:59,790 Ini akan mengambil sedikit. Aku di MyFi saya di sini. 821 00:47:59,790 --> 00:48:02,300 Tapi itu akan datang dan itu akan memberi saya kesempatan untuk menemukan template 822 00:48:02,300 --> 00:48:05,190 tetapi juga, yang lebih penting, sampel juga. 823 00:48:05,190 --> 00:48:06,750 Jadi saya dapat mengklik JavaScript. 824 00:48:06,750 --> 00:48:10,050 Ini akan menemukan contoh bagi saya. Resolusi saya adalah cara tinggi di sini. 825 00:48:10,050 --> 00:48:15,070 Biasanya, Anda akan melihat daftar banyak hal yang berbeda di sini. 826 00:48:15,070 --> 00:48:18,280 Jika ada sesuatu yang Anda ingin mencoba, memilih bahasa, 827 00:48:18,280 --> 00:48:20,970 JavaScript di sini, dan berkata, "Saya tidak tahu bagaimana melakukan geolocation." 828 00:48:20,970 --> 00:48:22,220 "Saya tidak tahu bagaimana untuk membuka file." 829 00:48:22,220 --> 00:48:25,840 "Saya tidak tahu bagaimana untuk mengambil keuntungan dari webcam 830 00:48:25,840 --> 00:48:28,290 "Atau mengoptimalkan untuk sentuhan atau hal-hal seperti itu." 831 00:48:28,290 --> 00:48:33,190 Ada contoh untuk semuanya: berbagi, mencari, app bar, 832 00:48:33,190 --> 00:48:37,520 membuat panggilan jarak jauh ke layanan, JSON encoding. 833 00:48:37,520 --> 00:48:40,390 Semua hal-hal semacam ada sampel untuk di sini, 834 00:48:40,390 --> 00:48:44,560 dan mereka tidak sampel besar yang akan membawa Anda sepanjang malam untuk memisahkan 835 00:48:44,560 --> 00:48:46,820 hanya untuk menemukan bahwa salah satu hal yang Anda ingin belajar. 836 00:48:46,820 --> 00:48:49,870 Mereka benar-benar baik. Mereka kecil, hak untuk jenis titik sampel. 837 00:48:49,870 --> 00:48:52,330 Saya telah belajar satu ton dengan pergi melalui ini sendiri, 838 00:48:52,330 --> 00:48:55,260 dan jadi saya sarankan bahwa banyak sebagai satu hal. 839 00:48:55,260 --> 00:49:01,750 >> Hal lain untuk menunjukkan juga tentu saja saya menunjukkan Anda dev.windows.com, 840 00:49:01,750 --> 00:49:07,490 jadi jika Anda kembali ke itu, Anda akan melihat di bagian bawah ada juga sampel di sini. 841 00:49:07,490 --> 00:49:12,560 Sehingga Anda dapat men-download semua dari mereka sekaligus, tapi ada juga banyak sumber daya lain di sini juga 842 00:49:12,560 --> 00:49:14,400 yang dapat membantu Anda mendapatkan sampai dengan kecepatan. 843 00:49:14,400 --> 00:49:17,870 >> Satu hal lain, dan saya benar-benar akan merekomendasikan bahwa Anda mencoba ini, 844 00:49:17,870 --> 00:49:24,510 Aku punya itu di blog saya, tapi aku hanya akan pergi hak untuk itu. 845 00:49:24,510 --> 00:49:28,220 Aku akan menunjukkan kepada Anda. Blog saya memiliki sumber daya dan hal-hal seperti itu. 846 00:49:28,220 --> 00:49:35,300 Salah satu hal untuk menunjukkan ada di sini, hal ini: Ide Anda. App Anda. 30 Hari. 847 00:49:35,300 --> 00:49:40,960 Jika Anda klik ini, itu akan membawa Anda ke sebuah situs yang sangat membantu. 848 00:49:40,960 --> 00:49:44,650 Ini jauh lebih bermanfaat daripada yang mungkin Anda harapkan. 849 00:49:44,650 --> 00:49:49,040 Ini akan menjadi 30 hari dari konten yang Anda pada dasarnya bisa mendapatkan tips dan trik 850 00:49:49,040 --> 00:49:51,990 seluruh proses karena Anda sedang menciptakan sebuah aplikasi. 851 00:49:51,990 --> 00:49:55,980 Dan seperti yang Anda mungkin tidak mengharapkan, Anda benar-benar bisa mendapatkannya untuk game juga 852 00:49:55,980 --> 00:49:57,840 dan untuk aplikasi telepon, hal-hal seperti itu. 853 00:49:57,840 --> 00:50:01,000 Jadi pada dasarnya mendaftar untuk itu, dan mereka akan mengirimkan tips dan trik, 854 00:50:01,000 --> 00:50:03,010 "Pernahkah Anda berpikir tentang melakukan hal ini? Apakah Anda mendukung Snap?" 855 00:50:03,010 --> 00:50:04,900 "Berikut adalah beberapa panduan tentang cara untuk melakukannya dengan baik." 856 00:50:04,900 --> 00:50:07,440 "Pernahkah Anda berpikir tentang mengirimkan ke toko?" 857 00:50:07,440 --> 00:50:09,370 "Pernahkah Anda berpikir tentang bagaimana Anda akan menjual aplikasi Anda?" 858 00:50:09,370 --> 00:50:11,490 Ini akan berjalan melalui semua berbagai hal. 859 00:50:11,490 --> 00:50:13,380 Dan sebenarnya, jika Anda berada di jalur game, di beberapa titik 860 00:50:13,380 --> 00:50:17,010 Anda akan mulai mengenali orang yang berbicara dengan Anda 861 00:50:17,010 --> 00:50:22,850 karena saya benar-benar harus pergi ke Redmint untuk melakukan hal-dan dicatat 2 video di sana. 862 00:50:22,850 --> 00:50:25,240 Tapi itu semua adalah bagian dari track game, 863 00:50:25,240 --> 00:50:27,650 dan ada juga lagu penuh untuk pengembangan aplikasi umum. 864 00:50:27,650 --> 00:50:29,380 Itulah yang disebut Generation App. 865 00:50:29,380 --> 00:50:33,460 Saya pasti akan merekomendasikan bahwa untuk Anda juga di samping sampel. 866 00:50:33,460 --> 00:50:38,110 >> Ada banyak video di situs yang disebut Channel 9 juga. 867 00:50:38,110 --> 00:50:42,790 Itu mungkin adalah hal terakhir yang saya akan merekomendasikan juga sebelum kita melanjutkan di sini. 868 00:50:42,790 --> 00:50:45,280 Channel9.msdn.com. 869 00:50:45,280 --> 00:50:48,880 Ini bagus karena Anda tidak akan membaca ton kertas putih. 870 00:50:48,880 --> 00:50:53,880 Ini pada dasarnya banyak video, screencasts dan hal-hal yang langsung ke titik. 871 00:50:53,880 --> 00:50:57,940 Saya seharusnya tidak mengatakan itu selalu langsung ke titik. Hal ini tergantung siapa yang melakukan berbicara. 872 00:50:57,940 --> 00:51:02,290 Tapi pada umumnya, ada beberapa benar-benar to-the-point video di sini 873 00:51:02,290 --> 00:51:06,230 yang akan menunjukkan beberapa hal tertentu Anda mungkin ingin belajar atau melihat demoed. 874 00:51:06,230 --> 00:51:11,110 Ada juga semua konten kami dari konferensi kami yang terjadi beberapa minggu yang lalu 875 00:51:11,110 --> 00:51:14,380 disebut Build, dan Anda akan melihat bahwa di sana. 876 00:51:14,380 --> 00:51:18,450 Ada teknologi Core untuk Windows 8 pertandingan. Di sana Anda pergi. 877 00:51:18,450 --> 00:51:23,150 Aku ada di sana, benar-benar. Anda tidak dapat melihat saya. Aku di sini. 878 00:51:23,150 --> 00:51:27,560 Tapi bagaimanapun, bahwa selain, saya akan merekomendasikan bahwa Anda melihat pada video tersebut. 879 00:51:27,560 --> 00:51:29,330 Mereka cukup membantu. 880 00:51:29,330 --> 00:51:32,620 Jika Anda terjebak pada sesuatu atau Anda hanya ingin melihat apa yang bisa melakukan sesuatu, api yang up. 881 00:51:32,620 --> 00:51:36,890 >> [Guarin] Windows Mail hanya mengirim saya email dengan link ke konten 882 00:51:36,890 --> 00:51:42,140 bagi siswa untuk men-download dengan kode sampel dan hal-hal seperti itu. >> [Bowen] besar. 883 00:51:42,140 --> 00:51:45,510 Mengagumkan. Terima kasih, Edwin. 884 00:51:45,510 --> 00:51:48,320 >> Baik. >> [Mahasiswa] saya punya pertanyaan. >> [Bowen] Oh. Ya, silakan. 885 00:51:48,320 --> 00:51:55,030 [Pertanyaan mahasiswa terdengar] >> [Bowen] Oh, aku senang kau bertanya itu. Ya. 886 00:51:55,030 --> 00:51:58,940 Pertanyaannya adalah, apakah ada antarmuka visual bagi saya untuk membuat hal-hal? 887 00:51:58,940 --> 00:52:01,630 Edwin akan membalas Anda mahal untuk pertanyaan itu. 888 00:52:01,630 --> 00:52:04,310 Ada cara untuk melakukan ini. 889 00:52:04,310 --> 00:52:09,040 Haruskah kita lakukan sekarang? Mari kita lakukan sekarang. 890 00:52:09,040 --> 00:52:11,780 Aku akan pergi ke sana sekarang. 891 00:52:11,780 --> 00:52:14,070 Sebenarnya, izinkan saya menambahkan satu hal lagi untuk demo ini, 892 00:52:14,070 --> 00:52:16,710 dan kemudian saya akan menunjukkan jawaban yang sebenarnya. 893 00:52:16,710 --> 00:52:21,340 Aku akan menambahkan lebih CSS kecil di sini. 894 00:52:21,340 --> 00:52:23,980 Aku sedikit pada garis singgung di sini. 895 00:52:23,980 --> 00:52:26,770 Mari saya dimasukkan ke dalam beberapa CSS di sini untuk mengambil keuntungan 896 00:52:26,770 --> 00:52:29,980 dari kelas yang kami menambahkan beberapa saat yang lalu, 897 00:52:29,980 --> 00:52:33,930 untuk header, ke div MainContent, dan kemudian ke greetingOutput. 898 00:52:33,930 --> 00:52:37,920 Jika saya melakukan itu dan menjalankannya, Anda dapat melihat sekarang kita punya sedikit bantalan yang berbeda dan margin, 899 00:52:37,920 --> 00:52:40,310 jadi kita harus benar-benar beberapa offset di sini. 900 00:52:40,310 --> 00:52:44,630 Ini lebih ke arah apa yang Anda akan mengharapkan aplikasi dipoles final. 901 00:52:44,630 --> 00:52:47,770 Tapi aku hanya menunjukkan ini kepada Anda karena itu lurus ke atas CSS. 902 00:52:47,770 --> 00:52:51,910 Jadi hal-hal yang sudah Anda tahu bahwa Anda dapat menggunakan di sini untuk menyesuaikan konten sesuai keinginan. 903 00:52:51,910 --> 00:52:55,100 Anda sudah melihat bagaimana membuat latar belakang berubah seperti itu. 904 00:52:55,100 --> 00:53:02,980 >> Jika saya kembali ke HTML kita, aku akan menambahkan satu set lebih dari markup, 905 00:53:02,980 --> 00:53:06,140 dan ini benar-benar akan menjadi kontrol dari WinJS. 906 00:53:06,140 --> 00:53:09,840 Aku akan pergi dan ambil ini, label. Biarkan aku memastikan aku melakukannya di tempat yang tepat. 907 00:53:09,840 --> 00:53:11,740 Mungkin cukup baik. 908 00:53:11,740 --> 00:53:15,590 Di sini saya baru saja menambahkan - dan kami akan pergi layar penuh sehingga Anda dapat melihat seluruh hal - 909 00:53:15,590 --> 00:53:18,520 Saya telah menambahkan label untuk div berikutnya. 910 00:53:18,520 --> 00:53:20,890 Div ini disebut ratingControlDiv. 911 00:53:20,890 --> 00:53:23,090 Dengan sendirinya ia akan melakukan apa-apa. 912 00:53:23,090 --> 00:53:28,570 Jika Anda membuka ini dalam browser, Anda akan melihat kosong, div itu sendiri. 913 00:53:28,570 --> 00:53:31,820 Tapi karena itu garis misterius kode yang saya tunjukkan sebelumnya, 914 00:53:31,820 --> 00:53:35,650 proses semua, itu akan mencari sesuatu yang terlihat seperti ini - 915 00:53:35,650 --> 00:53:40,380 Data-win-control - dan itu akan menemukan apa yang ada di parameter itu. 916 00:53:40,380 --> 00:53:44,560 Ini akan membuat sebuah contoh dari apa pun itu itu menunjuk ke. 917 00:53:44,560 --> 00:53:48,850 Dalam kasus ini, itu adalah kontrol rating, jadi aku berkata, "Silakan pergi dan mengganti hal ini 918 00:53:48,850 --> 00:53:51,400 "Dengan apa yang perlu Anda lakukan untuk membuat kontrol rating." 919 00:53:51,400 --> 00:53:56,610 Ini bisa menjadi kontrol lain, itu bisa menjadi cincin kemajuan atau kontrol apa pun yang ingin Anda gunakan. 920 00:53:56,610 --> 00:53:59,390 Mereka semua akan bekerja pada dasarnya dengan cara yang sama. 921 00:53:59,390 --> 00:54:02,920 Anda menggunakan standar HTML5 markup untuk menunjukkan apa yang Anda inginkan, 922 00:54:02,920 --> 00:54:07,670 dan kemudian Anda akan mendapatkan kontrol pada akhir ini. Biarkan aku menjalankan ini. 923 00:54:07,670 --> 00:54:12,270 Saya hanya menyalin bahwa dalam, dan sekarang markup yang menjadi ini, 924 00:54:12,270 --> 00:54:15,280 yang sebenarnya cukup banyak elemen HTML. 925 00:54:15,280 --> 00:54:18,440 Ini semua adalah gambar individu, dan ada divs di sekitar mereka dengan pemilih. 926 00:54:18,440 --> 00:54:22,610 Mudah-mudahan Anda dapat melihat bahwa. Ini sedikit halus. 927 00:54:22,610 --> 00:54:27,380 Saya dapat mengarahkan kursor ke item yang berbeda, dan itu akan memungkinkan saya untuk melihat rating di sini. 928 00:54:27,380 --> 00:54:31,560 Aku bisa klik di atasnya, dan ia mengingat rating tapi itu tentang hal itu. 929 00:54:31,560 --> 00:54:33,100 Ini tidak benar-benar melakukan apa-apa dengan rating. 930 00:54:33,100 --> 00:54:35,230 >> Satu hal terakhir yang saya ingin menunjukkan ini 931 00:54:35,230 --> 00:54:37,820 sebelum kita beralih ke pengalaman desain lebih visual 932 00:54:37,820 --> 00:54:42,680 adalah sedikit kode yang bisa saya gunakan untuk menanggapi WinJS kontrol ini. 933 00:54:42,680 --> 00:54:47,540 Biarkan aku keluar dari sana, kembali keluar dari layar penuh, 934 00:54:47,540 --> 00:54:52,690 dan beralih ke JS di sini untuk kedua. 935 00:54:52,690 --> 00:54:57,450 Aku bisa melakukan ini di sini. Saya pikir saya akan mengganti semua ini. 936 00:54:57,450 --> 00:55:03,080 Sebenarnya, saya pikir itu akan menggantikan semua itu, tapi kita akan tahu bersama-sama. 937 00:55:03,080 --> 00:55:07,350 Aku akan menempatkan ini dalam sini. Ya. Aku akan menghapus ini juga. 938 00:55:07,350 --> 00:55:11,790 Apa yang saya tambahkan? Sepertinya banyak. Ini tidak banyak. 939 00:55:11,790 --> 00:55:14,920 Saya hanya menyampaikan bahwa baris kode yang sudah saya bicarakan sebelumnya, 940 00:55:14,920 --> 00:55:18,590 dan aku berkata, "Ketika semuanya selesai, ketika semua kontrol telah dibuat, 941 00:55:18,590 --> 00:55:23,660 "Kemudian melakukan hal ini." Jadi menjalankan fungsi ini disebut selesai. 942 00:55:23,660 --> 00:55:27,080 Dalam hal ini, ini adalah hal yang Anda dapat mencari tahu. 943 00:55:27,080 --> 00:55:29,040 Pergi menemukan bahwa kontrol div. 944 00:55:29,040 --> 00:55:30,790 Sebenarnya, ada satu hal yang saya harus menunjukkan. 945 00:55:30,790 --> 00:55:35,630 Baris berikutnya benar-benar mengatakan, "Aku punya ratingControlDiv itu." 946 00:55:35,630 --> 00:55:39,770 "Saya ingin berbicara dengan itu seolah-olah itu kontrol nyata, kontrol WinJS." 947 00:55:39,770 --> 00:55:42,020 Jadi pada dasarnya, Anda meminta untuk itu dari itu. 948 00:55:42,020 --> 00:55:44,600 Anda katakan, "Saya ingin berbicara dengan Anda sebagai kontrol." 949 00:55:44,600 --> 00:55:47,810 Dan kemudian Anda dapat mulai mengatakan hal-hal seperti, "Kita akan menambahkan pendengar untuk Anda 950 00:55:47,810 --> 00:55:51,430 "Jadi ketika Anda mengubah kita bisa menanggapi hal itu." 951 00:55:51,430 --> 00:55:56,930 Dan kemudian kita juga bisa melakukan hal-hal seperti ini. Sebenarnya, itu kode lama di sana. 952 00:55:56,930 --> 00:55:59,600 Saya pikir saya kehilangan paste dalam satu fungsi yang lebih, 953 00:55:59,600 --> 00:56:05,030 dan itu akan menjadi fungsi yang sebenarnya yang akan menanggapi kontrol wisatawan yang berubah. 954 00:56:05,030 --> 00:56:07,710 Biarkan aku pop yang di kanan bawah sini, 955 00:56:07,710 --> 00:56:09,840 di suatu tempat di sekitar sana. 956 00:56:09,840 --> 00:56:14,930 Dan dalam hal ini, satu-satunya hal yang baru adalah kenyataan bahwa kita akan menjadi 957 00:56:14,930 --> 00:56:21,000 apa kontrol Peringkat memberitahu kami dan kami minta apa yang disebut tentativeRating tersebut. 958 00:56:21,000 --> 00:56:23,150 Ada banyak hal lain yang berbeda kontrol yang dapat memberitahu Anda, 959 00:56:23,150 --> 00:56:25,310 dan ia pergi kontrol dengan kontrol. 960 00:56:25,310 --> 00:56:29,140 Ini sangat mudah. Anda akan dapat mengetahuinya tidak ada masalah apapun. 961 00:56:29,140 --> 00:56:34,040 Saya menjalankan ini, dan sekarang ketika saya mengubah peringkat dan klik pada rating, 962 00:56:34,040 --> 00:56:36,480 Anda bisa lihat sekarang itu benar-benar menanggapinya. 963 00:56:36,480 --> 00:56:40,280 Ini menempatkan peringkat yang di layar ke yang lain kosong tag div 964 00:56:40,280 --> 00:56:42,970 di bawah kontrol rating. 965 00:56:42,970 --> 00:56:46,670 Itulah keajaiban banyak hal di sini juga. 966 00:56:46,670 --> 00:56:49,580 Jadi ketika Anda sedang menciptakan aplikasi untuk Windows Store, 967 00:56:49,580 --> 00:56:52,930 ada satu ton kontrol yang Anda hanya dapat menggunakan. Mereka semua bekerja seperti ini. 968 00:56:52,930 --> 00:56:58,670 >> Mari saya tunjukkan sisi visual merancang untuk aplikasi ini. 969 00:56:58,670 --> 00:57:03,440 Kabar baiknya adalah Anda sudah akan memiliki alat ini saat Anda menginstal segalanya 970 00:57:03,440 --> 00:57:06,240 jika Anda pergi ke download yang dan Anda mendapatkan Visual Studio. 971 00:57:06,240 --> 00:57:09,890 Saya bisa klik kanan pada ini. Aku tidak akan zoom in 972 00:57:09,890 --> 00:57:12,040 Ini hanya mengatakan Terbuka di Blend. 973 00:57:12,040 --> 00:57:16,040 Blend adalah alat lain yang bekerja berdampingan dengan Visual Studio 974 00:57:16,040 --> 00:57:19,230 dan difokuskan lebih pada sisi desain hal, 975 00:57:19,230 --> 00:57:23,660 sehingga benar-benar permukaan alat yang dioptimalkan untuk menciptakan gaya, 976 00:57:23,660 --> 00:57:29,720 membuat animasi, bekerja dengan CSS, banyak hal dalam semacam vena. 977 00:57:29,720 --> 00:57:36,380 Berikut apa yang harus sangat menarik dan cukup jelas segera adalah kita sedang melihat app. 978 00:57:36,380 --> 00:57:40,060 Mudah-mudahan kita masih. 979 00:57:40,060 --> 00:57:42,650 Alih-alih melihat kode, yang kita masih melihat di bagian bawah, 980 00:57:42,650 --> 00:57:45,350 kita melihat representasi yang sebenarnya dari aplikasi. 981 00:57:45,350 --> 00:57:49,640 Terlebih lagi, itu bukan hanya representasi dari aplikasi, itu sebenarnya berjalan app. 982 00:57:49,640 --> 00:57:52,010 Dan itulah yang benar-benar baik tentang Blend. 983 00:57:52,010 --> 00:57:58,620 Tim ini telah melakukan banyak pekerjaan untuk membawa HTML dan JavaScript dan CSS ke dalam alat ini. 984 00:57:58,620 --> 00:58:01,930 Sekarang Anda dapat benar-benar, jika Anda penasaran, "Apa artinya itu? Apa yang bisa saya lakukan?" 985 00:58:01,930 --> 00:58:08,310 Aku benar-benar dapat merancang aplikasi ini meskipun hal-hal seperti ini tidak ada dalam markup saya. 986 00:58:08,310 --> 00:58:13,230 Ingat bahwa kontrol rating? Itu hanya tag div. 987 00:58:13,230 --> 00:58:17,090 Hal ini, bintang itu, hanya ada pada saat runtime. Bagaimana saya tahu itu? 988 00:58:17,090 --> 00:58:20,300 Ada sedikit sihir di sini. 989 00:58:20,300 --> 00:58:21,700 Lihat petir ini? 990 00:58:21,700 --> 00:58:25,570 Setiap kali Anda melihat petir, itu berarti ia diciptakan oleh sesuatu saat runtime. 991 00:58:25,570 --> 00:58:31,770 Beberapa JavaScript berlari dan berubah menjadi sesuatu ini atau menciptakan ini dengan beberapa logika. 992 00:58:31,770 --> 00:58:37,100 Bintang-bintang yang Anda lihat di sana diciptakan oleh JavaScript oleh WinJS. 993 00:58:37,100 --> 00:58:41,800 Yang menyenangkan adalah, itu tidak masalah bagi saya, saya masih dapat merancang, 994 00:58:41,800 --> 00:58:44,410 Aku masih bisa masuk dan mengubahnya, saya dapat mengetahui apa yang terjadi di sini, 995 00:58:44,410 --> 00:58:50,260 Saya dapat melihat CSS, saya bisa pergi ke depan dan mencari tahu mengapa warna adalah cara itu, 996 00:58:50,260 --> 00:58:54,610 Saya bisa mulai bermain-main dengan hal-hal dan membuat hal-hal yang mengerikan, 997 00:58:54,610 --> 00:58:58,360 apapun yang saya ingin lakukan. 998 00:58:58,360 --> 00:59:01,020 Sebenarnya, aku akan meninggalkan hal-hal sendirian. 999 00:59:01,020 --> 00:59:03,980 Tapi Anda bisa lihat di sini itu semua CSS dan itu menunjukkan Anda di sini. 1000 00:59:03,980 --> 00:59:10,120 Jika saya pergi ke sana, itu akan menunjukkan kepada Anda segala sesuatu yang mereka sebut Winning, 1001 00:59:10,120 --> 00:59:14,850 sehingga aturan CSS yang paling spesifik dan paling dipilih untuk item tersebut, 1002 00:59:14,850 --> 00:59:17,110 yang Anda mungkin sudah pergi lebih dalam kelas Anda, 1003 00:59:17,110 --> 00:59:22,000 di mana Anda dapat mengatakan ada font umum yang kita berlaku untuk segala sesuatu, 1004 00:59:22,000 --> 00:59:26,860 tapi karena ini adalah h1 dan saya memiliki warna yang ditetapkan untuk h1s, 1005 00:59:26,860 --> 00:59:29,820 itu akan menjadi warna ini, dan itu karena itu lebih spesifik daripada body1 tersebut. 1006 00:59:29,820 --> 00:59:32,590 Ini satu hal yang benar di sini menunjukkan semua itu, 1007 00:59:32,590 --> 00:59:35,470 dan itu benar-benar hal yang kuat karena Anda mendapatkan lebih kompleks, 1008 00:59:35,470 --> 00:59:38,160 Anda bertanya-tanya mengapa hal-hal ini adalah cara mereka. 1009 00:59:38,160 --> 00:59:41,020 Ini akan benar-benar memberitahu Anda, dan Anda dapat memilih salah satu item di sini. 1010 00:59:41,020 --> 00:59:43,370 Warna yang tidak terlalu buruk, sebenarnya. 1011 00:59:43,370 --> 00:59:47,150 Anda dapat memilih mereka. Mudah-mudahan Anda dapat melihat hal ini. 1012 00:59:47,150 --> 00:59:52,410 Untuk segala sesuatu yang Anda miliki di aplikasi Anda, Anda melihat seluruh kaskade 1013 00:59:52,410 --> 00:59:56,070 semua CSS yang bisa diterapkan untuk itu dan mana yang menang, 1014 00:59:56,070 --> 00:59:58,050 mana yang benar-benar mengambil didahulukan. 1015 00:59:58,050 --> 01:00:00,930 Ini adalah jenis membosankan. Tidak ada banyak terjadi di beberapa. 1016 01:00:00,930 --> 01:00:04,660 Jika saya pergi dan mengubah warna, maka Anda akan mulai melihat beberapa Cascading sana. 1017 01:00:04,660 --> 01:00:07,760 Anda juga dapat menggunakan HTML di sini juga. 1018 01:00:07,760 --> 01:00:12,490 Aku bisa pergi melalui dan memodifikasi sifat HTML untuk semua hal-hal ini seperti yang saya inginkan. 1019 01:00:12,490 --> 01:00:14,620 Hanya ada ton barang di sini. 1020 01:00:14,620 --> 01:00:18,070 >> Saya tidak ingin mengambil waktu Anda dengan pergi melalui segala sesuatu di sini. Hanya tahu itu di sini. 1021 01:00:18,070 --> 01:00:21,700 Ada banyak fungsi desain berorientasi itu hanya tersedia untuk Anda 1022 01:00:21,700 --> 01:00:26,730 sehingga Anda dapat tetap visual, bekerja dengan aplikasi tersebut, dan tidak perlu melakukan banyak menebak 1023 01:00:26,730 --> 01:00:32,180 bahwa Anda harus melakukan normal dan bersepeda kembali dari browser kembali ke dalam desain Anda, 1024 01:00:32,180 --> 01:00:33,940 kembali ke browser. 1025 01:00:33,940 --> 01:00:37,010 Ini benar-benar hal-hal keren untuk itu, dan ketika Anda mengembangkan aplikasi Windows Store, 1026 01:00:37,010 --> 01:00:39,650 itu akan membuat Anda jauh lebih produktif. 1027 01:00:39,650 --> 01:00:45,150 >> Anda juga akan melihat itu pelacakan markup di sini dan CSS Anda 1028 01:00:45,150 --> 01:00:47,270 karena Anda bekerja melalui hal-hal yang berbeda. 1029 01:00:47,270 --> 01:00:50,180 Ini mungkin sangat sulit bagi Anda untuk melihat bahwa, terutama pada video, 1030 01:00:50,180 --> 01:00:54,680 tapi itulah yang terjadi di sini, dan saya akan merekomendasikan Anda menjadi akrab dengan itu. 1031 01:00:54,680 --> 01:00:57,240 Ini akan menghemat banyak waktu. Itu Blend. 1032 01:00:57,240 --> 01:01:00,520 Jika Anda membuat perubahan di sini, mereka secara otomatis akan membawa kembali lebih 1033 01:01:00,520 --> 01:01:01,870 untuk Visual Studio. 1034 01:01:01,870 --> 01:01:06,590 Ini adalah file yang sama, itu adalah segala sesuatu yang sama. Saya akan biarkan saja. 1035 01:01:06,590 --> 01:01:08,650 Saya memiliki contoh yang lebih baik yang saya ingin menunjukkan. 1036 01:01:08,650 --> 01:01:11,660 Tetapi jika saya membuat perubahan di sana dan menyimpannya dan saya kembali ke Visual Studio, akan mengatakan, 1037 01:01:11,660 --> 01:01:16,390 "Hei, kau baru saja mengubah sesuatu. Dapatkah saya reload untuk Anda?" Ya. 1038 01:01:16,390 --> 01:01:18,770 Dan Anda menggunakan hal yang sama di sana. 1039 01:01:18,770 --> 01:01:21,320 Itulah akhir dari sampel tertentu. 1040 01:01:21,320 --> 01:01:28,170 >> Saya ingin menunjukkan sampel akhir yang lebih tinggi hanya untuk memberikan pandangan fungsi lainnya 1041 01:01:28,170 --> 01:01:30,350 Anda mungkin berpikir tentang juga. 1042 01:01:30,350 --> 01:01:32,280 Ini adalah aplikasi contoh yang dapat Anda download. 1043 01:01:32,280 --> 01:01:35,620 Jika Anda mencari sesuatu yang disebut Camp Windows dalam Box, 1044 01:01:35,620 --> 01:01:40,340 ada beberapa sampel yang dalam hal itu, dan salah satunya adalah The Contoso Cookbook. 1045 01:01:40,340 --> 01:01:41,640 Aku hanya bisa menjalankan ini untuk Anda. 1046 01:01:41,640 --> 01:01:44,700 Screen kustom splash. Ini adalah aplikasi tampilan Grid. 1047 01:01:44,700 --> 01:01:49,590 Mereka telah terikat beberapa data kustom di sini. Anda dapat menavigasi melalui ini. 1048 01:01:49,590 --> 01:01:53,090 Anda dapat pergi dan lihatlah berbagai hal yang akan membuat kita lapar pada hari Jumat sore. 1049 01:01:53,090 --> 01:01:57,760 Saya tidak tahu. Apa yang akan membuat saya paling lapar? 1050 01:01:57,760 --> 01:02:00,530 Saya tidak tahu. Aku hanya akan memilih salah satu. 1051 01:02:00,530 --> 01:02:02,460 Anda masuk ke hal-hal ini. Ini akan menunjukkan resep. 1052 01:02:02,460 --> 01:02:04,900 Anda juga bisa, daripada mengklik pada item, 1053 01:02:04,900 --> 01:02:10,360 Anda bisa langsung pergi ke kategori konten, bahwa bagian konten. 1054 01:02:10,360 --> 01:02:15,590 Dalam hal ini, Anda dapat membaca banyak palsu Latin memberitahu Anda semua tentang resep ini di sini 1055 01:02:15,590 --> 01:02:17,720 dan kemudian pergi langsung ke resep tertentu. 1056 01:02:17,720 --> 01:02:22,770 Ini juga mendukung hal-hal seperti berbagi yang saya tunjukkan sebelumnya dengan gambar-gambar. 1057 01:02:22,770 --> 01:02:26,160 Anda juga dapat mencari ke dalam aplikasi ini juga. 1058 01:02:26,160 --> 01:02:28,880 Ini sangat mudah untuk melakukan pencarian. 1059 01:02:28,880 --> 01:02:31,300 Pada dasarnya, Anda hanya mendapatkan string teks dari Windows 1060 01:02:31,300 --> 01:02:34,720 dan Anda memutuskan bagaimana Anda ingin menangani pencarian dengan itu. 1061 01:02:34,720 --> 01:02:39,830 Ini adalah beberapa baris kode untuk mendapatkan itu, dan kemudian apa yang Anda lakukan dengan itu setelah itu benar-benar terserah pada Anda. 1062 01:02:39,830 --> 01:02:44,180 >> Di sini mereka juga memiliki bar aplikasi di mana mereka menggunakan beberapa fungsi lainnya. 1063 01:02:44,180 --> 01:02:45,430 Aku akan memberitahu Anda apa itu. 1064 01:02:45,430 --> 01:02:48,220 Sebuah pengingat akan menggunakan apa yang disebut pemberitahuan roti panggang. 1065 01:02:48,220 --> 01:02:52,930 Ini benar-benar berguna untuk membiarkan pengguna tahu kapan hal-hal yang telah terjadi, 1066 01:02:52,930 --> 01:02:55,850 seperti aplikasi yang diinstal atau sesuatu selesai. 1067 01:02:55,850 --> 01:02:57,950 Ini juga baik untuk game juga. 1068 01:02:57,950 --> 01:03:02,360 Jika Anda memiliki dunia yang terus-menerus atau papan pemimpin dan layanan yang hosting yang 1069 01:03:02,360 --> 01:03:08,490 mungkin pada mesin yang terpisah, pemberitahuan tersebut dapat dikirim ke mesin 1070 01:03:08,490 --> 01:03:12,240 dan bahkan jika pengguna tidak menggunakan permainan Anda, bermain game atau menjalankan aplikasi Anda, 1071 01:03:12,240 --> 01:03:15,170 mereka masih bisa mendapatkan pemberitahuan tentang orang-orang macam peristiwa. 1072 01:03:15,170 --> 01:03:19,350 Jadi Anda bisa mengatakan, "benteng anda telah hancur atau hampir hancur." 1073 01:03:19,350 --> 01:03:22,870 "Kembali ke sini dan mempertahankannya," atau sesuatu seperti itu. 1074 01:03:22,870 --> 01:03:26,830 Anda klik pada pemberitahuan, Anda langsung kembali ke dalam permainan, dan Anda dapat memainkannya. 1075 01:03:26,830 --> 01:03:32,170 Jadi hal-hal seperti benar-benar dapat membantu menarik orang kembali ke aplikasi Anda cukup efektif. 1076 01:03:32,170 --> 01:03:37,450 >> Ada juga mendukung dalam aplikasi ini untuk menggunakan mikrofon, webcam, 1077 01:03:37,450 --> 01:03:39,560 melakukan video dan mengambil foto. 1078 01:03:39,560 --> 01:03:42,080 Anda juga dapat pin ubin sekunder. 1079 01:03:42,080 --> 01:03:46,760 Ini berguna jika Anda ingin hanya memiliki ubin yang pergi tepat ke konten tertentu. 1080 01:03:46,760 --> 01:03:49,960 Dalam hal ini, ia pergi tepat untuk resep ini. 1081 01:03:49,960 --> 01:03:51,300 Semuanya aku menyebutkan aku hanya menunjukkan 1082 01:03:51,300 --> 01:03:53,270 karena itu hal-hal yang dapat Anda berpikir tentang menggunakan juga. 1083 01:03:53,270 --> 01:03:57,590 Untuk sebagian besar, mereka sangat mudah untuk digunakan. 1084 01:03:57,590 --> 01:04:00,070 Saya hanya akan merekomendasikan Anda membawa bahwa sampel explorer 1085 01:04:00,070 --> 01:04:03,600 dan menemukan contoh yang dapat menunjukkan kepada Anda bagaimana untuk melakukan itu. 1086 01:04:03,600 --> 01:04:07,140 Ini cukup sederhana untuk membawa mereka ke dalam aplikasi Anda di sana juga. 1087 01:04:07,140 --> 01:04:11,030 >> Aku akan menunjukkan kepada Anda sesuatu yang lain yang cukup keren di sini. 1088 01:04:11,030 --> 01:04:15,230 Kupatahkan aplikasi ini, dan aku akan kembali ke Visual Studio. 1089 01:04:15,230 --> 01:04:18,870 Aplikasi ini berjalan. Ini berjalan dari Visual Studio. 1090 01:04:18,870 --> 01:04:21,370 Aku bisa melakukan beberapa hal yang cukup keren dengan itu. 1091 01:04:21,370 --> 01:04:23,840 Aku benar-benar memiliki pilihan untuk memilih elemen, 1092 01:04:23,840 --> 01:04:28,250 dan aku bisa pergi ke sini untuk aplikasi hidup dan bisa saya katakan, 1093 01:04:28,250 --> 01:04:34,000 "Aku bertanya-tanya mengapa Persiapan Waktu abu-abu sedikit lebih ringan dari judul itu sendiri?" 1094 01:04:34,000 --> 01:04:35,680 Aku bisa klik di atasnya. 1095 01:04:35,680 --> 01:04:38,080 Ini akan menyinkronkan yang kembali ke Visual Studio, 1096 01:04:38,080 --> 01:04:43,780 dan itu akan menunjukkan dengan tepat konten yang dihasilkan yang mengakibatkan bagian dari UI. 1097 01:04:43,780 --> 01:04:47,270 Jadi dalam hal ini, itu item-subtitle dan h4 membangun ganda, 1098 01:04:47,270 --> 01:04:51,110 dan yang mungkin memberitahu kita apa yang kita perlu tahu karena sebagai h4 dalam konteks itu, 1099 01:04:51,110 --> 01:04:53,550 itu akan mendapatkan jenis tertentu font. 1100 01:04:53,550 --> 01:04:56,410 Tapi kalau aku masih tidak tahu mengapa, saya bisa klik pada jejak Styles. 1101 01:04:56,410 --> 01:05:02,330 Saya kemudian dapat memperluas keluar warna dan saya bisa mengetahui persis mengapa warna yang tidak warna tubuh 1102 01:05:02,330 --> 01:05:04,640 tetapi sebenarnya adalah sesuatu yang lain. 1103 01:05:04,640 --> 01:05:07,210 Ini pada dasarnya adalah alat dev dari Internet Explorer 1104 01:05:07,210 --> 01:05:09,530 ke tingkat yang dibawa ke dalam Visual Studio. 1105 01:05:09,530 --> 01:05:12,110 Jika Anda telah bekerja dengan Tools Chrome Dev, Firebug, hal-hal seperti itu, 1106 01:05:12,110 --> 01:05:14,720 orang-orang macam alat-alat yang ada di browser, 1107 01:05:14,720 --> 01:05:17,340 semacam fungsi telah dibawa langsung ke Visual Studio 1108 01:05:17,340 --> 01:05:22,090 sehingga Anda tidak benar-benar harus memulai browser dan bekerja dengan alat tersebut secara terpisah. 1109 01:05:22,090 --> 01:05:24,320 Sekarang saya memiliki toko aplikasi Windows hanya menjalankan, 1110 01:05:24,320 --> 01:05:27,840 dan saya bisa mulai menariknya terpisah dan mencari tahu mengapa hal-hal melakukan apa yang mereka. 1111 01:05:27,840 --> 01:05:30,440 >> Saya juga bisa melakukannya dengan cara ini juga. 1112 01:05:30,440 --> 01:05:35,020 Aku bisa pergi dan hanya memilih sesuatu yang benar dari markup dan mencari tahu apa itu 1113 01:05:35,020 --> 01:05:38,560 dalam aplikasi itu sendiri. Saya pikir saya sudah berlalu semuanya. 1114 01:05:38,560 --> 01:05:41,440 Di sini aku melayang di atas ini. Saya dapat memilihnya. 1115 01:05:41,440 --> 01:05:45,540 Ini akan menunjukkan dalam aplikasi berjalan sebenarnya di mana hal yang 1116 01:05:45,540 --> 01:05:48,070 bahwa aku sekarang mengklik di markup. 1117 01:05:48,070 --> 01:05:49,700 Benar-benar keren. 1118 01:05:49,700 --> 01:05:52,710 Saat Anda mencoba untuk mencari tahu apa yang terjadi dan apa HTML lakukan, 1119 01:05:52,710 --> 01:05:56,080 apa CSS lakukan, ingatlah ini. 1120 01:05:56,080 --> 01:05:58,450 Ingat ini adalah di sini untuk Anda 1121 01:05:58,450 --> 01:06:02,070 dan juga Blend yang dapat bekerja dengan aplikasi langsung berjalan. 1122 01:06:02,070 --> 01:06:06,070 >> Satu hal terakhir yang saya ingin menunjukkan Anda dengan aplikasi ini - 1123 01:06:06,070 --> 01:06:09,290 By the way, itu menunjukkan Anda delta sebagai hal berubah juga, 1124 01:06:09,290 --> 01:06:11,160 sehingga Anda dapat menonton bagi mereka highlights kuning. 1125 01:06:11,160 --> 01:06:14,060 Mereka adalah hal-hal yang baru saja berubah dalam aplikasi. 1126 01:06:14,060 --> 01:06:16,350 Tapi satu hal terakhir. Saya ingin kembali ke Blend hanya untuk kedua di sini. 1127 01:06:16,350 --> 01:06:21,790 Kita akan membuka ini, Open in Blend, aplikasi yang sama, semuanya sama. 1128 01:06:21,790 --> 01:06:28,660 Aku hanya ingin menunjukkan pengalaman di sini tidak hanya Anda terjebak di halaman rumah 1129 01:06:28,660 --> 01:06:32,880 melihat hal-hal yang Anda akan mendapatkan secara default ketika Anda menjalankan aplikasi dan biarkan duduk di sana. 1130 01:06:32,880 --> 01:06:36,490 Anda juga dapat mengaktifkan ini icon cukup kecil di sini. 1131 01:06:36,490 --> 01:06:38,560 Ini disebut modus interaktif. 1132 01:06:38,560 --> 01:06:41,560 Anda klik pada itu. Ini akan membuka aplikasi Anda. 1133 01:06:41,560 --> 01:06:43,730 Anda tidak dalam mode Desain lagi, sehingga Anda tidak akan mengklik pada hal-hal 1134 01:06:43,730 --> 01:06:47,270 untuk mengubah fungsi, tetapi Anda benar-benar dapat bekerja dengan aplikasi sekarang. 1135 01:06:47,270 --> 01:06:51,560 Anda dapat mengklik, Anda dapat melakukan apapun, sampai ke resep yang Anda pedulikan 1136 01:06:51,560 --> 01:06:54,810 atau kategori. Mari kita pergi ke kategori ini. 1137 01:06:54,810 --> 01:06:56,880 Aku akan mengatakan, "Oke, di sini adalah di mana saya ingin desain." 1138 01:06:56,880 --> 01:06:59,680 Kemudian Anda klik tombol itu lagi, itu akan membawa Anda kembali ke permukaan Design, 1139 01:06:59,680 --> 01:07:02,130 dan sekarang Anda dapat melakukan semua hal yang saya bicarakan sebelumnya. 1140 01:07:02,130 --> 01:07:06,230 Aku akan terus mengklik sampai aku mendapatkan ini dipilih, mengetahui dimensi, 1141 01:07:06,230 --> 01:07:09,890 mengetahui HTML untuk itu, CSS untuk itu 1142 01:07:09,890 --> 01:07:14,990 untuk aplikasi yang berjalan, beberapa bagian akhir dari aplikasi. 1143 01:07:14,990 --> 01:07:17,780 Sangat, sangat berguna. Aku akan menunjukkan hal ini kepada Anda. 1144 01:07:17,780 --> 01:07:21,340 Harap tetap diingat jika Anda melihat ke dalam menulis kode dengan ini 1145 01:07:21,340 --> 01:07:26,070 karena itu akan menghemat banyak kerumitan, dan itu hal yang cukup baik. 1146 01:07:26,070 --> 01:07:32,370 Itu cukup banyak semua saya ingin menunjukkan pada Blend dan Visual Studio untuk semua itu. 1147 01:07:32,370 --> 01:07:36,130 >> Setiap pertanyaan pada salah satu dari alat tersebut? 1148 01:07:36,130 --> 01:07:40,000 Apa saja? >> [Guarin] aku punya barang untuk memberikan, pertanyaan begitu baik, hal-hal yang baik. 1149 01:07:40,000 --> 01:07:43,700 >> [Bowen tertawa] Aku sudah menunjukkan Anda demo saya di sini. 1150 01:07:43,700 --> 01:07:47,000 Aku akan meletakkannya di halaman Sumber dan beralih ke pertanyaan sekarang. 1151 01:07:47,000 --> 01:07:53,850 Itu referensi pertama adalah bahwa situs Generation App dengan track permainan dan lagu app. 1152 01:07:53,850 --> 01:07:55,040 Mendaftar untuk mereka. 1153 01:07:55,040 --> 01:07:57,210 Anda tidak harus menunggu 30 hari untuk mendapatkan konten. 1154 01:07:57,210 --> 01:08:00,370 Anda dapat mulai pergi dan melihat konten yang Anda inginkan. 1155 01:08:00,370 --> 01:08:04,380 Saya memahami kerangka waktu Anda mungkin berbeda dari - [tertawa] 1156 01:08:04,380 --> 01:08:07,780 Jadi kapan Hackathon? Itu beberapa minggu, kan? 1157 01:08:07,780 --> 01:08:09,620 Jadi Anda tidak memiliki 30 hari untuk menunggu. 1158 01:08:09,620 --> 01:08:13,180 Jadi ya, Anda dapat mendaftar untuk itu dan kemudian hanya mulai menarik konten keluar dari itu. 1159 01:08:13,180 --> 01:08:15,320 Juga Dev dan Pusat Desain. 1160 01:08:15,320 --> 01:08:17,620 Dan aku tidak menyebutkan ini, tapi ada juga toko Docs. 1161 01:08:17,620 --> 01:08:22,880 Ini akan menjadi untuk setelah Hackathon seperti Anda siap untuk mulai mengirimkan aplikasi Anda untuk toko. 1162 01:08:22,880 --> 01:08:27,350 Ada beberapa panduan bermanfaat di sini, beberapa petunjuk tentang bagaimana untuk mendapatkan sesuatu ke toko, 1163 01:08:27,350 --> 01:08:29,960 beberapa masalah umum yang mungkin perjalanan Anda, 1164 01:08:29,960 --> 01:08:32,540 dan itulah akhir dari sumber daya tersebut. 1165 01:08:32,540 --> 01:08:35,300 >> Jadi apa yang ada di pikiran Anda? Apa pun yang Anda - 1166 01:08:35,300 --> 01:08:40,580 [Guarin] Siapa yang berpikir untuk melakukan sebuah aplikasi Windows untuk CS50? Keren. 1167 01:08:40,580 --> 01:08:42,200 [Bowen] Cool. Besar. 1168 01:08:44,149 --> 01:08:49,410 >> Setiap pertanyaan tentang hal-hal yang telah Anda lihat sejauh ini dan bagaimana kaitannya dengan ini? 1169 01:08:49,410 --> 01:08:54,540 Misalnya, dengan lebih banyak waktu saya bisa mengambil sebuah permainan yang saya tulis 1170 01:08:54,540 --> 01:08:57,310 dan yang berjalan di browser dan hanya jenis melalui proses 1171 01:08:57,310 --> 01:08:59,870 membawa itu ke Visual Studio dan membuatnya menjadi aplikasi Windows Store. 1172 01:08:59,870 --> 01:09:02,870 Dibutuhkan waktu lebih dari kita benar-benar harus menyertakan hari ini, 1173 01:09:02,870 --> 01:09:08,010 tapi versi pendek itu kode yang sama yang telah Anda berjalan di browser, 1174 01:09:08,010 --> 01:09:11,680 dan hal-hal yang Anda mengubah hal-hal yang Anda memutuskan untuk plug-in ke Windows 8. 1175 01:09:11,680 --> 01:09:16,220 Jadi jika Anda ingin menggunakan pesona, jika Anda ingin mencari atau berbagi, 1176 01:09:16,220 --> 01:09:19,899 Anda perlu membuat sebuah bar app untuk menyembunyikan diri beberapa fungsi ke itu, 1177 01:09:19,899 --> 01:09:21,939 mereka adalah hal-hal yang akan Anda ubah. 1178 01:09:21,939 --> 01:09:25,229 Tapi inti dari aplikasi web Anda bisa tetap utuh. 1179 01:09:25,229 --> 01:09:29,590 Sekali lagi, selama bekerja di IE10, itu akan menjadi pelabuhan sangat mudah 1180 01:09:29,590 --> 01:09:33,680 untuk membawa barang-barang itu ke dalam Visual Studio, ke Blend, dan membuatnya menjadi aplikasi Windows Store. 1181 01:09:33,680 --> 01:09:37,500 Sekali lagi, satu-satunya hal yang akan Anda perlu belajar adalah fitur-fitur lain 1182 01:09:37,500 --> 01:09:41,830 yang dapat Anda gunakan untuk menerangi sebuah aplikasi, seperti ubin hidup dan hal-hal semacam. 1183 01:09:41,830 --> 01:09:46,899 >> Ya. >> [Mahasiswa] Pertanyaan saya adalah tentang bekerja mobile. 1184 01:09:46,899 --> 01:09:52,210 Jadi jika Anda membuat sebuah aplikasi yang bekerja sebagai sebuah aplikasi pada desktop, 1185 01:09:52,210 --> 01:09:56,480 itu benar-benar mudah untuk mentransfer ke ponsel, atau apakah ada - 1186 01:09:56,480 --> 01:10:01,270 Pertanyaannya adalah, jika saya membuat aplikasi Windows Store yang benar-benar dioptimalkan untuk lingkungan ini 1187 01:10:01,270 --> 01:10:06,430 dan saya ingin membawanya ke dunia mobile, apa terlibat dengan melakukan hal itu? 1188 01:10:06,430 --> 01:10:10,060 Itu, seperti banyak pertanyaan, selalu jawaban yang terus berubah. 1189 01:10:10,060 --> 01:10:16,190 Kabar baiknya adalah jika Anda menempel dengan HTML dan JavaScript, CSS, 1190 01:10:16,190 --> 01:10:18,720 jika Anda mulai dari aplikasi Windows Store, 1191 01:10:18,720 --> 01:10:20,590 itu akan membiarkan Anda membawanya ke Web 1192 01:10:20,590 --> 01:10:24,650 dan kemudian menggunakan orang-orang macam teknik, seperti pertanyaan media dan hal-hal, 1193 01:10:24,650 --> 01:10:27,180 untuk beradaptasi dengan perangkat ukuran yang berbeda. 1194 01:10:27,180 --> 01:10:29,900 Yang mengatakan, selalu ada kerangka kerja dan hal-hal di luar sana 1195 01:10:29,900 --> 01:10:33,450 dukungan yang memperluas keluar teknologi yang berbeda, platform yang berbeda. 1196 01:10:33,450 --> 01:10:35,670 Bahwa perubahan sepanjang waktu. 1197 01:10:35,670 --> 01:10:40,030 Kami juga mengubah hal-hal baik seperti yang kita melihat ke arah apa yang kita miliki sekarang 1198 01:10:40,030 --> 01:10:42,950 sebenarnya dengan Windows Phone 8. 1199 01:10:42,950 --> 01:10:44,930 Kami memiliki beberapa infrastruktur inti bersama 1200 01:10:44,930 --> 01:10:48,180 ditawarkan antara aplikasi bagi lingkungan. 1201 01:10:48,180 --> 01:10:51,200 Jadi hal-hal yang Anda lakukan untuk membuat aplikasi Windows Store, 1202 01:10:51,200 --> 01:10:57,790 banyak yang dapat terbawa ke dalam Phone 8 aplikasi Windows juga. 1203 01:10:57,790 --> 01:11:02,270 Itu lagi adalah cerita yang muncul, jadi ada beberapa konten tentang itu sama Build. 1204 01:11:02,270 --> 01:11:06,780 SDK baru saja keluar beberapa saat yang lalu. Ini baru saja dirilis beberapa waktu yang lalu. 1205 01:11:06,780 --> 01:11:09,920 Tapi dalam hal platform lain juga, 1206 01:11:09,920 --> 01:11:13,360 Anda mungkin mengalami banyak kerangka lintas-platform juga. 1207 01:11:13,360 --> 01:11:16,170 Kabar baiknya adalah hal-hal yang Anda lakukan di sini, 1208 01:11:16,170 --> 01:11:19,620 fungsionalitas inti adalah lurus ke atas web standar barang. 1209 01:11:19,620 --> 01:11:24,010 Satu-satunya hal yang tidak akan menerjemahkan dengan mudah adalah hal-hal bahwa Windows 8 tidak, 1210 01:11:24,010 --> 01:11:28,060 tapi itu tidak mengherankan karena itu adalah fitur Windows. 1211 01:11:28,060 --> 01:11:34,090 Anda tidak akan menemukan berbagi atau jenis yang sama dari kontrak pada setiap platform lain. 1212 01:11:34,090 --> 01:11:37,480 Jadi mereka adalah hal-hal yang Anda ingin dari perspektif desain 1213 01:11:37,480 --> 01:11:40,820 pastikan Anda memiliki cara untuk jenis abstrak yang keluar sehingga Anda bisa mengatakan, 1214 01:11:40,820 --> 01:11:42,970 "Jika saya sedang menjalankan ini, saya bisa melakukan itu." 1215 01:11:42,970 --> 01:11:48,120 Jika aku tidak, ada beberapa pola desain yang dapat digunakan untuk jenis menyembunyikan hal-hal yang jauh. 1216 01:11:48,120 --> 01:11:53,360 Tapi ingatlah bahwa dalam pikiran. Ya. Maaf. Silakan. 1217 01:11:53,360 --> 01:11:58,130 >> [Mahasiswa] Jika saya ingin menguji aplikasi Windows saya di atas [tidak terdengar] 1218 01:11:58,130 --> 01:12:02,310 [Bowen] Ya. Saya melewatkan satu hal lagi juga. Ya. 1219 01:12:02,310 --> 01:12:04,910 Saya akan menjawab pertanyaan Anda terlebih dahulu, maka saya akan menampilkan fitur yang saya lupa lagi. 1220 01:12:04,910 --> 01:12:09,220 Kami memiliki beberapa mesin yang tersedia secara lokal. Maafkan aku. 1221 01:12:09,220 --> 01:12:11,240 Pertanyaannya adalah, bagaimana cara menguji hal-hal pada perangkat 1222 01:12:11,240 --> 01:12:14,230 jika saya tidak kebetulan memiliki seluruh banyak hal untuk memilih dari? 1223 01:12:14,230 --> 01:12:17,130 [Guarin] Kami meminjamkan kalian, saya pikir, 5 atau 6. Berapa banyak yang Anda butuhkan? 1224 01:12:17,130 --> 01:12:20,940 [Mahasiswa] Kami punya 4 dari mereka. >> Oke. Kalian punya 4 sabak untuk bermain-main dengan. 1225 01:12:20,940 --> 01:12:25,520 Jadi pasti biarkan semua orang tahu, silakan. [Tertawa] >> [Bowen] Awesome. 1226 01:12:25,520 --> 01:12:27,610 Itulah jawaban yang lebih baik daripada aku akan memberimu. 1227 01:12:27,610 --> 01:12:31,250 Kami memiliki jam kantor untuk pengembang yang kita lakukan di kantor kami 1228 01:12:31,250 --> 01:12:35,110 dan sekarang segera hadir untuk Store Microsoft atas di Pru, 1229 01:12:35,110 --> 01:12:37,010 tapi Edwin sudah diurus Anda. 1230 01:12:37,010 --> 01:12:42,180 Ada 4 papan tulis tersedia untuk peminjaman, untuk pengujian. 1231 01:12:42,180 --> 01:12:45,440 Di sana kami pergi. Ada salah satu contoh di atas sana. 1232 01:12:45,440 --> 01:12:47,340 Jadi yeah, benar-benar. Besar. 1233 01:12:47,340 --> 01:12:52,700 Benar-benar jauh cara terbaik untuk menguji itu adalah untuk berada di perangkat. 1234 01:12:52,700 --> 01:12:56,810 Jika Anda tidak kebetulan memiliki satu belum atau Anda tidak ingin berjalan melintasi kampus di salju 1235 01:12:56,810 --> 01:13:01,130 untuk mengambil satu atau apa pun, ada cara untuk melakukan ini kembali di Visual Studio. 1236 01:13:01,130 --> 01:13:10,360 Jika aku kembali ke tempat aku berada di sini, di sini alih-alih menggunakan mesin lokal, 1237 01:13:10,360 --> 01:13:13,590 Anda dapat terhubung ke remote mesin, tapi itu tidak apa yang saya bicarakan di sini. 1238 01:13:13,590 --> 01:13:16,830 Simulator adalah hal yang Anda mungkin ingin melihat ke dalam. 1239 01:13:16,830 --> 01:13:22,120 Saya akan menjalankan ini, dan benar-benar apa itu, itu dasarnya jendela ke sistem Anda sendiri. 1240 01:13:22,120 --> 01:13:26,260 Berikut sebenarnya sistem berjalan, berlari Contoso, 1241 01:13:26,260 --> 01:13:29,550 tapi dengan cara yang memungkinkan saya mengubah beberapa parameter eksekusi, 1242 01:13:29,550 --> 01:13:31,060 parameter lingkungan. 1243 01:13:31,060 --> 01:13:34,150 Jadi saya bisa katakan di sini, "Kau tahu apa?" 1244 01:13:34,150 --> 01:13:39,240 Oh. Aku sudah berjalan dalam simulasi Monitor 27 inci pada resolusi 2560. 1245 01:13:39,240 --> 01:13:44,930 Saya dapat dengan mudah menjatuhkan yang turun dan melihat apa aplikasi saya akan lakukan dengan layar yang lebih kecil 1246 01:13:44,930 --> 01:13:47,480 atau dengan mengubah pengaturan DPI atau apa pun. 1247 01:13:47,480 --> 01:13:50,700 Jadi pada layar kecil, 10.6, apa itu akan dilakukan? 1248 01:13:50,700 --> 01:13:53,040 Itu masih terlihat cukup bagus, kan? 1249 01:13:53,040 --> 01:13:58,220 Anda akan ingin melakukan hal ini, terutama jika Anda mengirimkan ke toko, karena kita lakukan 1250 01:13:58,220 --> 01:14:00,480 sebagai bagian dari proses pengujian. 1251 01:14:00,480 --> 01:14:02,400 Dan jika ada masalah seperti itu, 1252 01:14:02,400 --> 01:14:06,160 maka Anda mungkin mengalami masalah mendapatkan sertifikasi untuk toko. 1253 01:14:06,160 --> 01:14:09,240 Tapi itu bagian dari simulator. Benar-benar keren. Sangat mudah untuk melakukan itu. 1254 01:14:09,240 --> 01:14:11,480 Anda juga dapat menggunakan fitur-fitur seperti berputar itu juga. 1255 01:14:11,480 --> 01:14:15,650 Aku bisa klik tombol di sini, memilikinya memutar, melihat apa yang seseorang akan memiliki sebagai pengalaman 1256 01:14:15,650 --> 01:14:20,970 berputar batu tulis mereka, tablet mereka, dan menggunakan aplikasi Anda dengan itu. 1257 01:14:20,970 --> 01:14:25,060 Ada beberapa hal lain juga seperti sentuhan emulasi dan beberapa hal lain, 1258 01:14:25,060 --> 01:14:27,210 pengaturan GPS. 1259 01:14:27,210 --> 01:14:31,050 Aku bisa berpura-pura aku di lokasi yang berbeda dan melihat apa aplikasi saya tidak 1260 01:14:31,050 --> 01:14:34,690 ketika saya berpura-pura bahwa aku kembali di Seattle atau sesuatu. 1261 01:14:34,690 --> 01:14:41,970 Tapi itu fitur yang sangat berguna, dan itu dibangun untuk kedua Visual Studio dan di Blend. 1262 01:14:41,970 --> 01:14:44,460 Ya. Pertanyaan Anda. 1263 01:14:44,460 --> 01:14:48,530 >> [Mahasiswa] Jika Anda menulis permainan, apakah Visual Studio memiliki dukungan untuk animasi? 1264 01:14:48,530 --> 01:14:55,550 Ya. Pertanyaannya adalah sekitar dukungan animasi, terutama dengan game. 1265 01:14:55,550 --> 01:14:58,380 Itu tergantung. [Terkekeh] 1266 01:14:58,380 --> 01:15:06,870 Dengan JavaScript Aku akan mengatakan ada mungkin kurang dukungan daripada ada di sisi XAML, 1267 01:15:06,870 --> 01:15:11,430 yang memiliki batas waktu, memiliki storyboard dan hal-hal yang built in 1268 01:15:11,430 --> 01:15:18,710 Untuk animasi pada aplikasi JavaScript, saya tidak tahu berapa banyak jawaban yang saya ingin memberi Anda. 1269 01:15:18,710 --> 01:15:25,110 Saya memiliki sumber daya di blog saya yang pergi melalui banyak pilihan untuk kedua animasi fisika, 1270 01:15:25,110 --> 01:15:29,280 pilihan untuk game JavaScript berorientasi pada Windows 8. 1271 01:15:29,280 --> 01:15:31,300 Saya akan merujuk Anda kepada mereka. 1272 01:15:31,300 --> 01:15:34,300 Pada dasarnya, ada begitu banyak pilihan. 1273 01:15:34,300 --> 01:15:37,770 Alasan saya ragu-ragu adalah ada begitu banyak pilihan untuk melakukan animasi dengan JavaScript. 1274 01:15:37,770 --> 01:15:44,280 Ini bisa menjadi CSS, itu bisa Canvas berbasis, bisa jadi animasi DOM hanya dasar, 1275 01:15:44,280 --> 01:15:47,470 itu bisa menjadi banyak hal yang berbeda, sehingga benar-benar tergantung pada pilihan Anda. 1276 01:15:47,470 --> 01:15:55,790 Jika Anda memutuskan untuk menggunakan sesuatu seperti Create.js atau Lime atau jenis lain dari kerangka - 1277 01:15:55,790 --> 01:15:59,150 Yah, aku bahkan tidak yakin Anda akan dapat menggunakan kerangka akhir yang lebih tinggi 1278 01:15:59,150 --> 01:16:01,370 Dampak suka atau Membangun. 1279 01:16:01,370 --> 01:16:07,000 Yang cenderung menghasilkan lebih banyak daripada kode Anda mungkin mempertimbangkan dari awal. 1280 01:16:07,000 --> 01:16:11,730 Namun dalam kasus tersebut, Anda masih bisa menggunakan simulator, Anda dapat menggunakan lingkungan, 1281 01:16:11,730 --> 01:16:17,480 dan saya cenderung hanya menggunakan lingkungan ini untuk platform pengujian saya dalam kasus-kasus 1282 01:16:17,480 --> 01:16:19,930 karena saya sedang mengembangkan permainan. 1283 01:16:19,930 --> 01:16:22,110 Aku sudah baik-baik saja terutama dengan kanvas animasi, 1284 01:16:22,110 --> 01:16:23,850 yang mungkin adalah hal yang paling umum. 1285 01:16:23,850 --> 01:16:27,360 Yang terbaik Anda akan menemukan mungkin adalah alat dev di browser 1286 01:16:27,360 --> 01:16:30,160 dan alat dev di Visual Studio. 1287 01:16:30,160 --> 01:16:34,610 Jenis jawaban yang berkelok-kelok di sana, tapi mudah-mudahan saya mendapat jawaban Anda. Ya. Anda. 1288 01:16:34,610 --> 01:16:36,470 >> [Mahasiswa] Apa saja pilihan penyimpanan data untuk Windows 8 apps? 1289 01:16:36,470 --> 01:16:41,100 Apa saja pilihan penyimpanan data untuk Windows 8 apps, Windows apps Store? 1290 01:16:41,100 --> 01:16:46,790 Pilihan Anda benar-benar setiap aplikasi mendapat kolam renang sendiri penyimpanan lokal 1291 01:16:46,790 --> 01:16:52,150 untuk pengaturan dan untuk data, tetapi juga ridiculously mudah untuk menggunakan penyimpanan roaming, 1292 01:16:52,150 --> 01:16:54,920 menggunakan penyimpanan berbasis cloud. Ini gratis. 1293 01:16:54,920 --> 01:16:58,250 Apa yang terjadi adalah pada dasarnya anda memilih kelas yang berbeda dan Anda mengatakan, 1294 01:16:58,250 --> 01:17:03,370 "Roaming Pengaturan, Simpan, set tertentu dari konten," 1295 01:17:03,370 --> 01:17:06,050 dan akun Microsoft mereka, apa pun yang mereka telah masuk sebagai, 1296 01:17:06,050 --> 01:17:08,620 akan menjadi kunci untuk jelajah informasi bahwa sekitar. 1297 01:17:08,620 --> 01:17:13,790 Jadi jika saya menggunakan permainan Anda pada laptop saya dan kemudian saya log in dengan akun yang sama 1298 01:17:13,790 --> 01:17:18,900 dan saya memainkan permainan pada Permukaan atau tablet, 1299 01:17:18,900 --> 01:17:23,610 yang secara otomatis akan berkeliaran bahwa pengaturan dan data antara mesin-mesin. 1300 01:17:23,610 --> 01:17:27,550 Itu hal yang default. Itu baik untuk jumlah tertentu dari data. 1301 01:17:27,550 --> 01:17:30,220 Anda tidak akan menempatkan database besar menjadi mereka. 1302 01:17:30,220 --> 01:17:35,350 Untuk itu Anda perlu untuk pergi ke jenis lain dari solusi, seperti database host di awan, 1303 01:17:35,350 --> 01:17:36,690 hal-hal seperti itu. 1304 01:17:36,690 --> 01:17:39,840 Ada beberapa pilihan masyarakat lain di sekitar jenis lain dari teknologi data. 1305 01:17:39,840 --> 01:17:42,920 Saya telah melihat beberapa pilihan SQLite dalam komunitas di sekitar sana juga. 1306 01:17:42,920 --> 01:17:46,690 Jadi semakin banyak yang muncul, tetapi mereka adalah hal-hal utama yang akan Anda melihat ke arah 1307 01:17:46,690 --> 01:17:49,430 untuk permainan atau aplikasi. 1308 01:17:49,430 --> 01:17:50,610 Dan Anda memiliki pertanyaan di belakang juga. 1309 01:17:50,610 --> 01:18:02,390 >> [Mahasiswa] Dalam hal jaringan [tidak terdengar] meng-upload atau men-download file [tidak terdengar] 1310 01:18:02,390 --> 01:18:04,870 [Bowen] Apakah pertanyaan Anda bagaimana Anda dapat melihat bahwa atau bagaimana Anda dapat men-debug itu dan mengujinya? 1311 01:18:04,870 --> 01:18:10,630 [Mahasiswa] Bagaimana Anda bisa debug itu [tidak terdengar] 1312 01:18:10,630 --> 01:18:12,670 Maaf. Aku tidak bisa mendengar semua itu. 1313 01:18:12,670 --> 01:18:16,480 [Mahasiswa] Bagaimana Anda mendapatkannya bug diuji dan juga [tidak terdengar] 1314 01:18:16,480 --> 01:18:17,490 Besar. Besar. 1315 01:18:17,490 --> 01:18:21,860 Bagaimana Anda bekerja dengan jaringan? Bagaimana Anda bisa melihat apa yang terjadi? 1316 01:18:21,860 --> 01:18:23,620 Ada banyak jawaban yang berbeda dengan yang satu ini, 1317 01:18:23,620 --> 01:18:26,420 tapi biarkan saya menunjukkan Anda mungkin hal yang paling mudah di sini. 1318 01:18:26,420 --> 01:18:29,350 Mari saya menyingkirkan simulator untuk kedua. 1319 01:18:29,350 --> 01:18:31,740 Pilihan debugging hanya beberapa untuk jaringan. 1320 01:18:31,740 --> 01:18:36,070 Ada tumpukan jaringan penuh dipanggang langsung ke kedua tingkat WinRT dan dari WinJS, 1321 01:18:36,070 --> 01:18:42,810 sehingga Anda dapat dengan mudah membuat XHR, jenis AJAX panggilan dari permainan atau aplikasi untuk melakukan itu. 1322 01:18:42,810 --> 01:18:47,250 Terutama, saya cenderung menggunakan 2 hal. 1323 01:18:47,250 --> 01:18:53,660 Saya menggunakan alat dev sebenarnya sendiri, yang memiliki jaringan stack dipanggang ke dalamnya. 1324 01:18:53,660 --> 01:18:55,870 Mari saya tunjukkan halaman rumah Windows. 1325 01:18:55,870 --> 01:19:02,730 Saya bisa membawa hal ini, dan sebenarnya ada proxy jaringan dimasukkan ke alat ini di sini. 1326 01:19:02,730 --> 01:19:08,390 Jadi aku bisa melakukan ini, saya bisa refresh halaman, dan itu akan menunjukkan semua interaksi, 1327 01:19:08,390 --> 01:19:14,550 termasuk AJAX panggilan untuk sesi itu, untuk durasi yang permintaan itu. 1328 01:19:14,550 --> 01:19:17,600 Hal ini berguna. Ini akan sangat berguna untuk aplikasi berbasis browser. 1329 01:19:17,600 --> 01:19:20,470 Untuk jenis lain dari aplikasi, termasuk Windows apps Store, 1330 01:19:20,470 --> 01:19:23,970 Saya menggunakan alat yang disebut Fiddler. 1331 01:19:23,970 --> 01:19:29,650 Anda akan mendapatkan permainan di respon. [Terkekeh] 1332 01:19:29,650 --> 01:19:32,750 Fiddler adalah proxy sederhana. Saya pikir saya bisa menunjukkan kepada Anda. 1333 01:19:32,750 --> 01:19:40,190 Hanya saja GetFiddler.com, yang cukup menarik, aku menelusuri tumpukan jaringan saya 1334 01:19:40,190 --> 01:19:41,740 akan GetFiddler. 1335 01:19:41,740 --> 01:19:45,700 Tapi bagaimanapun, Fiddler telah ditulis oleh salah satu PMS di tim IE, 1336 01:19:45,700 --> 01:19:48,290 jadi dia tahu apa yang dia lakukan. 1337 01:19:48,290 --> 01:19:52,630 Ini adalah proxy yang baik yang dapat Anda gunakan untuk lalu lintas jaringan debugging. 1338 01:19:52,630 --> 01:19:55,730 Saya akan merekomendasikan itu. Pertanyaan di sana juga. 1339 01:19:55,730 --> 01:19:58,050 >> [Mahasiswa] Apakah ada cara mudah untuk mengintegrasikan masukan bahasa asing, 1340 01:19:58,050 --> 01:20:00,810 seperti Jepang atau Cina, ke dalam aplikasi Windows? 1341 01:20:00,810 --> 01:20:03,240 Saya tidak bisa mengatakan saya telah melakukan terlalu banyak sendiri, tetapi dipanggang masuk 1342 01:20:03,240 --> 01:20:08,470 Ada pilihan untuk tentu saja memancarkan aplikasi Anda - Maafkan aku, aku tidak mengatakan pertanyaan - 1343 01:20:08,470 --> 01:20:11,100 pilihan di seluruh globalisasi, lokalisasi konten, 1344 01:20:11,100 --> 01:20:14,320 termasuk hal-hal seperti mampu menjual di pasar yang berbeda 1345 01:20:14,320 --> 01:20:19,190 dan target yang versi aplikasi Anda untuk bahasa-bahasa individual 1346 01:20:19,190 --> 01:20:21,080 atau budaya atau hal-hal seperti itu. Benar-benar built in 1347 01:20:21,080 --> 01:20:22,980 Kami telah memiliki dukungan untuk itu untuk selamanya, 1348 01:20:22,980 --> 01:20:26,630 dan yang membawa ke depan ke dalam pilihan Anda untuk Windows Store. 1349 01:20:26,630 --> 01:20:30,450 Anda dapat melakukannya di toko sendiri, menjual di pasar yang berbeda, 1350 01:20:30,450 --> 01:20:34,050 Anda dapat melakukannya di aplikasi serta juga dengan menggunakan sumber daya untuk mendefinisikan, 1351 01:20:34,050 --> 01:20:42,220 "Jika saya dikembangkan untuk budaya ini, kemudian gunakan mengabaikan ini untuk konten tekstual saya 1352 01:20:42,220 --> 01:20:44,510 "Atau menggunakan hak untuk pembaca kiri." 1353 01:20:44,510 --> 01:20:51,290 Mereka semua adalah bagian dari WinJS default dan WinRT API. Pertanyaan yang bagus. 1354 01:20:51,290 --> 01:20:54,770 >> Bagaimana kita lakukan? Setiap orang lain? 1355 01:20:54,770 --> 01:20:58,850 Dan jika ada di video memiliki pertanyaan, aku cbowen @ microsoft, 1356 01:20:58,850 --> 01:21:02,790 jadi saya senang untuk mengambil salah satu dari pertanyaan Anda dari masa depan. 1357 01:21:02,790 --> 01:21:05,690 Sangat - Dari masa depan, masa depan [meniru gema]. 1358 01:21:05,690 --> 01:21:09,140 Jadi di sini adalah saya. Mari saya dimasukkan kembali kontak saya di sini. 1359 01:21:09,140 --> 01:21:11,840 Jadi saya hanya mengirim catatan, cbowen @ microsoft, 1360 01:21:11,840 --> 01:21:15,190 dan aku akan kembali kepada Anda sesegera mungkin. 1361 01:21:15,190 --> 01:21:19,010 >> Apa pun yang Anda bertanya-tanya? Apakah kita baik? 1362 01:21:19,010 --> 01:21:24,050 Besar. Baik. Terima kasih semua sangat banyak. Saya menghargai itu. [Tepuk tangan] 1363 01:21:24,800 --> 01:21:27,000 >> [CS50.TV]