1 00:00:00,000 --> 00:00:39,630 2 00:00:39,630 --> 00:00:41,880 DAVID J. MALAN: Bine, astfel încât aceasta de aici este brațul Myo 3 00:00:41,880 --> 00:00:44,450 bandă, un cuplu de care ne-am au pentru proiecte finale CS50. 4 00:00:44,450 --> 00:00:47,533 Și asta a fost o demonstrație noi în coadă te-ai trezit în avans în cazul în care, în esență, 5 00:00:47,533 --> 00:00:51,120 acest braț destul de strâns trupa aici ascultă mișcările musculare 6 00:00:51,120 --> 00:00:54,280 care sunt apoi mapate în software-ul pentru laptop Colton pe deasupra aici care 7 00:00:54,280 --> 00:00:57,230 a avut iTunes și că melodie deja coada de așteptare în sus. 8 00:00:57,230 --> 00:01:00,270 Mai degrabă decât să mă demoing aceasta, Colton a fost în laborator 9 00:01:00,270 --> 00:01:04,129 în mod clar toată săptămâna printr-o demonstrație gata pentru un voluntar curajos. 10 00:01:04,129 --> 00:01:07,430 Dacă cineva ar dori să vină pe up-- a văzut mâna întâi. 11 00:01:07,430 --> 00:01:09,540 Haide sus. 12 00:01:09,540 --> 00:01:12,530 >> Bine. 13 00:01:12,530 --> 00:01:13,886 Și care este numele tău? 14 00:01:13,886 --> 00:01:14,800 >> Audiența: Uh, Maria. 15 00:01:14,800 --> 00:01:16,550 >> DAVID J. MALAN: Maria, mă bucur să te văd. 16 00:01:16,550 --> 00:01:17,310 Vino pe aici. 17 00:01:17,310 --> 00:01:19,550 Permiteți-mi să vă prezint Colton. 18 00:01:19,550 --> 00:01:21,290 Colton, aceasta este Maria. 19 00:01:21,290 --> 00:01:23,050 >> COLTON: Bună, mă bucur să te cunosc. 20 00:01:23,050 --> 00:01:24,330 >> DAVID J. MALAN: Toate Bine, deci primul pas, suntem 21 00:01:24,330 --> 00:01:26,204 O să ai pune acest pe antebratul 22 00:01:26,204 --> 00:01:29,280 astfel că este destul de strâns până aproape de cot. 23 00:01:29,280 --> 00:01:31,940 Și între timp, să aibă a pus pe sticla noastră Google 24 00:01:31,940 --> 00:01:33,720 și ne vom amesteca tehnologii astăzi. 25 00:01:33,720 --> 00:01:36,340 >> COLTON: În primul rând va trebui să cârlig acest lucru în lucruri. 26 00:01:36,340 --> 00:01:37,170 >> DAVID J. MALAN: OK. 27 00:01:37,170 --> 00:01:39,795 De fapt, să pună brațul drept aproape de acest cablu în calitate de posibil 28 00:01:39,795 --> 00:01:41,160 astfel încât să putem sincroniza mai întâi în sus. 29 00:01:41,160 --> 00:01:42,740 >> COLTON: Hai să facem acest lucru. 30 00:01:42,740 --> 00:01:46,500 >> DAVID J. MALAN: Și între timp, așa că toată lumea poate obține dintr-o ochire mai aproape, 31 00:01:46,500 --> 00:01:50,290 vom arunca camera lui Andrew pe ecran acolo. 32 00:01:50,290 --> 00:01:54,460 Deci, avem un cablu USB care este fiind conectat la banderola Maria. 33 00:01:54,460 --> 00:02:00,230 Și să-mi arunce de ecran Colton lui pe proiector următor. 34 00:02:00,230 --> 00:02:06,000 >> Deci, Colton este înregistrarea dispozitivului acum ca un Myo conectat la acest cablu. 35 00:02:06,000 --> 00:02:08,060 Și acum, ce Maria de gând să faci momentan 36 00:02:08,060 --> 00:02:10,120 se plimba de fapt prin treptele de etalonare 37 00:02:10,120 --> 00:02:12,830 și să învețe software-ul cum mușchii ei răspund 38 00:02:12,830 --> 00:02:16,070 atunci când ea face anumite pre-definite gesturi care software-ul înțelege. 39 00:02:16,070 --> 00:02:17,910 Dacă doriți să mergeți în fața ecranului. 40 00:02:17,910 --> 00:02:26,840 41 00:02:26,840 --> 00:02:30,090 OK, mai încearcă. 42 00:02:30,090 --> 00:02:31,860 >> COLTON: Du-te ca aceasta. 43 00:02:31,860 --> 00:02:32,970 Și așa. 44 00:02:32,970 --> 00:02:34,563 Și tot drumul spre dreapta. 45 00:02:34,563 --> 00:02:35,922 Du-te înapoi. 46 00:02:35,922 --> 00:02:37,740 >> DAVID J. MALAN: OK. 47 00:02:37,740 --> 00:02:38,960 Diferit perspectivă. 48 00:02:38,960 --> 00:02:39,620 Nu e de tine. 49 00:02:39,620 --> 00:02:40,350 Ne-E. 50 00:02:40,350 --> 00:02:41,749 >> MARIA: OK. 51 00:02:41,749 --> 00:02:42,540 DAVID J. MALAN: Nu. 52 00:02:42,540 --> 00:02:46,720 53 00:02:46,720 --> 00:02:51,540 Să ne mișcăm mai mare, astfel că este mai aproape de cot, sau chiar mai stricte. 54 00:02:51,540 --> 00:02:52,680 Bine. 55 00:02:52,680 --> 00:02:53,270 >> Aici vom merge. 56 00:02:53,270 --> 00:02:56,780 Acest lucru ar fi un moment bun pentru CS52X. 57 00:02:56,780 --> 00:02:57,670 Acolo mergem. 58 00:02:57,670 --> 00:02:58,760 >> Foarte frumos. 59 00:02:58,760 --> 00:03:01,170 OK. 60 00:03:01,170 --> 00:03:02,790 Degetul mare pentru a pinky. 61 00:03:02,790 --> 00:03:03,380 >> Foarte frumos. 62 00:03:03,380 --> 00:03:05,140 Spread degetele. 63 00:03:05,140 --> 00:03:06,240 Bun. 64 00:03:06,240 --> 00:03:06,910 Val dreapta. 65 00:03:06,910 --> 00:03:15,052 66 00:03:15,052 --> 00:03:17,010 Este curios arată vă cu hand-- stângă 67 00:03:17,010 --> 00:03:19,665 >> COLTON: Da, e ciudat. 68 00:03:19,665 --> 00:03:21,790 DAVID J. MALAN: Wave la dreapta și merge mai departe. 69 00:03:21,790 --> 00:03:22,998 Fast forward pentru a sări peste sau următor. 70 00:03:22,998 --> 00:03:25,020 Asta-i în regulă drept Wave. 71 00:03:25,020 --> 00:03:26,650 >> MARIA: Eu don't-- aștepta. 72 00:03:26,650 --> 00:03:28,430 >> DAVID J. MALAN: Aveți nevoie de ajutor? 73 00:03:28,430 --> 00:03:30,027 >> COLTON: Deci, te duci așa. 74 00:03:30,027 --> 00:03:31,860 MARIA: E de cotitură alt lucru, totuși. 75 00:03:31,860 --> 00:03:32,390 COLTON: Este. 76 00:03:32,390 --> 00:03:34,250 DAVID J. MALAN: Da, nu știu de ce te arată un leftie. 77 00:03:34,250 --> 00:03:36,458 COLTON: De ce nu try-- doar încercați să mergi așa. 78 00:03:36,458 --> 00:03:38,910 79 00:03:38,910 --> 00:03:40,090 >> DAVID J. MALAN: Nu? 80 00:03:40,090 --> 00:03:42,580 Poate ajunge la brațul tău un pic mai drept 81 00:03:42,580 --> 00:03:46,070 și să-l mai abruptă ca aceasta. 82 00:03:46,070 --> 00:03:48,176 Da, OK, haide. 83 00:03:48,176 --> 00:03:49,670 >> MARIA: Îmi pare rău. 84 00:03:49,670 --> 00:03:51,170 DAVID J. MALAN: Nu e vina ta. 85 00:03:51,170 --> 00:03:53,018 COLTON: E bine. 86 00:03:53,018 --> 00:03:55,430 DAVID J. MALAN: Bine. 87 00:03:55,430 --> 00:03:56,220 Well-- 88 00:03:56,220 --> 00:03:57,620 >> MARIA: Ar trebui să sari peste asta, atunci? 89 00:03:57,620 --> 00:03:59,620 DAVID J. MALAN: Da, hai l-ai lăsat pe cârlig. 90 00:03:59,620 --> 00:04:03,130 Deci, dacă cineva ar dori să facă un proiect final folosirea acestui margine de tăiere 91 00:04:03,130 --> 00:04:07,707 hardware, s-ar putea realiza doar ia un pic sa va obisnuiti cu. 92 00:04:07,707 --> 00:04:10,290 Și asta: realitatea este aceasta este, de fapt, foarte sângerare margine. 93 00:04:10,290 --> 00:04:12,040 >> Aceasta este ceea ce se numește kit-ul de dezvoltator, care 94 00:04:12,040 --> 00:04:14,956 este menit să fie, în esență, o eliberare de pre astfel încât oamenii pot face exact 95 00:04:14,956 --> 00:04:18,690 astea-- lupta cu ea, figura cum corpurile oamenilor de lucru 96 00:04:18,690 --> 00:04:19,980 cu tehnologia. 97 00:04:19,980 --> 00:04:21,750 Deci, dacă vrei după aceea, după curs, 98 00:04:21,750 --> 00:04:23,750 putem lăsa să vină și să ia o altă lovitură de cuțit la el. 99 00:04:23,750 --> 00:04:26,970 Dar în caz contrar, o rundă de aplauze, în cazul în care am putea, de Maria pentru că a venit pe sus. 100 00:04:26,970 --> 00:04:28,770 >> MARIA: Vă mulțumesc. 101 00:04:28,770 --> 00:04:30,390 >> DAVID J. MALAN: Mulțumesc. 102 00:04:30,390 --> 00:04:34,945 Vom atârnă pe aceasta, dar vom da Tu-- ce zici de o minge de stres aici? 103 00:04:34,945 --> 00:04:38,620 Oh, si-- if-- da, mulțumesc. 104 00:04:38,620 --> 00:04:39,715 Bine. 105 00:04:39,715 --> 00:04:45,750 Deci, pentru curioși, dacă ai fi familiarizat cu alegerea de sunet 106 00:04:45,750 --> 00:04:47,670 că ne-am făcut acolo mai devreme, un TV uimitor 107 00:04:47,670 --> 00:04:50,210 arată că ar trebui absolut fie pe Netflix, ma uit la chef 108 00:04:50,210 --> 00:04:51,110 Este aceasta o aici. 109 00:04:51,110 --> 00:04:54,472 >> SPEAKER 1: Doamnelor și domnilor, un magician pe nume Josh. 110 00:04:54,472 --> 00:05:04,710 111 00:05:04,710 --> 00:05:08,050 >> DAVID J. MALAN: Si se pare, e un lucru pentru mine de text în timpul curs acum. 112 00:05:08,050 --> 00:05:11,190 Mi se spune că Maria a avut ieri o zi de naștere. 113 00:05:11,190 --> 00:05:14,095 Atât de fericit ziua de nastere de la CS50 la Maria la fel de bine. 114 00:05:14,095 --> 00:05:18,720 115 00:05:18,720 --> 00:05:22,090 >> Deci, este posibil să fi citit în luna recent că acest domnilor aici, Steve 116 00:05:22,090 --> 00:05:25,260 Ballmer, care a fost de fapt clasă de 1977 la fotbal, 117 00:05:25,260 --> 00:05:27,170 recent pensionat pentru Microsoft. 118 00:05:27,170 --> 00:05:29,620 A fost un student aici, apoi câțiva ani mai târziu 119 00:05:29,620 --> 00:05:31,910 sa trezit la Stanford Business School 120 00:05:31,910 --> 00:05:34,160 atunci când a primit un telefon apel de la un prieten de-al său care 121 00:05:34,160 --> 00:05:36,516 a trăit pe hol de la el aici la Harvard. 122 00:05:36,516 --> 00:05:38,640 Numele respectivului prieten a fost Bill Gates, iar la momentul respectiv, 123 00:05:38,640 --> 00:05:42,700 el a fost încercarea de a recruta Steve a fi prima persoana de afaceri, într-adevăr, 124 00:05:42,700 --> 00:05:45,720 la o companie mica nume Microsoft. 125 00:05:45,720 --> 00:05:48,960 >> O scurtă poveste lungă, Steve a fost în cele din urmă a câștigat peste, 126 00:05:48,960 --> 00:05:52,130 s-au alăturat Microsoft, atunci când a avut doar 30 de angajați. 127 00:05:52,130 --> 00:05:54,300 Și de timp el retras destul de recent, 128 00:05:54,300 --> 00:05:58,100 compania a avut 100.000 de angajati în ultimii câțiva ani. 129 00:05:58,100 --> 00:06:01,171 Și astfel un site cunoscut sub numele de acostament pregătit acest tribut pe video 130 00:06:01,171 --> 00:06:02,920 pe care le-am gândit să comun, care vă oferă 131 00:06:02,920 --> 00:06:08,380 un sentiment de cat de mult energie Steve aduce la orice prezentare dă. 132 00:06:08,380 --> 00:06:11,884 133 00:06:11,884 --> 00:06:12,550 [VIDEO PLAYBACK] 134 00:06:12,550 --> 00:06:16,220 -Microsoft E ca un al patrulea copil. 135 00:06:16,220 --> 00:06:18,260 Copiii fac ieși din casă. 136 00:06:18,260 --> 00:06:21,875 În acest caz, cred Plec din casa. 137 00:06:21,875 --> 00:06:23,270 Hei Bill, whazzap? 138 00:06:23,270 --> 00:06:24,200 >> -Wazzap? 139 00:06:24,200 --> 00:06:25,320 >> Hei, wazzap? 140 00:06:25,320 --> 00:06:28,590 Am primit un oportunitate enormă. 141 00:06:28,590 --> 00:06:30,210 Și Bill ne-a dat această ocazie. 142 00:06:30,210 --> 00:06:35,520 143 00:06:35,520 --> 00:06:36,770 Vreau să le mulțumesc Bill pentru asta. 144 00:06:36,770 --> 00:06:39,630 Vreau să prea. 145 00:06:39,630 --> 00:06:42,500 Ritmul de inovare nu este de gând să încetinească. 146 00:06:42,500 --> 00:06:45,140 >> Este mergi la a lua mai repede și mai repede. 147 00:06:45,140 --> 00:06:50,165 Ar putea fi câteva concurenți care sunt, din păcate, eliminate! 148 00:06:50,165 --> 00:06:54,337 149 00:06:54,337 --> 00:06:59,564 >> Îmi place această companie. 150 00:06:59,564 --> 00:07:00,064 Da! 151 00:07:00,064 --> 00:07:03,452 152 00:07:03,452 --> 00:07:08,250 Eu sunt un PC, si-mi place aceasta companie! 153 00:07:08,250 --> 00:07:13,090 >> Dezvoltatori, dezvoltatori, dezvoltatori, dezvoltatori, dezvoltatori, dezvoltatori, 154 00:07:13,090 --> 00:07:14,560 dezvoltatori, dezvoltatorii. 155 00:07:14,560 --> 00:07:17,500 156 00:07:17,500 --> 00:07:18,970 Da! 157 00:07:18,970 --> 00:07:19,950 Dezvoltatori web! 158 00:07:19,950 --> 00:07:21,420 >> Dezvoltatori web! 159 00:07:21,420 --> 00:07:22,890 Dezvoltatori web! 160 00:07:22,890 --> 00:07:25,830 161 00:07:25,830 --> 00:07:28,770 Ascultați ce altceva te ajunge la nici un cost suplimentar! 162 00:07:28,770 --> 00:07:31,960 >> Executivul MS-DOS, o programare calandru, un morman carte, un pad notă, 163 00:07:31,960 --> 00:07:33,750 un ceas, un panou de control. 164 00:07:33,750 --> 00:07:35,461 Si, îți vine să crezi? 165 00:07:35,461 --> 00:07:35,960 Reversie! 166 00:07:35,960 --> 00:07:37,270 >> Arde-le pe CD-ul! 167 00:07:37,270 --> 00:07:38,660 Le publica în MSN! 168 00:07:38,660 --> 00:07:40,422 Le-ai ne la prieteni! 169 00:07:40,422 --> 00:07:41,790 >> Toate cu un singur click! 170 00:07:41,790 --> 00:07:48,670 O Microsoft, o strategie, o team-- concentrat, disciplinat, profesionist, 171 00:07:48,670 --> 00:07:50,610 și expert în tot ceea ce facem. 172 00:07:50,610 --> 00:07:52,670 Permiteți-mi să folosesc o linie de la un film vechi. 173 00:07:52,670 --> 00:07:54,810 >> Relațiile sunt ca rechinii. 174 00:07:54,810 --> 00:07:57,480 Ei se mișcă înainte sau mor. 175 00:07:57,480 --> 00:08:01,470 Cred că de fapt tech companiile sunt aceleași. 176 00:08:01,470 --> 00:08:04,801 >> [END VIDEO PLAYBACK] 177 00:08:04,801 --> 00:08:08,050 DAVID J. MALAN: Deci, suntem atât de încântați să anunțăm că Steve va fi alături de noi 178 00:08:08,050 --> 00:08:13,320 aici, în CS50 miercurea viitoare la locul și ora aici de obicei. 179 00:08:13,320 --> 00:08:14,750 Spațiu va fi probabil limitat. 180 00:08:14,750 --> 00:08:19,650 Și astfel să ni se alăture în persoană, vă rog cap de astăzi sau la scurt timp după aceea 181 00:08:19,650 --> 00:08:22,600 la cs50.harvard.edu/register. 182 00:08:22,600 --> 00:08:25,780 >> Și vom urmări cu Marți confirmând pete. 183 00:08:25,780 --> 00:08:29,900 Bucurați-vă de faptul că următorul Miercuri în timpul prelegere în CS50. 184 00:08:29,900 --> 00:08:33,706 Acum, în altă ordine de idei, sa întâmplat să întâlni acest lucru în Crimson doar 185 00:08:33,706 --> 00:08:34,289 ieri. 186 00:08:34,289 --> 00:08:37,370 >> Se pare că unul dintre angajații lui CS50 și cel puțin una dintre studentele CS50 lui 187 00:08:37,370 --> 00:08:40,299 este în curs de desfășurare pentru UC presedinte si vice-presedinte, 188 00:08:40,299 --> 00:08:42,950 care ma adus înapoi pentru propriile mele zile în urmă 189 00:08:42,950 --> 00:08:45,920 atunci când am pierdut alegerile UC mizerabil. 190 00:08:45,920 --> 00:08:48,210 Dar linia de argint în care este Intotdeauna mi-am 191 00:08:48,210 --> 00:08:50,604 spun povestea este că unul din Sunt sigur 192 00:08:50,604 --> 00:08:52,770 mai multe motive am pierdut electorală a fost o lipsă totală 193 00:08:52,770 --> 00:08:54,103 de un talent de a vorbi in public. 194 00:08:54,103 --> 00:08:56,950 Și așa destul de sincer aceasta, ma condus, că experiența 195 00:08:56,950 --> 00:09:02,235 Cred că anul meu de juniori, să semneze de fapt pentru Harvard Computer Society, care 196 00:09:02,235 --> 00:09:04,610 este grupul din campus care deține diverse discuții tehnice 197 00:09:04,610 --> 00:09:05,318 și alte lucruri. 198 00:09:05,318 --> 00:09:08,117 Și am preluat de predare a acestora seminarii și, prin urmare, 199 00:09:08,117 --> 00:09:09,950 a avut o oportunitate, o oportunitate minunata, 200 00:09:09,950 --> 00:09:12,620 pentru a începe să lucreze la exact acest lucru. 201 00:09:12,620 --> 00:09:15,000 Dar, de asemenea, am avut o oportunitate în timpul acestei experiențe 202 00:09:15,000 --> 00:09:16,930 să mă învețe tot mai mult HTML. 203 00:09:16,930 --> 00:09:21,080 Și așa am amânat aseară de Cautati prin site-ul pe bază de HTML 204 00:09:21,080 --> 00:09:28,066 Am făcut în 1997 ca, '98, pentru mea campanie care arata ca acest lucru aici. 205 00:09:28,066 --> 00:09:29,920 Știu. 206 00:09:29,920 --> 00:09:33,340 >> Because-- și, bineînțeles, aviz această decizie de design uimitor în 1998 207 00:09:33,340 --> 00:09:33,850 sau fleacuri. 208 00:09:33,850 --> 00:09:36,475 Primul lucru pe care doriți utilizatori a face pe vizitarea site-ul tau 209 00:09:36,475 --> 00:09:39,860 este de a avea de a faceți clic pe un alt link doar pentru a introduce site-ul dvs. aici cu călugărul 210 00:09:39,860 --> 00:09:43,940 în spatele ca o perdea învăluită în cazul în care se pare că platforma mea de campanie a fost. 211 00:09:43,940 --> 00:09:46,330 Și aceasta este tot ce veți obține azi e doar un screenshot. 212 00:09:46,330 --> 00:09:49,500 Dar am citit prin, cum ar fi, postere campaniei mele noaptea trecută 213 00:09:49,500 --> 00:09:50,490 și platforma mea. 214 00:09:50,490 --> 00:09:52,960 >> Și am fost atât de supărat la momentul respectiv. 215 00:09:52,960 --> 00:09:55,380 Platforma mea asta-- a fost interesant. 216 00:09:55,380 --> 00:09:57,730 Așa că m-am calmat de atunci. 217 00:09:57,730 --> 00:10:03,550 Dar într-o zi, eu va rula din nou și sperăm că mai bine de data asta. 218 00:10:03,550 --> 00:10:07,265 >> Astfel HTML, această limbă în care am făcut că in-- veți face în curând mult more-- 219 00:10:07,265 --> 00:10:09,140 este ceva ce am fost vorbim despre de întârziere 220 00:10:09,140 --> 00:10:12,460 și în mare măsură luand de la sine acum că ne-am mutat la alte limbi. 221 00:10:12,460 --> 00:10:15,650 Dar să ne oprim o clipă și pune unele dintre aceste lucruri în context. 222 00:10:15,650 --> 00:10:18,040 Deci, într-o propoziție, ceea ce este HTML? 223 00:10:18,040 --> 00:10:19,370 >> Sau, ceea ce este utilizat pentru? 224 00:10:19,370 --> 00:10:20,208 Oricine? 225 00:10:20,208 --> 00:10:20,708 Da. 226 00:10:20,708 --> 00:10:22,002 >> Audiența: marcare pentru site-uri web. 227 00:10:22,002 --> 00:10:23,460 DAVID J. MALAN: Marcaj pentru site-ul. 228 00:10:23,460 --> 00:10:27,100 Deci, este un limbaj de markup care vă permite să structureze o pagină web. 229 00:10:27,100 --> 00:10:30,040 În afara merge până aici, titlu merge aici, corpul se duce aici. 230 00:10:30,040 --> 00:10:33,280 Acest lucru este ingrosate, aceasta este italics-- acest tip de detaliu. 231 00:10:33,280 --> 00:10:33,830 >> OK, bine. 232 00:10:33,830 --> 00:10:37,620 Deci, CSS Tu-- și eu execută a luat unele libertăți acolo 233 00:10:37,620 --> 00:10:40,990 cu bold-italice, deoarece suprafața si care este mai bine pusă în aplicare cu aceasta. 234 00:10:40,990 --> 00:10:42,096 CSS ce este--? 235 00:10:42,096 --> 00:10:42,845 Spune într-o propoziție. 236 00:10:42,845 --> 00:10:46,000 237 00:10:46,000 --> 00:10:46,720 Oricine la toate. 238 00:10:46,720 --> 00:10:46,870 Da. 239 00:10:46,870 --> 00:10:49,286 >> Audiența: Ornamente și chestii, cum ar fi modul de a proiecta. 240 00:10:49,286 --> 00:10:51,769 241 00:10:51,769 --> 00:10:52,810 DAVID J. MALAN: OK, bine. 242 00:10:52,810 --> 00:10:55,420 Ornamente pe care le permit de a proiecta sau stiliza aceasta 243 00:10:55,420 --> 00:10:59,540 cu lucruri cum ar fi aldine și cursive și culori și, de asemenea, mai bine 244 00:10:59,540 --> 00:11:01,330 poziționare cu zimți de elemente. 245 00:11:01,330 --> 00:11:04,520 Într-un fel vă permite să luați lucrurile de ultimul kilometru, astfel că, dacă, de exemplu, 246 00:11:04,520 --> 00:11:08,130 în Pset7, este posibil să fi observat pe dumneavoastră pagina de portofoliu dacă ești în acest moment 247 00:11:08,130 --> 00:11:12,270 deja că o tabelă implicit pe care le face pentru a arăta deținerea de acțiuni ale utilizatorului 248 00:11:12,270 --> 00:11:15,740 și bani, probabil, pare destul de hidos în mod implicit, cu nici un spațiu alb. 249 00:11:15,740 --> 00:11:18,420 Totul e un fel de ticsit împreună în rânduri și coloane. 250 00:11:18,420 --> 00:11:20,662 >> Ei bine, cu un pic de CSS, așa cum s-ar putea realiza, 251 00:11:20,662 --> 00:11:23,870 poti sa misti de fapt, că și să-l ceva mult mai familiar și mai mult 252 00:11:23,870 --> 00:11:24,870 mai frumos să se uite la. 253 00:11:24,870 --> 00:11:27,730 Deci, este vorba despre CSS stilizare de site-uri web. 254 00:11:27,730 --> 00:11:31,970 Dar apoi am introdus încă un alt limbă, PHP, ceea ce ne permite să facem ce? 255 00:11:31,970 --> 00:11:36,400 256 00:11:36,400 --> 00:11:37,590 >> Să faci ce? 257 00:11:37,590 --> 00:11:38,177 Oricine. 258 00:11:38,177 --> 00:11:40,010 Trebuie să se aventureze dincolo de primul cuplu rânduri. 259 00:11:40,010 --> 00:11:40,260 Da. 260 00:11:40,260 --> 00:11:41,719 >> Audiența: generarea de conținut dinamic. 261 00:11:41,719 --> 00:11:42,718 DAVID J. MALAN: Perfect. 262 00:11:42,718 --> 00:11:43,850 Generarea de conținut dinamic. 263 00:11:43,850 --> 00:11:45,808 Și puteți face acest lucru în orice număr de limbi. 264 00:11:45,808 --> 00:11:50,120 Se întâmplă să utilizați PHP pentru că este în parte atât de asemănătoare cu sintaxa C. 265 00:11:50,120 --> 00:11:52,000 >> Dar PHP face exact acest lucru. 266 00:11:52,000 --> 00:11:54,620 Acesta vă permite să genera dinamic ieșire. 267 00:11:54,620 --> 00:11:57,890 Și o parte din producție ar putea fi HTML, așa cum ne-am făcut de obicei. 268 00:11:57,890 --> 00:12:00,160 Și este, de asemenea, pentru că este un limbaj de programare, este 269 00:12:00,160 --> 00:12:03,240 mecanismul prin care putem vorbi de baze de date. 270 00:12:03,240 --> 00:12:05,730 >> Și putem face interogări la alte servere, cum ar fi Yahoos 271 00:12:05,730 --> 00:12:08,660 și programatic face nimic într-adevăr că s-ar putea altfel 272 00:12:08,660 --> 00:12:10,400 doresc să oblige un computer pentru a face. 273 00:12:10,400 --> 00:12:13,580 Deci, PHP ne permite să înceapă scoate dinamic conținutul. 274 00:12:13,580 --> 00:12:16,900 Deci, prin această logică, nu am avut un site web dinamic din nou în 1998. 275 00:12:16,900 --> 00:12:18,460 >> A fost doar o pagină web static. 276 00:12:18,460 --> 00:12:22,250 Conținut mea a trebuit să fie schimbat de către manual cu gedit sau ceva echivalent. 277 00:12:22,250 --> 00:12:25,290 Dar PHP este ceea ce am folosit sau ar fi putut folosi, mai degrabă, 278 00:12:25,290 --> 00:12:27,260 pentru ceva de genul Site-ul Frosh AI, care 279 00:12:27,260 --> 00:12:31,160 trebuia sa aiba înregistrări și gestiona o listă de lucruri pe care users-- 280 00:12:31,160 --> 00:12:33,550 sunt de fapt schimbă peste timp, chiar dacă se întâmplă 281 00:12:33,550 --> 00:12:35,990 pentru a utiliza Perl, un alt limbă la momentul respectiv. 282 00:12:35,990 --> 00:12:40,350 >> Și apoi în cele din urmă, am introdus SQL-- Structured Query Language. 283 00:12:40,350 --> 00:12:43,845 Deci, încă o altă limbă care este utilizat pentru ce? 284 00:12:43,845 --> 00:12:46,660 285 00:12:46,660 --> 00:12:47,639 Folosit pentru ce? 286 00:12:47,639 --> 00:12:49,430 Putem să se aventureze pe slight-- OK, nu mergem 287 00:12:49,430 --> 00:12:51,263 pentru a ajunge mult mai departe decât orchestra de aici. 288 00:12:51,263 --> 00:12:53,432 Audiența: Este un protocol folosit pentru a vorbi la bazele de date. 289 00:12:53,432 --> 00:12:55,640 DAVID J. MALAN: Un protocol folosit pentru a vorbi la bazele de date. 290 00:12:55,640 --> 00:12:56,181 Lasă-mă să tweak. 291 00:12:56,181 --> 00:12:59,280 Este un limbaj natural folosit pentru a vorbi cu databases-- selectează 292 00:12:59,280 --> 00:13:01,280 și inserții și șterge și actualizări și efectiv 293 00:13:01,280 --> 00:13:03,840 chiar mai multe caracteristici care noi nici măcar nu au scufundat 294 00:13:03,840 --> 00:13:07,920 în dar poate doriți să explore-- avea pentru a explora pentru, să zicem, un proiect final. 295 00:13:07,920 --> 00:13:09,560 Deci, există aceste diverse piese. 296 00:13:09,560 --> 00:13:13,100 >> Și sperăm Pset7, chiar dacă caietul de sarcini este destul de lung, 297 00:13:13,100 --> 00:13:15,990 este în mod deliberat mult timp pentru a vă plimba prin modul în care aceste lucruri pot toate 298 00:13:15,990 --> 00:13:17,210 fi introdus împreună. 299 00:13:17,210 --> 00:13:20,300 Acum, luni, noi a introdus ultima noastră limbă 300 00:13:20,300 --> 00:13:23,430 că vom face introducerea în mod oficial în course-- care este, JavaScript. 301 00:13:23,430 --> 00:13:25,720 Acest lucru, cum ar fi PHP, este un limbaj interpretat. 302 00:13:25,720 --> 00:13:28,110 >> Dar o distincție cheie Am propus luni 303 00:13:28,110 --> 00:13:32,730 este faptul că în timp ce PHP este de executare sau fiind interpretate pe server, care 304 00:13:32,730 --> 00:13:35,990 în acest caz este aparatul CS50, sau ar putea fi unele web comerciale 305 00:13:35,990 --> 00:13:39,370 server de pe internet, JavaScript general 306 00:13:39,370 --> 00:13:43,650 este un limbaj care se execută partea de client Nu server de side-- atât în ​​browser-ul. 307 00:13:43,650 --> 00:13:46,970 Care este de a spune, la fel ca atunci când am deschis până Facebook cod sursă și a găsit toate 308 00:13:46,970 --> 00:13:51,510 din aceste fișiere Js, implicația a fost că atunci când vizitați Facebook sau mai 309 00:13:51,510 --> 00:13:54,810 site-uri web în aceste zile, veți obține nu numai HTML, nu numai CSS, 310 00:13:54,810 --> 00:13:59,370 dar o grămadă de activarea JavaScript- cod de multe ori în formă de fișiere Js. 311 00:13:59,370 --> 00:14:03,970 Și apoi e browser-- opinia ta Mac sau PC-- care execută acel cod. 312 00:14:03,970 --> 00:14:05,990 >> Dar browser-ul dvs. se execută. 313 00:14:05,990 --> 00:14:08,070 Vă puteți gândi într-un fel de nisip. 314 00:14:08,070 --> 00:14:12,420 Astfel încât codul JavaScript nu ar trebui să fie posibilitatea de a șterge fișierele de pe calculatorul dumneavoastră. 315 00:14:12,420 --> 00:14:14,730 Nu ar trebui să fie în măsură să trimite e-mailuri în numele dumneavoastră. 316 00:14:14,730 --> 00:14:17,760 Tipul tau de browser de restricționează ce poti face cu ea. 317 00:14:17,760 --> 00:14:20,630 >> Deci, în acest sens, e un pic mai puțin puternic, poate, decât C. 318 00:14:20,630 --> 00:14:24,030 Dar poate JavaScript, ca o deoparte, să fie utilizate pe server, 319 00:14:24,030 --> 00:14:27,740 deși vom tind să nu pentru a vorbi despre ea în acest context. 320 00:14:27,740 --> 00:14:29,740 Deci, acum hai lega acestea împreună. 321 00:14:29,740 --> 00:14:34,000 O săptămână în plus în urmă, am prezentat unele HTML pe left-- pagina web foarte plictisitor. 322 00:14:34,000 --> 00:14:35,000 >> Doar spune salut lume. 323 00:14:35,000 --> 00:14:38,110 Și apoi am propus, pe de chiar putem fel de fura idei 324 00:14:38,110 --> 00:14:41,470 din discuția noastră de structuri de date în C 325 00:14:41,470 --> 00:14:45,270 și cred despre modul în care acest ierarhică limbaj de marcare pe stânga 326 00:14:45,270 --> 00:14:49,720 ar putea fi trase sau puse în aplicare în memorie ca o structură de arbore real cu noduri 327 00:14:49,720 --> 00:14:51,400 și indicii și acele tipuri de detalii. 328 00:14:51,400 --> 00:14:53,820 In partea dreapta, numim că un document DOM-- 329 00:14:53,820 --> 00:14:56,800 Object Model-- care este doar un mod fantezist de a spune copac. 330 00:14:56,800 --> 00:14:59,520 >> Acum, de ce este acest lucru util pentru cred că de ea în acest fel? 331 00:14:59,520 --> 00:15:01,680 Deoarece acum cu JavaScript, pentru că avem 332 00:15:01,680 --> 00:15:05,810 cod care ajunge să joace în acest mediu, HTML real pe care-i 333 00:15:05,810 --> 00:15:08,360 a fost trimis la browser deja și are deja 334 00:15:08,360 --> 00:15:12,690 a fost încărcat în memorie de către Browser-ul într-un copac în a computerului 335 00:15:12,690 --> 00:15:18,270 RAM ca aceasta, putem folosi JavaScript pentru a traversa de fapt sau de mers pe jos sau de căutare 336 00:15:18,270 --> 00:15:21,800 sau a schimba acel copac DOM oricum ne-o dorim. 337 00:15:21,800 --> 00:15:24,040 Deci, în fapt, dacă credeți că despre facebook.com, 338 00:15:24,040 --> 00:15:27,660 dacă folosiți funcția de chat, dacă utilizarea Gmail și funcția Gchat, 339 00:15:27,660 --> 00:15:30,540 nimic în cazul în care aveți mesaje care vin din nou și din nou 340 00:15:30,540 --> 00:15:35,880 și din nou, aceste mesaje sunt, probabil, cum ar fi, tag LI, tag-uri lista de articole, poate. 341 00:15:35,880 --> 00:15:37,940 >> Sau poate sunt doar divs care să păstreze apare 342 00:15:37,940 --> 00:15:39,770 de fiecare dată când primiți un mesaj instant. 343 00:15:39,770 --> 00:15:42,960 Și astfel, asta înseamnă doar ceea ce Facebook sau Google este de a face 344 00:15:42,960 --> 00:15:45,200 este în orice moment veți obține o Mesajul de pe server, 345 00:15:45,200 --> 00:15:48,740 ele sunt, probabil, folosind JavaScript pentru a adăuga doar un alt nod 346 00:15:48,740 --> 00:15:52,700 la acest tree-- un alt nod la acest copac care apoi vizual doar arata 347 00:15:52,700 --> 00:15:54,570 ca o nouă linie de text pe ecran. 348 00:15:54,570 --> 00:15:57,100 Dar ei inserarea în această structură de date. 349 00:15:57,100 --> 00:15:59,742 >> Deci, în clase ca CS124 și altele, veți 350 00:15:59,742 --> 00:16:02,200 de fapt, scrie mai mult cod împotriva structuri de date, cum ar fi acest lucru. 351 00:16:02,200 --> 00:16:04,310 Dar de acum în JavaScript, vom presupune doar 352 00:16:04,310 --> 00:16:07,920 avem toate această funcționalitate gratuit de limba în sine. 353 00:16:07,920 --> 00:16:09,210 Așa că haideți să ne uităm la un exemplu. 354 00:16:09,210 --> 00:16:13,120 >> Lasă-mă să deschid un fișier numit form.html. 355 00:16:13,120 --> 00:16:14,601 E foarte simplu. 356 00:16:14,601 --> 00:16:15,600 Este doar pare ca aceasta. 357 00:16:15,600 --> 00:16:17,860 >> Nu CSS, nici un gând de estetica. 358 00:16:17,860 --> 00:16:19,810 E pur funcțională și se pare că eu sunt 359 00:16:19,810 --> 00:16:24,000 solicitând un e-mail, o parolă, parolă din nou, iar apoi o verificare 360 00:16:24,000 --> 00:16:26,150 să fie de acord unor termeni și condiții. 361 00:16:26,150 --> 00:16:28,740 Ce codul sursă pentru acest Se pare ca este, probabil, ceva 362 00:16:28,740 --> 00:16:31,030 s-ar putea ghici cu o pic de gândire acum. 363 00:16:31,030 --> 00:16:32,840 Am o etichetă formular aici. 364 00:16:32,840 --> 00:16:36,190 >> O acțiune este aparent de gând să du-te la un fișier numit register.php. 365 00:16:36,190 --> 00:16:37,870 Metoda am de gând să îl utilizați este minim. 366 00:16:37,870 --> 00:16:40,880 Și apoi am primit un mesaj câmp al cărui nume este de e-mail. 367 00:16:40,880 --> 00:16:43,340 >> Am un câmp parolă al cărui nume este parola. 368 00:16:43,340 --> 00:16:45,420 Am primit un alt câmp parolă cărui nume 369 00:16:45,420 --> 00:16:47,342 este o confirmare oarecum arbitrar. 370 00:16:47,342 --> 00:16:49,690 E doar un alt parametru HTTP. 371 00:16:49,690 --> 00:16:54,430 >> Și apoi ne-am nu am folosit aceste, cu excepția deoarece AI Frosh demo în class-- 372 00:16:54,430 --> 00:16:56,692 o casetă de validare, care este doar tip este egal cu cec. 373 00:16:56,692 --> 00:16:57,900 Și eu sun acest acord. 374 00:16:57,900 --> 00:17:00,700 Așa că am un fel de arbitrar, ci numit în mod convenabil aceste domenii. 375 00:17:00,700 --> 00:17:03,450 Așa că acum, atunci când acest formular devine depusă, să vedem ce se întâmplă. 376 00:17:03,450 --> 00:17:07,290 Dacă fac malan@harvard.edu, Voi face o parolă de purpuriu. 377 00:17:07,290 --> 00:17:09,530 Voi face o parolă de nimic. 378 00:17:09,530 --> 00:17:10,910 Să nu cooperează. 379 00:17:10,910 --> 00:17:12,280 >> Și nu voi verifica pe centru. 380 00:17:12,280 --> 00:17:13,940 Lasă-mă să faceți clic pe Înregistrare. 381 00:17:13,940 --> 00:17:15,420 Și se spune, hm, tu ești înregistrat. 382 00:17:15,420 --> 00:17:16,069 Nu chiar. 383 00:17:16,069 --> 00:17:17,450 >> Dar URL-ul sa schimbat. 384 00:17:17,450 --> 00:17:22,280 Deci, această formă a fost lăsat în mod clar să se supună register.php. 385 00:17:22,280 --> 00:17:25,160 Dar probabil, eu ar trebui să fie prinderea unele dintre aceste erori. 386 00:17:25,160 --> 00:17:27,569 Acum, în Pset7 și unele din exemplele noastre de curs, 387 00:17:27,569 --> 00:17:30,130 noi, în general, s-ar imprima un mare mesaj de eroare roșu aici 388 00:17:30,130 --> 00:17:33,760 a zis, lipsă numele, sau lipsește parolă. 389 00:17:33,760 --> 00:17:37,680 Am făcut asta înainte și ne-am terminat partea de server de detectare a erorilor. 390 00:17:37,680 --> 00:17:41,580 >> Dar multe site-uri în aceste zile face client de detectare a erorilor din partea 391 00:17:41,580 --> 00:17:42,810 în cazul în care URL-ul nu se schimbă. 392 00:17:42,810 --> 00:17:44,101 Toată pagina nu reîmprospătare. 393 00:17:44,101 --> 00:17:46,940 Veți obține feedback-ul instant de la browser-ul. 394 00:17:46,940 --> 00:17:48,070 Poate că ceva nu este în roșu. 395 00:17:48,070 --> 00:17:49,190 >> Poate că veți obține un pop-up. 396 00:17:49,190 --> 00:17:53,240 Dar tu nu pierde timpul trimiterii la server de date care este incomplet. 397 00:17:53,240 --> 00:17:56,050 Așa că haideți să vedem cum putem să atinge acea caracteristică la fel de bine. 398 00:17:56,050 --> 00:17:59,660 >> Lasă-mă să merg la form1.html, care arată la fel. 399 00:17:59,660 --> 00:18:03,530 Dar dacă de data asta fac malan@harvard.edu și scriu roșu 400 00:18:03,530 --> 00:18:07,350 și eu nu cooperează în continuare dar faceți clic pe Register, observa acum. 401 00:18:07,350 --> 00:18:08,940 Nu e cea mai sexy soluția. 402 00:18:08,940 --> 00:18:10,900 Cel puțin am prins această eroare. 403 00:18:10,900 --> 00:18:12,900 Și l-am folosit alerta Funcția în JavaScript-- 404 00:18:12,900 --> 00:18:14,090 care suntem folosind doar în clasă. 405 00:18:14,090 --> 00:18:16,430 În general, nu trebuie să utilizați acest deoarece se poate ajunge foarte repede 406 00:18:16,430 --> 00:18:17,160 de control. 407 00:18:17,160 --> 00:18:19,180 Dar parolele nu se potrivesc este eroarea. 408 00:18:19,180 --> 00:18:21,120 >> Lasă-mă să merg mai departe și faceți clic pe OK. 409 00:18:21,120 --> 00:18:25,040 Dar ceea ce Takeaway cheie aici este faptul că URL-ul nu sa schimbat. 410 00:18:25,040 --> 00:18:27,960 Pierdem așa că nu am deranjat timpul serverului cere o 411 00:18:27,960 --> 00:18:30,750 o intrebare pe care am putea avea a dat seama răspunsul la mine. 412 00:18:30,750 --> 00:18:33,210 >> Iar utilizatorul, chiar dacă vorbit despre acest 413 00:18:33,210 --> 00:18:35,264 mai mult decât Consumatorului de gând să se gândească la acest lucru, 414 00:18:35,264 --> 00:18:36,680 va avea feedback-ul instant. 415 00:18:36,680 --> 00:18:39,044 Nu e nici o latenta cu conectivitatea de rețea. 416 00:18:39,044 --> 00:18:40,460 Deci, să ne uităm la acest cod sursă. 417 00:18:40,460 --> 00:18:45,600 >> Arată Form1.html similară structural aici. 418 00:18:45,600 --> 00:18:46,810 Forma este, de fapt, același lucru. 419 00:18:46,810 --> 00:18:48,330 Dar să vedem ce am făcut aici. 420 00:18:48,330 --> 00:18:49,913 Și există diferite moduri de a face acest lucru. 421 00:18:49,913 --> 00:18:53,690 Și am făcut cea mai dreaptă urmăritor, dar nu modul cel mai elegant încă. 422 00:18:53,690 --> 00:18:54,869 Am o etichetă scenariu. 423 00:18:54,869 --> 00:18:57,035 Apoi m-am apel document.getElementById ("înregistrare"). 424 00:18:57,035 --> 00:19:00,090 425 00:19:00,090 --> 00:19:04,420 Și am păstra ca valoare în formă, o variabilă. 426 00:19:04,420 --> 00:19:05,520 >> Deci, ce am făcut? 427 00:19:05,520 --> 00:19:08,960 Vă puteți gândi document.getElementById ca fiind 428 00:19:08,960 --> 00:19:11,200 o funcție specială care JavaScript vă oferă 429 00:19:11,200 --> 00:19:14,400 că mâinile literalmente tine un pointer la unul din nodurile 430 00:19:14,400 --> 00:19:16,520 sau dreptunghiuri în acest copac. 431 00:19:16,520 --> 00:19:21,470 Deci, acum că e sub ce formă variabilă nostru în JavaScript este, de fapt îndreptat la. 432 00:19:21,470 --> 00:19:25,120 >> Deci, acum sintaxa este diferită de C. Dar noi facem câteva lucruri aici. 433 00:19:25,120 --> 00:19:30,360 Unul, acesta este un pic ciudat Cautati, cu siguranță față de C. 434 00:19:30,360 --> 00:19:32,180 Dar uita-te la linia 35. 435 00:19:32,180 --> 00:19:35,130 Deci, pe form.onsubmit stânga. 436 00:19:35,130 --> 00:19:38,060 Amintiti-va ca onsubmit este ca un câmp într-un struct. 437 00:19:38,060 --> 00:19:41,480 Dacă credeți că a variabilei formă este doar a fi un struct C, 438 00:19:41,480 --> 00:19:42,600 aceasta ar putea avea unele domenii. 439 00:19:42,600 --> 00:19:46,410 >> Înapoi în a doua zi, am avut nume de studenți, ID-uri, case, cele fel de domenii. 440 00:19:46,410 --> 00:19:48,520 Gândește-te de onsubmit ca un alt domeniu. 441 00:19:48,520 --> 00:19:53,380 Dar este un domeniu special, deoarece Browser-ul este preprogramat sa se astepte 442 00:19:53,380 --> 00:19:57,530 .onsubmit să nu fie o valoare cum ar fi un număr sau șir de caractere, 443 00:19:57,530 --> 00:20:01,180 dar pentru a fi de fapt o funcție sau adresa unei funcții 444 00:20:01,180 --> 00:20:02,570 în memoria calculatorului. 445 00:20:02,570 --> 00:20:04,740 >> Și într-adevăr, asta e ceea ce acest cuvânt cheie aici nu. 446 00:20:04,740 --> 00:20:06,710 Acest lucru spune, da-mi o nouă funcție. 447 00:20:06,710 --> 00:20:09,390 Dar ceea ce este numele său Va fi, aparent? 448 00:20:09,390 --> 00:20:10,800 >> Gândire înapoi până luni. 449 00:20:10,800 --> 00:20:13,430 450 00:20:13,430 --> 00:20:17,170 Care este numele acestei Funcția bazat pe această sintaxă? 451 00:20:17,170 --> 00:20:19,784 Nu, vreau să spun, nu e clar nici un nume associated-- siguranță 452 00:20:19,784 --> 00:20:21,200 nu în ceea ce am evidențiat aici. 453 00:20:21,200 --> 00:20:22,560 >> Dar asta e de fapt OK. 454 00:20:22,560 --> 00:20:25,840 Aceasta este o funcție anonimă, sau o Funcția lambda ca unii s-ar putea numi. 455 00:20:25,840 --> 00:20:27,589 Și asta înseamnă doar este încă o funcție. 456 00:20:27,589 --> 00:20:29,400 E doar, nu se poate spune pe nume. 457 00:20:29,400 --> 00:20:30,057 Dar asta e în regulă. 458 00:20:30,057 --> 00:20:33,140 Pentru că din nou, browser-ul a fost preprogramat de companii precum Google 459 00:20:33,140 --> 00:20:38,540 sau Microsoft sau Mozilla sau alte persoane la știu doar că în cazul în câmpul .onsubmit 460 00:20:38,540 --> 00:20:43,400 în interiorul unui element de formular are valoare, se tratează ca o function-- 461 00:20:43,400 --> 00:20:44,750 un pointer funcție, dacă vreți. 462 00:20:44,750 --> 00:20:46,910 Și se numesc, atunci când este prezentat formularul. 463 00:20:46,910 --> 00:20:50,350 >> Deci, ce cod ar trebui să fie executat atunci când se depune formularul? 464 00:20:50,350 --> 00:20:52,526 Aparent, totul în interiorul a gulerului buclat. 465 00:20:52,526 --> 00:20:53,650 Și acesta este doar stilistică. 466 00:20:53,650 --> 00:20:55,626 >> Ai putea face acest lucru ca avem tendința de a face din CS50. 467 00:20:55,626 --> 00:20:58,250 Dar în JavaScript, cei mai mulți oameni tind să-l păstrați pe aceeași linie 468 00:20:58,250 --> 00:21:01,960 doar pentru că este mult mai clar asociată cu această funcție de cuvinte cheie. 469 00:21:01,960 --> 00:21:03,240 Deci, acum ce fac? 470 00:21:03,240 --> 00:21:08,616 >> În cazul în care form.email.value egal la egal la egal șir gol sau nimic, aici e 471 00:21:08,616 --> 00:21:11,490 o alertă în cazul în care am de gând să spun, trebuie să furnizați adresa ta de email, 472 00:21:11,490 --> 00:21:12,690 și apoi să se întoarcă false. 473 00:21:12,690 --> 00:21:15,720 Și e că fals întoarcere că previne forma de a fi prezentate. 474 00:21:15,720 --> 00:21:19,480 Între timp, în cazul în care valoarea parolei este gol, am de gând să țipe la utilizator 475 00:21:19,480 --> 00:21:21,150 și spun, trebuie să furnizați o parolă. 476 00:21:21,150 --> 00:21:23,700 >> Între timp lucrurile devin un pic crescator aici. 477 00:21:23,700 --> 00:21:29,160 În cazul în care form.password.value nu form.confirmation.value egal, 478 00:21:29,160 --> 00:21:31,680 pe de altă teren, tipa la utilizatorul că parolele 479 00:21:31,680 --> 00:21:33,860 nu se potrivesc în care acestea nu a făcut în urmă o clipă. 480 00:21:33,860 --> 00:21:35,780 Și apoi asta e un puțin mai sexy pentru că am 481 00:21:35,780 --> 00:21:40,470 Știu că știam că conceptual verificat este numele o casetă de selectare lui. 482 00:21:40,470 --> 00:21:45,680 >> Deci, eu pot folosi doar o exclamație Punct de spus dacă verificarea nu este 483 00:21:45,680 --> 00:21:48,040 checked-- e Boolean valoare, adevărate sau false-- 484 00:21:48,040 --> 00:21:49,700 Voi țipa la utilizator pentru acest motiv. 485 00:21:49,700 --> 00:21:52,300 În caz contrar, dacă vom obține prin toate aceste condiții, 486 00:21:52,300 --> 00:21:53,270 hai să se întoarcă adevărat. 487 00:21:53,270 --> 00:21:54,700 Să formularul fi prezentate. 488 00:21:54,700 --> 00:21:56,560 Și acest lucru se va întâmpla atunci. 489 00:21:56,560 --> 00:21:57,740 >> Să scrieți în roșu. 490 00:21:57,740 --> 00:22:00,230 Să verificăm centru, faceți clic pe Register. 491 00:22:00,230 --> 00:22:01,979 Și acum mă duc până la destinație. 492 00:22:01,979 --> 00:22:03,270 Acum, nu exista nici o bază de date acolo. 493 00:22:03,270 --> 00:22:05,370 Nu e nimic interesant în register.php. 494 00:22:05,370 --> 00:22:07,980 Aveam nevoie de ceva pentru a vorbi de fapt la. 495 00:22:07,980 --> 00:22:09,140 Așa că lasă-mă întrerupe, aici. 496 00:22:09,140 --> 00:22:16,270 Orice întrebări cu privire la ceea ce tocmai am făcut sau ce o parte din acest nou sintaxă este? 497 00:22:16,270 --> 00:22:17,640 OK, da? 498 00:22:17,640 --> 00:22:20,025 >> Audiența: Deci, orice casetă este în mod automat un Boolean. 499 00:22:20,025 --> 00:22:21,650 Nu trebuie să-l declare ca asta. 500 00:22:21,650 --> 00:22:22,649 >> DAVID J. MALAN: Corect. 501 00:22:22,649 --> 00:22:29,340 Orice casetă care este trimis la tine de la un formular HTML pentru codul JavaScript 502 00:22:29,340 --> 00:22:31,760 vor fi tratate, da, ca Boolean value-- adevărat sau fals. 503 00:22:31,760 --> 00:22:32,635 E o întrebare bună. 504 00:22:32,635 --> 00:22:36,080 Întrucât celelalte valori, de Desigur, au fost text, siruri de caractere AKA. 505 00:22:36,080 --> 00:22:38,500 >> Bine, asa ca lasa-ma înapoi un pic mai departe. 506 00:22:38,500 --> 00:22:39,900 Care a fost ideea asta? 507 00:22:39,900 --> 00:22:41,400 Doar pentru a fi clar. 508 00:22:41,400 --> 00:22:44,940 Cum ar fi, știm deja, chiar de la Pset7 și chiar de la curs de săptămâna trecută 509 00:22:44,940 --> 00:22:51,120 exemple, pe care le putem verifica în mod evident, $ _GET $ _POST Vedea dacă utilizatorul dă-ne 510 00:22:51,120 --> 00:22:52,200 o valoare gol. 511 00:22:52,200 --> 00:22:54,400 Amintiți-vă funcția de gol în PHP. 512 00:22:54,400 --> 00:22:58,040 >> Deci, doar pentru a fi clar, ceea ce este un motiv am putea, de asemenea, 513 00:22:58,040 --> 00:23:00,535 vreau să fac acest lucru verificarea erorilor în interiorul a browser-ului? 514 00:23:00,535 --> 00:23:03,350 515 00:23:03,350 --> 00:23:06,080 Care este motivația aici? 516 00:23:06,080 --> 00:23:06,580 Da. 517 00:23:06,580 --> 00:23:09,735 >> Audiența: Mai repede, iar tu nu faci trimite datele inutile la server. 518 00:23:09,735 --> 00:23:10,610 DAVID J. MALAN: Bun. 519 00:23:10,610 --> 00:23:11,170 E mai rapid. 520 00:23:11,170 --> 00:23:12,920 Tu nu trimiteți inutil date către server. 521 00:23:12,920 --> 00:23:14,670 >> Astfel încât să obțineți înapoi o mai răspuns imediat. 522 00:23:14,670 --> 00:23:16,560 Și, în ansamblu, utilizatorul experiență este mai bine. 523 00:23:16,560 --> 00:23:17,900 Gândiți-vă la alternativa. 524 00:23:17,900 --> 00:23:21,160 >> În cazul în care pentru Gmail-- și a fost în urmă cu mulți ani. 525 00:23:21,160 --> 00:23:24,160 Să presupunem că ai un nou e-mail Gmail cont, dar singura modalitate prin 526 00:23:24,160 --> 00:23:26,510 pentru a vedea care este de a, cum ar fi, reîncărcați întreaga pagină. 527 00:23:26,510 --> 00:23:29,030 Sau să presupunem că faceți clic pe un link pentru a citi un e-mail. 528 00:23:29,030 --> 00:23:31,600 >> Totul trebuie să reîncărcați astfel pe care le puteți vedea e-mail. 529 00:23:31,600 --> 00:23:33,380 Sau Facebook-- primiți un mesaj de discuții. 530 00:23:33,380 --> 00:23:36,000 Tu nu-l vezi până când nu reîncărcați pagina sau faceți clic pe unele link. 531 00:23:36,000 --> 00:23:38,380 >> Cum ar fi, acest lucru ar fi un teribil experiență de utilizator enervant. 532 00:23:38,380 --> 00:23:41,300 Și aceasta este ceea ce a fost ca, în mod clar, înapoi, atunci când am fugit de UC 533 00:23:41,300 --> 00:23:44,760 iar pe internet a fost mult mai puțin dinamic și JavaScript nu a fost la fel de popularizat 534 00:23:44,760 --> 00:23:45,601 așa cum este acum. 535 00:23:45,601 --> 00:23:47,850 Și lucrurile devin mult mai dinamic și mult mai mult 536 00:23:47,850 --> 00:23:49,900 partea de client în acest sens. 537 00:23:49,900 --> 00:23:54,370 >> Dar există o captură aici, și aceasta este un fel de un Te-am prins enervant. 538 00:23:54,370 --> 00:23:58,720 Doar pentru că ai adăuga partea de client detectare ca acest lucru nu înseamnă 539 00:23:58,720 --> 00:24:01,430 puteți sau ar trebui să abandoneze detectare partea de server. 540 00:24:01,430 --> 00:24:04,080 În esență, doriți să puneți dumneavoastră verificarea erorilor în ambele locuri. 541 00:24:04,080 --> 00:24:05,830 Pentru că ceea ce a fost o a lecției învățate 542 00:24:05,830 --> 00:24:10,270 din articol am citit câteva fragmente din acest stupid CMS system-- 543 00:24:10,270 --> 00:24:14,410 Content Management System-- care a fost punerea în aplicare a sistemului său de autentificare, 544 00:24:14,410 --> 00:24:16,790 autentificare sale prin ce mecanism? 545 00:24:16,790 --> 00:24:19,515 546 00:24:19,515 --> 00:24:20,469 JavaScript. 547 00:24:20,469 --> 00:24:21,499 >> Audiența: JavaScript. 548 00:24:21,499 --> 00:24:23,290 DAVID J. MALAN: JavaScript, exact, nu? 549 00:24:23,290 --> 00:24:24,610 A fost folosind JavaScript. 550 00:24:24,610 --> 00:24:27,120 Și literalmente, voi avea a jucat un pic, probabil, 551 00:24:27,120 --> 00:24:28,700 cu inspectorul Chrome. 552 00:24:28,700 --> 00:24:30,890 Și dacă pot să-l găsesc, să inspecteze elementul. 553 00:24:30,890 --> 00:24:33,670 >> Lasă-mă să merg pe să fac toate opțiunile Chrome. 554 00:24:33,670 --> 00:24:37,080 Și acest lucru este cât de ușor este să dezactiva JavaScript într-un browser. 555 00:24:37,080 --> 00:24:38,950 Verifica, nu mai mult JavaScript. 556 00:24:38,950 --> 00:24:41,070 >> Deci, în echitate, o mulțime a benzii aceste zile 557 00:24:41,070 --> 00:24:43,430 este doar de gând să rupă pentru că Gmail și alte sites-- 558 00:24:43,430 --> 00:24:46,140 Facebook-- presupune că JavaScript este activat. 559 00:24:46,140 --> 00:24:50,180 Dar, dacă faci ceva stupid ca doar validarea de intrare utilizatori 560 00:24:50,180 --> 00:24:52,520 și o verificare pentru erori pe partea de client, 561 00:24:52,520 --> 00:24:54,940 un adversar ar putea face cu ușurință acest lucru. 562 00:24:54,940 --> 00:24:57,180 Și apoi chiar inteligentă adversar ca voi 563 00:24:57,180 --> 00:25:01,120 acum ar putea folosi Telnet sau Curl sau comenzi de linie de comandă doar 564 00:25:01,120 --> 00:25:05,300 și de fapt trimite mesaje catre server care în mod similar, nu sunt verificate de eroare. 565 00:25:05,300 --> 00:25:08,380 >> Deci, aceasta este mai mult o decizie interfața cu utilizatorul 566 00:25:08,380 --> 00:25:13,060 decât este un real tehnic improvement-- de punere în aplicare 567 00:25:13,060 --> 00:25:14,410 partea de client ceva de genul asta. 568 00:25:14,410 --> 00:25:16,800 Deci, acum o privire rapidă, dar apoi Voi amâna la plimbare on-line 569 00:25:16,800 --> 00:25:17,674 prin intermediul pentru asta. 570 00:25:17,674 --> 00:25:21,480 În formă de două, de fapt, am trecut prin și curățat codul un pic. 571 00:25:21,480 --> 00:25:23,650 Dar permiteți-mi să amâne pentru o din videoclipuri noi vom probabil 572 00:25:23,650 --> 00:25:27,970 embed în Pset8 care arată doar o sintaxă similară folosind o bibliotecă numită 573 00:25:27,970 --> 00:25:32,320 jQuery, care este un super, super- bibliotecă populară în JavaScript 574 00:25:32,320 --> 00:25:34,510 ca sincer cei mai mulți oameni utilizați doar în aceste zile 575 00:25:34,510 --> 00:25:37,070 și chiar confunda ca ființă în sine JavaScript. 576 00:25:37,070 --> 00:25:38,950 >> Și tinde să implice unele semne dolar 577 00:25:38,950 --> 00:25:41,350 și cuvintele cheie, cum ar fi documente în paranteze aici. 578 00:25:41,350 --> 00:25:44,480 Dar, din nou, lasă-mă să amâne până la unele tutoriale mai lent on-line 579 00:25:44,480 --> 00:25:46,750 mai degrabă decât a lua legat în doar sintaxă. 580 00:25:46,750 --> 00:25:48,630 Să trecem la ceva un pic mai rece 581 00:25:48,630 --> 00:25:50,520 în ceea ce privește cererile de acest lucru. 582 00:25:50,520 --> 00:25:57,730 >> Deci, în special, lasă-mă să merg înainte și să se deschidă această aici. 583 00:25:57,730 --> 00:25:58,340 Haide. 584 00:25:58,340 --> 00:25:59,380 Acolo mergem. 585 00:25:59,380 --> 00:26:01,500 >> Lasă-mă să deschid această imagine aici. 586 00:26:01,500 --> 00:26:03,450 Complicată în mod inutil Cautati, dar ea 587 00:26:03,450 --> 00:26:07,880 descrie o tehnică numită AJAX-- Asynchronous JavaScript și XML, în cazul în care 588 00:26:07,880 --> 00:26:10,530 X pentru XML este de fapt nu mai într-adevăr folosite. 589 00:26:10,530 --> 00:26:13,430 Ea tinde să folosească ceva altfel numit JSON. 590 00:26:13,430 --> 00:26:16,560 >> Dar aici este modul în care ceva de genul Google Maps sau Google Earth funcționează. 591 00:26:16,560 --> 00:26:18,060 Să încercăm acest lucru pe zbor, de fapt. 592 00:26:18,060 --> 00:26:21,590 Lasă-mă să mergeți mai departe și deschide Chrome pe browser-ul meu. 593 00:26:21,590 --> 00:26:26,236 >> Și lasă-mă să merg în, spune, maps.google.com. 594 00:26:26,236 --> 00:26:29,260 595 00:26:29,260 --> 00:26:31,930 Și, de fapt, dacă ești bătrân suficient să ne amintim ceea ce, 596 00:26:31,930 --> 00:26:35,600 cum ar fi, MapQuest a fost ca pe vremuri, și poate că ei încă mai lucrează ca aceasta. 597 00:26:35,600 --> 00:26:38,870 Când ați folosit pentru a căuta something-- 33 Oxford Street, Cambridge, Mass, 598 00:26:38,870 --> 00:26:40,650 hai sa facem asta: te ar fi de fapt, dacă 599 00:26:40,650 --> 00:26:43,000 a vrut să deplasare în sus și în jos, la stânga și la dreapta, 600 00:26:43,000 --> 00:26:44,920 v-ar arata ca un sageata mare pe partea de sus, și-l 601 00:26:44,920 --> 00:26:46,921 v-ar arăta un alt cadru a hărții aici. 602 00:26:46,921 --> 00:26:49,753 Sau v-ar faceți clic pe stânga și tu ar merge pe aici, sau un alt faceți clic pe 603 00:26:49,753 --> 00:26:51,000 și v-ar trece peste aici. 604 00:26:51,000 --> 00:26:53,000 Dar, în loc acestea zile, desigur doar 605 00:26:53,000 --> 00:26:55,970 ia acordat pentru că putem merge în jurul valorii de Cambridge destul de repede 606 00:26:55,970 --> 00:26:57,550 doar făcând clic și trăgând. 607 00:26:57,550 --> 00:26:59,130 Dar observați că sunt niște probleme. 608 00:26:59,130 --> 00:27:02,160 >> Dacă fac acest lucru suficient de repede, ceea ce pare să se întâmple 609 00:27:02,160 --> 00:27:05,960 ca am trageți un pic prea repede pentru computer pentru a ține pasul? 610 00:27:05,960 --> 00:27:07,160 Ce vezi? 611 00:27:07,160 --> 00:27:07,660 Da. 612 00:27:07,660 --> 00:27:09,232 >> Audiența: Pixelii nu refresh. 613 00:27:09,232 --> 00:27:10,940 DAVID J. MALAN: pixeli nu refresh. 614 00:27:10,940 --> 00:27:12,870 Nu e actually-- și tu ar putea vedea acest lucru, de fapt, 615 00:27:12,870 --> 00:27:15,360 dacă te uiți on-line și pauză aceasta sau de fapt încetinește lucrurile jos 616 00:27:15,360 --> 00:27:18,600 pentru once-- veți vedea că există dale, grinzi, sau dreptunghiuri care 617 00:27:18,600 --> 00:27:22,040 lipsesc de pe hartă până la o fracțiune de secundă mai târziu, mai multe date, 618 00:27:22,040 --> 00:27:24,390 mai multe fotografii de fapt apar pe ecran. 619 00:27:24,390 --> 00:27:29,810 Și, de fapt, dacă facem acest lucru uitandu-te până Chrome's-- să zicem, Chrome-- 620 00:27:29,810 --> 00:27:30,310 Să vedem. 621 00:27:30,310 --> 00:27:31,090 Noi nu putem face asta. 622 00:27:31,090 --> 00:27:31,860 >> Oh, Hopa. 623 00:27:31,860 --> 00:27:34,761 Să deschidem maps.google.com. 624 00:27:34,761 --> 00:27:36,660 Permiteți-mi să fac fereastra mare din nou. 625 00:27:36,660 --> 00:27:38,836 >> Du-te înapoi la 33 Oxford Street. 626 00:27:38,836 --> 00:27:42,010 627 00:27:42,010 --> 00:27:43,760 Care a fost site-ul am fost la recent? 628 00:27:43,760 --> 00:27:46,440 Am avut această, cum ar fi, declama privat pentru mă că aș mesaj atunci instant 629 00:27:46,440 --> 00:27:48,470 nici un prieten care a fost on-line care a vrut să-l audă. 630 00:27:48,470 --> 00:27:49,345 E unele site-ul. 631 00:27:49,345 --> 00:27:52,680 Cred că e atât de Comcast-- o foarte mare ISP american. 632 00:27:52,680 --> 00:27:56,355 Puteți, atunci când vă înscrieți pentru nou cablu serviciu modem sau de servicii TV prin cablu, 633 00:27:56,355 --> 00:27:59,230 ei au o forma foarte rezonabil în cazul în care vă întreb pentru adresa. 634 00:27:59,230 --> 00:28:01,450 Și au acest uimitor facilitate numita completă auto, 635 00:28:01,450 --> 00:28:04,600 cum ar fi Google, care începe să se umple în răspunsul la întrebarea ta. 636 00:28:04,600 --> 00:28:08,090 >> Problema este, o fac complet auto pe primele lucruri pe care le tastați. 637 00:28:08,090 --> 00:28:12,890 Deci, dacă începeți să tastați în 33 ea, vă va arăta literalmente fiecare casă 638 00:28:12,890 --> 00:28:15,790 în America, care începe cu numărul 33 639 00:28:15,790 --> 00:28:17,920 înainte de a continua să se așteaptă să tastați mai mult. 640 00:28:17,920 --> 00:28:20,660 Deci, dacă tastați 33 Oxford, apoi vă arată fiecare stradă 641 00:28:20,660 --> 00:28:24,726 în America, care are 33 de Oxford în numele său, indiferent de oraș 642 00:28:24,726 --> 00:28:25,350 care vă aflați. 643 00:28:25,350 --> 00:28:26,320 >> Și apoi continuați să tastați. 644 00:28:26,320 --> 00:28:28,930 Și, în cele din urmă, ea își dă seama că ei nu fac serviciu de oferta pentru casa ta, în Cambridge 645 00:28:28,930 --> 00:28:29,920 sau ceva de genul asta. 646 00:28:29,920 --> 00:28:33,410 Dar ideea este, aceasta este cea mai punerea în aplicare a asinine auto 647 00:28:33,410 --> 00:28:34,140 a finaliza vreodată. 648 00:28:34,140 --> 00:28:36,400 >> Și Mă duc off pe această tangentă din nou. 649 00:28:36,400 --> 00:28:39,040 Dar există modalități bune la folosesc JavaScript și căile rele. 650 00:28:39,040 --> 00:28:40,750 Și asta nu e neaparat cel mai bun. 651 00:28:40,750 --> 00:28:46,360 >> Dar punctul de aici, înainte de aceasta tirada, a fost de a deschide posibilități aici 652 00:28:46,360 --> 00:28:49,480 și să deschidă instrumente de dezvoltare, așa cum ne-am încurajat înainte, 653 00:28:49,480 --> 00:28:52,840 și pentru a viziona rețelei Fila cum am faceți clic pe foarte repede. 654 00:28:52,840 --> 00:28:55,400 Și observați o grămadă a primi cereri sa întâmplat. 655 00:28:55,400 --> 00:28:57,310 Toate acest lucru sa întâmplat de când am târât. 656 00:28:57,310 --> 00:29:00,170 >> Și, cel mai probabil, într-adevăr, o mulțime de aceste rânduri 657 00:29:00,170 --> 00:29:04,060 acum sunt de imagine JPEG slash Tipuri MIME sau tipuri de conținut. 658 00:29:04,060 --> 00:29:07,750 Asta pentru că ceea ce face crom de fiecare dată când faceți clic și glisați, faceți clic pe 659 00:29:07,750 --> 00:29:11,650 și trageți, este este realizarea, oh, I nevoie pentru a merge cere Google pentru țiglă 660 00:29:11,650 --> 00:29:15,080 pe harta care sa terminat aici, descarcati-l repede prin HTTP, 661 00:29:15,080 --> 00:29:19,550 și apoi adăugați-l la așa-numitele DOM pentru browserele web în copac memorie 662 00:29:19,550 --> 00:29:24,430 Reprezentarea astfel încât utilizatorul, mă, vede că țiglă actualizat. 663 00:29:24,430 --> 00:29:26,795 Și acest lucru este din cauza o tehnica numita AJAX. 664 00:29:26,795 --> 00:29:28,920 Înapoi în a doua zi, într-adevăr a fost cazul că, dacă 665 00:29:28,920 --> 00:29:33,050 a vrut sa schimbe ceea ce este pe ecran, va trebui să faceți clic în sus, în jos, la stânga, 666 00:29:33,050 --> 00:29:33,550 dreapta. 667 00:29:33,550 --> 00:29:34,740 Și apoi o nouă pagină va deschide. 668 00:29:34,740 --> 00:29:36,531 Dar aceste zile, totul este mult mai dinamic. 669 00:29:36,531 --> 00:29:40,490 Se întâmplă în modul în care oamenii ar fi Sper că de fapt ar fi interactiv. 670 00:29:40,490 --> 00:29:43,210 Și se realizează acest lucru prin intermediul unei tehnici numită 671 00:29:43,210 --> 00:29:46,170 AJAX, care este, probabil, cel mai bine explicat printr-un exemplu. 672 00:29:46,170 --> 00:29:49,730 În primul rând, permiteți-mi să mergeți mai departe și deschide un fișier 673 00:29:49,730 --> 00:29:53,540 numit quote.php în Codul de distribuție de astăzi. 674 00:29:53,540 --> 00:29:56,200 >> Și apoi lasă-mă să fac Hopa symbol--. 675 00:29:56,200 --> 00:30:02,399 Lasă-mă să fac simbol = GOOG pentru doar câteva stoc. 676 00:30:02,399 --> 00:30:04,440 Sau, de fapt, să facem unul din PSET gratuit. 677 00:30:04,440 --> 00:30:05,270 Enter. 678 00:30:05,270 --> 00:30:06,580 >> Și acum observați ce mă întorc. 679 00:30:06,580 --> 00:30:09,210 Deci, acesta este un adevărat fișier scurt PHP pe care am 680 00:30:09,210 --> 00:30:13,210 a scris că pur și simplu împrumută cod din funcția de căutare Pset7 lui 681 00:30:13,210 --> 00:30:17,830 și scuipă folosirea acestui acoladă și citate și notație colon, aparent, 682 00:30:17,830 --> 00:30:22,747 stocul actual de preț pentru Firma pe care le trece în via GET. 683 00:30:22,747 --> 00:30:24,580 Deci, acest lucru este diferit de la cele mai multe din ceea ce ne-am 684 00:30:24,580 --> 00:30:26,496 făcut în același anunț eu sunt literalmente scuipa 685 00:30:26,496 --> 00:30:27,870 ceea ce arata ca cod JavaScript. 686 00:30:27,870 --> 00:30:30,020 >> De fapt, acesta este un obiect JavaScript. 687 00:30:30,020 --> 00:30:34,130 De fapt, doar pentru a fi mai clar, JavaScript Object Notation-- JSON-- 688 00:30:34,130 --> 00:30:38,330 este doar un mod fantezist de a spune că voi poate reprezenta date în JavaScript mult 689 00:30:38,330 --> 00:30:41,660 ca tine poate în PHP folosind perechi de valori-cheie. 690 00:30:41,660 --> 00:30:44,270 Deci, dacă am vrut să o declare o variabilă în JavaScript 691 00:30:44,270 --> 00:30:47,872 a reprezintă Zamyla, pentru instance-- o struct pentru Zamyla-- 692 00:30:47,872 --> 00:30:49,580 și vom numi elev, această variabilă. 693 00:30:49,580 --> 00:30:53,060 ID-ul ei este unul, casa este Winthrop, iar numele este Zamyla. 694 00:30:53,060 --> 00:30:55,490 >> Dar eu pot avea, de asemenea, o serie de obiecte. 695 00:30:55,490 --> 00:30:58,710 Deci, dacă de fapt am vrut să am o matrice în JavaScript care conține 696 00:30:58,710 --> 00:31:01,740 mai multe astfel de obiecte, acest timp reprezentând personal, 697 00:31:01,740 --> 00:31:04,910 S-ar putea avea aceste trei bucăți de cod din spate 698 00:31:04,910 --> 00:31:08,560 la spate în spate pentru acestea trei foști membri ai personalului. 699 00:31:08,560 --> 00:31:12,201 Deci, sintaxa, destul de similar cu both-- la PHP. 700 00:31:12,201 --> 00:31:13,700 Dar acest lucru este deosebit JavaScript. 701 00:31:13,700 --> 00:31:15,940 E notație obiect. 702 00:31:15,940 --> 00:31:17,240 Deci, ce este acest util pentru? 703 00:31:17,240 --> 00:31:21,580 >> Dacă aș scrie cod care scuipă JSON-- JavaScript Object Notation-- chestia asta 704 00:31:21,580 --> 00:31:24,670 Se pare ca aceasta sau chestia asta Se pare ca structura Zamyla lui, 705 00:31:24,670 --> 00:31:27,730 Eu pot folosi de fapt, acest în programele scriu. 706 00:31:27,730 --> 00:31:30,660 Lasă-mă să merg la ajax0.html. 707 00:31:30,660 --> 00:31:33,310 Și acest too-- nu de mult crezut dat de estetica. 708 00:31:33,310 --> 00:31:34,660 Dar priviți ce se întâmplă. 709 00:31:34,660 --> 00:31:37,050 >> Lasă-mă să merg mai departe și tastați gratis aici. 710 00:31:37,050 --> 00:31:38,490 Faceți clic primi citat. 711 00:31:38,490 --> 00:31:41,060 Și observați URL-ul nu sa schimbat. 712 00:31:41,060 --> 00:31:47,250 Dar am primit un pop-up cu aparent de azi penny prețul de vînzare de 0.15 dolari. 713 00:31:47,250 --> 00:31:49,062 Deci, nu tot așa de rău. 714 00:31:49,062 --> 00:31:52,020 Dar diferența este că într-un fel, aceste date s-au întors la mine direct. 715 00:31:52,020 --> 00:31:54,250 Dar să facem un pas spre ceva mai familiar. 716 00:31:54,250 --> 00:31:58,900 În versiunea una din asta, lasă-mă să tip liber din nou, faceți clic pe Obțineți citat, 717 00:31:58,900 --> 00:32:01,146 și now-- oh, aceasta a fost de fapt versiunea jQuery. 718 00:32:01,146 --> 00:32:03,270 Așa că haideți să mine-- nu am făcut- fast-forward destul de departe. 719 00:32:03,270 --> 00:32:05,830 Lasă-mă să merg la versiunea doi, care este în cazul în care mi-am dorit. 720 00:32:05,830 --> 00:32:07,260 Observați ce am făcut aici. 721 00:32:07,260 --> 00:32:10,370 Am un web page-- un super- versiune simpla a oricărei pagini web 722 00:32:10,370 --> 00:32:14,260 s-ar putea folosi de astazi cu un câmp de text aici pentru liberă și apoi se pare că doar 723 00:32:14,260 --> 00:32:14,880 text. 724 00:32:14,880 --> 00:32:16,860 >> Aceasta nu este o formă aici, se pare. 725 00:32:16,860 --> 00:32:19,360 Dar dacă faceți click primi citat, observați pagina mea de web 726 00:32:19,360 --> 00:32:22,760 este pe cale să se schimbe ca și cum am tocmai am primit un nou mesaj chat 727 00:32:22,760 --> 00:32:25,360 sau ca și cum tocmai m-am mutat hartă și necesare pentru a obține mai multe date 728 00:32:25,360 --> 00:32:29,220 adăugat dinamic pe pagina web fără schimbarea URL și utilizatorul 729 00:32:29,220 --> 00:32:30,980 experiență obtinerea întreruptă. 730 00:32:30,980 --> 00:32:35,750 Într-adevăr, eu sunt încă la exact aceeași ajax2.html place--. 731 00:32:35,750 --> 00:32:39,080 >> Așa că haideți să ne uităm doar la acest exemplu și a vedea modul în care acest lucru se întâmplă. 732 00:32:39,080 --> 00:32:42,490 Lasă-mă să intru în ajax2.html. 733 00:32:42,490 --> 00:32:44,770 Și observați formularul de primul. 734 00:32:44,770 --> 00:32:47,092 >> Aici, eu sunt de cotitură off complet automată. 735 00:32:47,092 --> 00:32:48,800 Uneori devine enervant în cazul în care browser-ul 736 00:32:48,800 --> 00:32:50,508 încearcă să-ți arăt tot istoricul. 737 00:32:50,508 --> 00:32:53,450 Astfel încât să puteți face în HTML de doar că auto a finaliza off. 738 00:32:53,450 --> 00:32:57,290 >> Am dat acest câmp de text o symbol-- mai degrabă, un ID de simbol. 739 00:32:57,290 --> 00:32:58,977 Și acum, aceasta este o caracteristică interesantă. 740 00:32:58,977 --> 00:33:01,310 Noi nu am vorbit despre durata, dar vă puteți gândi la asta 741 00:33:01,310 --> 00:33:03,177 ca o etichetă paragraf sau div tag-ul. 742 00:33:03,177 --> 00:33:05,010 Este ceea ce se numește o în-linie de elemente, care 743 00:33:05,010 --> 00:33:07,415 înseamnă că nu va primi un paragraf rupe deasupra și dedesubt. 744 00:33:07,415 --> 00:33:11,530 E doar de gând să rămână în linie fără lovind echivalentul a intra. 745 00:33:11,530 --> 00:33:17,980 Așa că am dat această bucată de cod HTML care urmează a fi determinat un identificator unic 746 00:33:17,980 --> 00:33:20,130 că am sunat arbitrar preț. 747 00:33:20,130 --> 00:33:21,560 Și am o butonul Submit. 748 00:33:21,560 --> 00:33:25,420 >> Deoarece acum cu here-- și acest lucru este Codul de fapt, super-uimitor cât de puțin 749 00:33:25,420 --> 00:33:27,660 poti scrie să faci relativ curat lucruri-- 750 00:33:27,660 --> 00:33:31,800 observați ce am făcut aici, dacă am derulați până la capul paginii. 751 00:33:31,800 --> 00:33:34,970 Am inclus pentru prima dată în capul meu o etichetă script 752 00:33:34,970 --> 00:33:37,410 care de fapt face referire la o JavaScript fișier în altă parte. 753 00:33:37,410 --> 00:33:39,702 Acest lucru este din partea organizației care scrie jQuery, 754 00:33:39,702 --> 00:33:42,660 iar acest lucru este doar oferindu-vă mai târziu Versiunea de bibliotecă lor jQuery. 755 00:33:42,660 --> 00:33:46,305 >> Deci, aceasta este un fel de ascuțite include în C sau necesită în PHP. 756 00:33:46,305 --> 00:33:48,900 Puteți utiliza tag-ul script- cu un atribut sursă. 757 00:33:48,900 --> 00:33:52,030 Dar acum propria ta cod este o să fie chiar aici. 758 00:33:52,030 --> 00:33:54,170 >> Observați Am o funcție numită Citate. 759 00:33:54,170 --> 00:33:56,180 Și se pare un pic criptic la prima vedere. 760 00:33:56,180 --> 00:33:57,305 Dar să tachineze această afară. 761 00:33:57,305 --> 00:33:59,090 Dă-mi o variabilă numită URL. 762 00:33:59,090 --> 00:34:01,390 Atribui o literalmente acest șir. 763 00:34:01,390 --> 00:34:04,530 Deci, ghilimele simple, ghilimele duble în JavaScript doar dă-mi un șir. 764 00:34:04,530 --> 00:34:06,900 Ce face plus? 765 00:34:06,900 --> 00:34:08,199 Concatenare. 766 00:34:08,199 --> 00:34:12,610 >> Deci, aceasta este acum sintaxa jQuery care are un pic Noțiuni de bază utilizate pentru a. 767 00:34:12,610 --> 00:34:18,310 Dar acest lucru înseamnă doar du-te adu-mi DOM nod al cărui identificator unic este un simbol. 768 00:34:18,310 --> 00:34:21,929 Hashtag acolo înseamnă simbol identificator unic. 769 00:34:21,929 --> 00:34:24,929 >> Semnul dolar în Parantezele doar să spun, înfășurați acest 770 00:34:24,929 --> 00:34:28,510 în jQuery un fel de sos secret, așa te funcționalități suplimentare. 771 00:34:28,510 --> 00:34:31,880 Și apoi .val este aparent o funcție, sau, cum se spune acum, 772 00:34:31,880 --> 00:34:35,219 o metodă reușită de acest nod că doar îți dă valoarea. 773 00:34:35,219 --> 00:34:38,896 Deci, pe scurt, urât și confuz ca acest lucru pare la prima vedere, 774 00:34:38,896 --> 00:34:42,020 acest lucru înseamnă doar a lua cu utilizatorul tastat in, pune-l la sfârșitul șirului 775 00:34:42,020 --> 00:34:42,880 prin concatenarea ea. 776 00:34:42,880 --> 00:34:43,739 Asta e tot. 777 00:34:43,739 --> 00:34:46,070 >> Deci, acum, ultimele trei rânduri. 778 00:34:46,070 --> 00:34:48,690 Puteți stoarce o mulțime de funcționalitate din trei linii. 779 00:34:48,690 --> 00:34:52,199 Acest semn dolar, ca o la o parte, este doar o poreclă 780 00:34:52,199 --> 00:34:55,800 pentru o variabilă globală special numit literalmente jQuery. 781 00:34:55,800 --> 00:34:57,060 >> Semn dolar doar pare cool. 782 00:34:57,060 --> 00:35:00,080 Deci, comunitatea jQuery doar un fel a folosit-o ca simbol lor speciale. 783 00:35:00,080 --> 00:35:02,470 Aceasta nu înseamnă ceea ce înseamnă, în PHP. 784 00:35:02,470 --> 00:35:06,356 În JavaScript, semn dolar este la fel ca o literă a alfabetului 785 00:35:06,356 --> 00:35:07,480 sau un număr pentru o variabilă. 786 00:35:07,480 --> 00:35:09,000 >> Puteți să-l avea la fel de nume. 787 00:35:09,000 --> 00:35:09,770 Doar pare cool. 788 00:35:09,770 --> 00:35:11,890 Deci, comunitatea la adoptat ca pseudonim 789 00:35:11,890 --> 00:35:13,390 pentru propria biblioteca lor numit jQuery. 790 00:35:13,390 --> 00:35:15,060 >> Și e foarte popular. 791 00:35:15,060 --> 00:35:17,620 Asa ca JSON este exact asta. 792 00:35:17,620 --> 00:35:19,920 Este o funcție care oameni buni la jQuery scris 793 00:35:19,920 --> 00:35:23,340 care devine JSON de la o server-- JavaScript Object Notation. 794 00:35:23,340 --> 00:35:25,680 Din ceea ce URL-ul se merge pentru a obține aceste informații? 795 00:35:25,680 --> 00:35:27,790 Se pare că de la această adresă URL aici. 796 00:35:27,790 --> 00:35:31,180 >> Și ce ar trebui să facă browser-ul ca Imediat după ce se va întoarce acest răspuns? 797 00:35:31,180 --> 00:35:36,500 Și aceasta este magia de AJAX, astfel încât să speak-- JavaScript asincronă în XML. 798 00:35:36,500 --> 00:35:41,320 E greu sa vezi cu un astfel de exemplu simplu ca am avut aici. 799 00:35:41,320 --> 00:35:44,730 >> Dar acest lucru a fost asincron în sensul în care codul meu, atunci când 800 00:35:44,730 --> 00:35:48,530 executat trimis un mesaj server pentru a merge adu-mi niște JSON. 801 00:35:48,530 --> 00:35:51,340 Și sa întâmplat super rapid că am primit un răspuns. 802 00:35:51,340 --> 00:35:55,130 Dar ceea ce este interesant este faptul că acest linie de cod nu a închide calculatorul meu. 803 00:35:55,130 --> 00:35:56,550 >> N-am văzut o pictogramă de filare. 804 00:35:56,550 --> 00:35:59,200 Nu am pierdut capacitatea de a muta mouse-ul meu. 805 00:35:59,200 --> 00:36:01,340 Browser-ul meu a fost de fapt foarte bine. 806 00:36:01,340 --> 00:36:06,290 >> Pentru că modul în care se ocupă de activarea JavaScript- răspuns de la serverul este următoarea. 807 00:36:06,290 --> 00:36:09,740 Te înscrii ceea ce ai numi o funcție de apel invers, care 808 00:36:09,740 --> 00:36:12,830 înseamnă doar, hei, JavaScript. 809 00:36:12,830 --> 00:36:16,100 De îndată ce serverul răspunde cu JSON, 810 00:36:16,100 --> 00:36:18,750 va rugam sa sunati această funcție anonim. 811 00:36:18,750 --> 00:36:23,910 >> Și atunci va rugam sa a trecut în această funcție indiferent șir serverul scuipa 812 00:36:23,910 --> 00:36:26,080 ca un argument numit de date. 813 00:36:26,080 --> 00:36:28,360 Deci, cu alte cuvinte, dacă Sunt asamblare dinamic 814 00:36:28,360 --> 00:36:33,370 o quote.php URL care trece în acest simbol cum ar GRATUIT sau GOOG sau fleacuri, 815 00:36:33,370 --> 00:36:36,830 Eu atunci spun JavaScript du-te că adresa URL. 816 00:36:36,830 --> 00:36:39,080 Amintiți-vă că browser-ul este de gând să se întoarcă ceva 817 00:36:39,080 --> 00:36:42,680 care arata ca am vazut earlier-- aceasta. 818 00:36:42,680 --> 00:36:45,940 >> Și ce al doilea argument aici pentru a primi JSON spune 819 00:36:45,940 --> 00:36:48,450 se numesc această funcție în cazul în care serverul se întoarce 820 00:36:48,450 --> 00:36:52,440 fie că este vorba de 10 milisecunde de acum sau 10 secunde de acum. 821 00:36:52,440 --> 00:36:55,840 Și, de îndată ce faci, se adaugă prețul de la pagina. 822 00:36:55,840 --> 00:36:58,030 Această sintaxă aici doar înseamnă du-te la nodul 823 00:36:58,030 --> 00:37:01,940 din copac, acesta unic de identificare este price-- acest interval am văzut mai devreme. 824 00:37:01,940 --> 00:37:04,320 >> Această metodă numit HTML doar spune, du-te înlocui 825 00:37:04,320 --> 00:37:08,770 HTML care este acolo cu data.price. 826 00:37:08,770 --> 00:37:10,200 Ce-i data.price? 827 00:37:10,200 --> 00:37:12,850 Ei bine, browser-ul, amintesc, mi-a arătat această întoarce. 828 00:37:12,850 --> 00:37:14,540 Deci, acestea sunt date. 829 00:37:14,540 --> 00:37:18,100 >> Și așa e puțin criptic pentru a vedea virgulele aici. 830 00:37:18,100 --> 00:37:19,350 Dar, de fapt, lasă-mă să fac asta. 831 00:37:19,350 --> 00:37:22,890 Lasă-mă să inserați acest lucru foarte repede în gedit 832 00:37:22,890 --> 00:37:27,240 și ai se arăta ca și cum am arătat Structura mai devreme Zamyla lui. 833 00:37:27,240 --> 00:37:31,610 >> Ce serverul trimite înapoi este un mic obiect care arata ca aceasta. 834 00:37:31,610 --> 00:37:37,140 Și așa data.price este doar mi-a dat 0.1515. 835 00:37:37,140 --> 00:37:39,310 Deci, o mulțime de mișcare Piese de aici dintr-o dată. 836 00:37:39,310 --> 00:37:41,860 >> Dar takeaways cheie este că avem această capacitate 837 00:37:41,860 --> 00:37:44,600 pentru a face HTTP suplimentare solicitări utilizează JavaScript 838 00:37:44,600 --> 00:37:46,090 fără a fi nevoie să reîncărcați pagina. 839 00:37:46,090 --> 00:37:49,580 Și apoi putem de fapt schimba pagina web pe zbor. 840 00:37:49,580 --> 00:37:51,850 Și se pare că JavaScript și alte limbi 841 00:37:51,850 --> 00:37:54,510 pot fi folosite acum nu numai de a evolua pagini web, 842 00:37:54,510 --> 00:37:57,960 dar pentru a scrie de fapt software-ul într-un calculator real, 843 00:37:57,960 --> 00:38:00,240 nu limitează doar la Chrome sau altele asemenea. 844 00:38:00,240 --> 00:38:03,530 >> De fapt, if-- Colton, vrei Vrei să ni se alăture din nou aici 845 00:38:03,530 --> 00:38:06,100 cu codul de laborator, și Chang precum și? 846 00:38:06,100 --> 00:38:09,140 Să mergem mai departe, după ce a vorbit despre funcții anonime și callback 847 00:38:09,140 --> 00:38:13,090 și într-adevăr ispiti soarta aici cu un live demo cu sângerare 848 00:38:13,090 --> 00:38:16,480 tehnologie de vârf, unul dintre aceste dispozitive Elite mișcare. 849 00:38:16,480 --> 00:38:18,940 Acum, acest aparat, rechemare, este un dispozitiv USB pic 850 00:38:18,940 --> 00:38:25,620 precum și that-- asta e beautiful-- care se conectează la porturile USB. 851 00:38:25,620 --> 00:38:29,120 >> Și apoi oferă intrare sub formă de gesturilor umane 852 00:38:29,120 --> 00:38:32,560 prin detectarea folosind raze infrarosii, în esență, mișcările de pe brațul tău. 853 00:38:32,560 --> 00:38:35,150 Deci, întrucât ceea ce a încercat Maria înainte a fost musculară, 854 00:38:35,150 --> 00:38:39,000 senzație de fapt, ceea ce se schimbă brațul tău, acest lucru este în infraroșu pe bază. 855 00:38:39,000 --> 00:38:44,390 Deci, este excelentă pentru deplasările în interiorul un fel de sferă de un picior sau cam asa ceva 856 00:38:44,390 --> 00:38:46,190 a dispozitivului în sine. 857 00:38:46,190 --> 00:38:48,950 >> Deci, de ce să nu iau o lovitură de cuțit în această primă? 858 00:38:48,950 --> 00:38:53,100 Și să mergem mai departe și arunca te-ai trezit pe tavan aici. 859 00:38:53,100 --> 00:38:56,250 Deci să punem laptop Colton de până aici. 860 00:38:56,250 --> 00:38:58,360 Avem Andrew pe televizor. 861 00:38:58,360 --> 00:39:00,160 Și ce ai vrea să fac mai întâi? 862 00:39:00,160 --> 00:39:02,409 >> COLTON: Du-te și doar pune-ți mâinile pe tipul ăsta 863 00:39:02,409 --> 00:39:04,430 și veți vedea niște sclipici fabulos. 864 00:39:04,430 --> 00:39:07,230 >> DAVID J. MALAN: Foarte frumos. 865 00:39:07,230 --> 00:39:11,110 Acest lucru se întâmplă totul în timp real. 866 00:39:11,110 --> 00:39:11,889 OK. 867 00:39:11,889 --> 00:39:12,680 Bine, și da. 868 00:39:12,680 --> 00:39:14,119 Atât de frumos. 869 00:39:14,119 --> 00:39:15,410 Bine, ce altceva putem face? 870 00:39:15,410 --> 00:39:17,900 >> COLTON: Du-te la ecranul următor și să vedem. 871 00:39:17,900 --> 00:39:19,136 >> DAVID J. MALAN: În regulă. 872 00:39:19,136 --> 00:39:21,780 >> COLTON: un joc distractiv pic de în cazul în care veți obține pentru a face roboți. 873 00:39:21,780 --> 00:39:24,738 >> DAVID J. MALAN: Bine, deci aceasta este mâinile în fals arată-mi ce să fac. 874 00:39:24,738 --> 00:39:27,920 COLTON: Da Deci, mergeți mai departe și apuca unul dintre blocurile 875 00:39:27,920 --> 00:39:30,637 și pune-l pe partea de sus a corpului, care robot. 876 00:39:30,637 --> 00:39:32,137 DAVID J. MALAN: Oh, nu e mâna mea. 877 00:39:32,137 --> 00:39:34,000 Oh. 878 00:39:34,000 --> 00:39:34,780 OK, adorabil. 879 00:39:34,780 --> 00:39:37,500 880 00:39:37,500 --> 00:39:38,650 Așteaptă un minut, OK. 881 00:39:38,650 --> 00:39:41,320 Acolo mergem. 882 00:39:41,320 --> 00:39:43,590 >> COLTON: Am făcut un accident pe. 883 00:39:43,590 --> 00:39:45,423 >> DAVID J. MALAN: OK, voi primi acest tip. 884 00:39:45,423 --> 00:39:45,923 La naiba! 885 00:39:45,923 --> 00:39:48,467 886 00:39:48,467 --> 00:39:51,550 Când am fost practicarea acestui ultim noapte, știi ce transferată acest lucru în? 887 00:39:51,550 --> 00:39:54,285 >> Ca aceasta. 888 00:39:54,285 --> 00:39:55,490 OK. 889 00:39:55,490 --> 00:39:55,990 Una următor? 890 00:39:55,990 --> 00:39:56,860 >> COLTON: Sigur. 891 00:39:56,860 --> 00:39:58,818 >> DAVID J. MALAN: Bine, și nu există un al treilea. 892 00:39:58,818 --> 00:40:01,130 893 00:40:01,130 --> 00:40:01,674 Bine. 894 00:40:01,674 --> 00:40:03,215 COLTON: Și în asta, veți obține sa-- 895 00:40:03,215 --> 00:40:04,923 DAVID J. MALAN: Oh, asta e frumos. 896 00:40:04,923 --> 00:40:06,650 COLTON: --yeah, alege APT această floare. 897 00:40:06,650 --> 00:40:07,441 DAVID J. MALAN: OK. 898 00:40:07,441 --> 00:40:11,170 899 00:40:11,170 --> 00:40:11,670 Nu? 900 00:40:11,670 --> 00:40:14,515 Pierdute. 901 00:40:14,515 --> 00:40:15,570 >> COLTON: Oh, nu te duci. 902 00:40:15,570 --> 00:40:18,680 >> DAVID J. MALAN: Ah, Uită-te la asta. 903 00:40:18,680 --> 00:40:19,830 Foarte frumos. 904 00:40:19,830 --> 00:40:22,470 Ei bine, ce dont 'vom lua unul voluntar aici 905 00:40:22,470 --> 00:40:24,180 care ar dori să vină pe sus. 906 00:40:24,180 --> 00:40:27,500 Ce zici de acolo în verde, nu? 907 00:40:27,500 --> 00:40:30,540 >> Bine, și să have-- în loc de a face acest lucru, unii dintre voi 908 00:40:30,540 --> 00:40:34,590 s-ar putea ști acest joc here-- tăiat frânghia, poate? 909 00:40:34,590 --> 00:40:35,100 Să vedem. 910 00:40:35,100 --> 00:40:37,320 Avem ochelarii pe aici? 911 00:40:37,320 --> 00:40:38,625 >> OK. 912 00:40:38,625 --> 00:40:39,270 Mulțumesc. 913 00:40:39,270 --> 00:40:39,380 Care e numele tău? 914 00:40:39,380 --> 00:40:40,350 >> Audiența: Laura. 915 00:40:40,350 --> 00:40:41,266 >> DAVID J. MALAN: Laura? 916 00:40:41,266 --> 00:40:42,120 Mă bucur să văd. 917 00:40:42,120 --> 00:40:45,600 Dacă nu te superi inscrie Google Glass peste ochelarii. 918 00:40:45,600 --> 00:40:46,970 Acest lucru este Colton. 919 00:40:46,970 --> 00:40:47,650 >> COLTON: Bună. 920 00:40:47,650 --> 00:40:48,140 Mă bucur să te cunosc. 921 00:40:48,140 --> 00:40:49,600 >> DAVID J. MALAN: OK, haide jur. 922 00:40:49,600 --> 00:40:52,516 Bine, deci ce ai de gând să face aici, care a jucat acest lucru înainte, 923 00:40:52,516 --> 00:40:55,650 Se pune mâna pe Leap Motion aici. 924 00:40:55,650 --> 00:40:57,210 Și acum, săgeata trebuie să se miște. 925 00:40:57,210 --> 00:40:57,710 Oh, nope. 926 00:40:57,710 --> 00:40:58,066 >> Audiența: Nu. 927 00:40:58,066 --> 00:40:58,780 >> DAVID J. MALAN: Ne Nu vreau să renunț încă. 928 00:40:58,780 --> 00:40:59,280 OK, așteptați. 929 00:40:59,280 --> 00:41:01,200 Peste aici. 930 00:41:01,200 --> 00:41:03,530 Deci, observați cum vă țineți ta degetul peste ceva, 931 00:41:03,530 --> 00:41:06,750 mouse-ul începe să meargă verde, care este modul în care faceți clic. 932 00:41:06,750 --> 00:41:08,980 >> Deci, hover peste Redare. 933 00:41:08,980 --> 00:41:10,970 Și doar un singur deget este bine. 934 00:41:10,970 --> 00:41:13,869 Și acum faceți clic pe putinul tip verde pe partea stângă. 935 00:41:13,869 --> 00:41:15,410 Și acum ține până când se umple de culoare verde. 936 00:41:15,410 --> 00:41:15,640 Bun. 937 00:41:15,640 --> 00:41:16,990 Acum, cum ar fi, un nivel de până sus. 938 00:41:16,990 --> 00:41:20,190 >> Audiența: Da, vrem nivel unu, aici. 939 00:41:20,190 --> 00:41:21,660 >> DAVID J. MALAN: Bun. 940 00:41:21,660 --> 00:41:25,500 OK, deci tot ce trebuie să faceți este să taie coarda. 941 00:41:25,500 --> 00:41:28,240 Cursorul e cel alb acolo jos. 942 00:41:28,240 --> 00:41:28,880 >> Foarte frumos. 943 00:41:28,880 --> 00:41:31,290 944 00:41:31,290 --> 00:41:32,790 Bine, e pe cale de a obține mai greu. 945 00:41:32,790 --> 00:41:34,800 Deci, țineți degetul pe viitor acum. 946 00:41:34,800 --> 00:41:37,370 947 00:41:37,370 --> 00:41:39,030 Bun. 948 00:41:39,030 --> 00:41:39,999 Asta e greu. 949 00:41:39,999 --> 00:41:40,966 >> Audiența: Oh, rahat. 950 00:41:40,966 --> 00:41:41,466 OK. 951 00:41:41,466 --> 00:41:42,466 Vrea să meargă în acest fel. 952 00:41:42,466 --> 00:41:44,890 Oh crap, that-- 953 00:41:44,890 --> 00:41:47,120 >> DAVID J. MALAN: Da. 954 00:41:47,120 --> 00:41:50,700 Obiectiv secundar este de a obtine toate stelele. 955 00:41:50,700 --> 00:41:53,920 În regulă, următorul. 956 00:41:53,920 --> 00:41:57,504 >> Să vedem dacă puteți obține acest al treilea. 957 00:41:57,504 --> 00:41:58,004 Bun. 958 00:41:58,004 --> 00:42:05,980 959 00:42:05,980 --> 00:42:06,840 OK, du-te acolo. 960 00:42:06,840 --> 00:42:08,850 >> Sigur. 961 00:42:08,850 --> 00:42:11,230 Oh, foarte frumos. 962 00:42:11,230 --> 00:42:11,930 Bine. 963 00:42:11,930 --> 00:42:13,534 >> Deci, de ce nu ne-am suspenda aici azi? 964 00:42:13,534 --> 00:42:15,200 Lasa pe nimeni sa vii pe la care vrea să joace. 965 00:42:15,200 --> 00:42:16,880 Multumesc mult pentru Laura voluntar. 966 00:42:16,880 --> 00:42:18,730 Si iti vom vedea pe luni. 967 00:42:18,730 --> 00:42:21,190 >> Audiența: Probabil vrei astea înapoi. 968 00:42:21,190 --> 00:42:23,640 >> SPEAKER 2: La CS50-- următor 969 00:42:23,640 --> 00:42:35,222