DAVID J. Malan: Molt bé, pel que aquesta aquí és el braç Myo banda, un parell dels quals tenir per als projectes finals CS50. I això era una demostració que va fer cua que per endavant on essencialment aquest braç bastant fort banda de fins a aquí escolta als seus moviments musculars que després són mapejats en programari per a l'ordinador portàtil de Colton per aquí que havia iTunes i que cançó ja en cua. En lloc d'això em donem, Colton ha estat en el laboratori clarament tota la setmana per aconseguir una demostració llest per a un valent voluntari. Si algú vol venir en up-- va veure primer la mà. Anem amunt. [00:01:09] Bé. I quin és el seu nom? [00:01:13] AUDIÈNCIA: Uh, Maria. [00:01:14] DAVID J. Malan: Maria, m'alegro de veure't. Anem per aquí. Permetin-me presentar a Colton. Colton, aquesta és Maria. [00:01:21] COLTON: Hola, encantat de conèixer-te. [00:01:23] DAVID J. Malan: Tots dret, per la qual cosa el primer pas, estem va a haver de posar això al seu avantbraç per la qual cosa és bastant estret fins a prop del seu colze. I mentrestant, tindrem posar en el nostre Google Glass i anem a barrejar les tecnologies d'avui. [00:01:33] COLTON: En primer lloc haurem de connectar això en les coses. [00:01:36] DAVID J. Malan: OK. En realitat, anem a posar el braç com prop d'aquest cable com sigui possible perquè puguem sincronitzar primer cap amunt. [00:01:41] COLTON: Anem a fer això. [00:01:42] DAVID J. Malan: I mentrestant, per la qual cosa que tothom pot aconseguir una mirada més de prop, anem tirem càmera d'Andrew a la pantalla allà. Així que tenim un cable USB que és està connectat a la banda de Maria. I permetin-me llanço pantalla de Colton a dalt en el projector següent. [00:02:00] Així Colton és el registre del dispositiu ara com un Myo connectat a aquest cable. I ara el que Maria de farà momentàniament en realitat és caminar a través de els passos de calibratge i ensenyar el programari com els seus músculs responen quan es fan certs predefinit gestos que el programari entén. Si vol anar a davant de la pantalla. Acceptar, seguir intentant-ho. [00:02:30] COLTON: Anar com aquest. I així. I tot el camí a la dreta. Tornar. [00:02:35] DAVID J. Malan: OK. Perspectiva diferent. No és vostè. Som nosaltres. [00:02:40] MARIA: OK. DAVID J. Malan: No. Anem a passar el més amunt pel que és més a prop del seu colze, o fins i tot amb més força. Bé. [00:02:52] Aquí anem. Aquest seria un bon moment per CS52X. Cal anar. [00:02:57] Molt agradable. Okay. Polze per petit. [00:03:02] Molt agradable. Estén els teus dits. Bé. Ona dreta. S'està mostrant curiositat que amb l'mà- esquerra [00:03:17] COLTON: Sí, això és estrany. DAVID J. Malan: Salutació a la dreta i seguir endavant. Un avanç ràpid per saltar o següent. Això està bé dret Wave. [00:03:25] MARIA: Jo no-- esperar. [00:03:26] DAVID J. Malan: Necessita ajuda? [00:03:28] COLTON: Així que et vas d'aquesta manera. MARIA: S'està convertint la una altra cosa, però. COLTON: És. DAVID J. Malan: Sí No sé raó per la qual vostè està mostrant un esquerrà. COLTON: Per què no try-- només tractar d'anar així. [00:03:38] DAVID J. Malan: No? Potser arribar al seu braç una mica més recte i que sigui més abrupte com aquest. Sí, està bé, anem. [00:03:48] MARIA: Ho sento. DAVID J. Malan: No és culpa teva. COLTON: Està bé. DAVID J. Malan: D'acord. Bueno-- [00:03:56] MARIA: Hem ometre això, llavors? DAVID J. Malan: Sí, anem a et deixi fora del ganxo. Així que si algú vol fer un projecte final utilitzant aquesta avantguarda maquinari, adonar-se que només podria prendre una mica de temps per acostumar. I esto-- la realitat és aquesta en realitat és molt sagnat vora. [00:04:10] Això és el que es diu el kit de desenvolupament, que està destinat a ser essencialment un pre-llançament de manera que la gent pot fer exactament esto-- lluitar amb ell, la figura com els cossos de les persones treballen amb la tecnologia. Així que si vols després, després de la conferència, podem deixar que vostè ve i prendre una altra punyalada en ella. Però d'altra banda, una ronda d'aplaudiments, si que vam poder, per a Maria per venir a endavant. [00:04:26] MARIA: Gràcies. [00:04:28] DAVID J. Malan: Gràcies. Ens aferrem a això, però donarem usted-- què tal una bola de la tensió aquí? Oh, i- si: sí, gràcies. Bé. Així que per als curiosos, si vostè fos familiaritzat amb l'elecció de so que vam fer allà abans, una televisió increïble demostrar que vostè ha absolutament ser afartament-veient a Netflix és aquest d'aquí. [00:04:51] ALTAVEU 1: Senyores i senyors, un mag anomenat Josh. [00:05:04] DAVID J. Malan: I pel que es veu, és una cosa que em de text durant la conferència ara. Estic sent vaig dir que Maria tenia un aniversari ahir. Així que feliç aniversari de CS50 a Maria també. [00:05:18] Així que vostè pot haver llegit en el mes recent que aquest cavallers aquí, Steve Ballmer, qui era en realitat classe de 1977 a la universitat, recentment retirat per Microsoft. Ell era estudiant aquí, a continuació, un parell d'anys més tard es va trobar en Stanford Business School quan va rebre un telèfon trucada d'un amic seu que havia viscut al passadís d'ell aquí a Harvard. El nom d'aquest amic era Bill Gates, i en el moment, ell estava tractant de reclutar Steve per ser la primera persona de negocis, realment, en una petita empresa de nom de Microsoft. [00:05:45] Una breu història llarga, Steve va ser finalment conquerit, unit a Microsoft quan tenia només 30 empleats. I per al moment en què es va retirar fa poc, la companyia tenia 100.000 empleats en els últims anys. I pel que un lloc web conegut com The Verge preparat aquest homenatge en vídeo que pensem que seria millor compartit que li dóna un sentit de tot el que l'energia de Steve porta a qualsevol presentació que dóna. [REPRODUCCIÓ DE VÍDEO] -Microsoft És com un quart fill. Els nens fan sortir de la casa. En aquest cas, suposo Me'n vaig de la casa. Hey Bill, whazzap? [00:06:23] -Wazzap? [00:06:24] -Escolta, Wazzap? Se'ns ha donat un enorme oportunitat. I Bill ens va donar aquesta oportunitat. Vull donar les gràcies a Bill perquè. Vull que també. El ritme de la innovació no va a reduir la velocitat. [00:06:42] Es va a arribar més ràpid i més ràpid. Pot haver-hi uns pocs competidors que per desgràcia estan eliminats! [00:06:54] M'encanta aquesta empresa. Sí! Sóc un PC, i m'encanta aquesta empresa! [00:07:08] Desenvolupadors, desenvolupadors, desenvolupadors, desenvolupadors, desenvolupadors, desenvolupadors, desenvolupadors, desenvolupadors. Sí! Els desenvolupadors web! [00:07:19] Els desenvolupadors web! Els desenvolupadors web! Escolteu la resta que vostè obtenir sense cost addicional! [00:07:28] L'executiu de MS-DOS, una cita calendari, una pica de targetes, un bloc de notes, un rellotge, un panell de control. I, pots creure-ho? Reversie! [00:07:35] Gravar-los en un CD! Poseu a MSN! Vostè els envia per correu als amics! [00:07:40] Tot amb un sol clic! Un Microsoft, una estratègia, un team-- centrat, disciplinat, professional, i expert en tot el que fem. Permetin-me utilitzar una línia d'una vella pel·lícula. [00:07:52] Les relacions són com els taurons. Es mouen cap endavant o es moren. De fet, crec tecnologia empreses són els mateixos. [00:08:01] [FI REPRODUCCIÓ DE VÍDEO] DAVID J. Malan: Així que estem molt contents de anunciar que Steve s'unirà a nosaltres aquí a CS50 proper dimecres a les el lloc i l'hora de costum aquí. Espai probable serà limitat. I així, a unir-se a nosaltres en persona, si us plau dirigir-se avui o poc després a cs50.harvard.edu/register. [00:08:22] I seguirem per Dimarts confirmant taques. Tenim ganes que el pròxim Dimecres durant conferència a CS50. Ara, en altres notícies, es va acudir venir a través d'aquest a The Crimson només l'altre dia. [00:08:34] Resulta que un de personal d'CS50 i almenys un dels estudiants del CS50 Actualment s'està executant per UC president i vicepresident, que em va portar de tornada als meus propis dies enrere quan vaig perdre l'elecció UC miserablement. Però el costat positiu en això és que sempre explicar la història és que una de la que estic segur moltes raons per les que van perdre la elecció era una falta completa d'un talent per parlar en públic. I així, amb tota sinceritat, que em va portar, que l'experiència Crec que el meu primer any, per signar en realitat per Harvard Computer Society, que és el grup al campus que exerceix en diverses xerrades tècniques i altres coses. I em vaig fer càrrec del seu ensenyament seminaris i, per tant, tingut una oportunitat, un meravellosa oportunitat, per començar a treballar en exactament això. Però també, vaig tenir l'oportunitat durant aquesta experiència per ensenyar a mi mateix tant més HTML. I així em demorat ahir a la nit per mirant a través de la pàgina web basat en HTML Vaig fer com el 1997, el 98, per a mi campanya que s'assembla a això aquí. Ho sé. [00:09:29] Porque-- i, per descomptat, previ avís aquesta increïble decisió de disseny el 1998 o el que sigui. La primera cosa que vostè vol que els usuaris fer en visitar el seu lloc web és haver de fer clic en un altre enllaç només per entrar a la seva pàgina web amb el monjo darrere d'una cortina cobert on pel que sembla, la meva plataforma de campanya era. I això és tot el que obtindrà avui és només una captura de pantalla. Però jo estava llegint a través de, com, els meus cartells de la campanya passada nit i la meva plataforma. [00:09:50] I jo estava tan enfadat amb el temps. La meva plataforma era-- va ser interessant. Així que m'he calmat des de llavors. Però algun dia, vaig a córrer de nou i esperem millor aquesta vegada. [00:10:03] Així HTML, que el llenguatge en el que vaig fer que en-- aviat té molt més-- és una cosa que hem estat parlant dels últims temps i en gran mesura amb el benentès ara que ens hem mogut a altres llengües. Però farem una pausa per un moment i posar una mica d'aquestes coses en el seu context. Així que en una frase, què és HTML? [00:10:18] O, el que s'utilitza? Qualsevol persona? Sí. [00:10:20] AUDIÈNCIA: marcat pels llocs web. DAVID J. Malan: marcat per al lloc web. Així que és un llenguatge de marcat que li permet estructurar una pàgina web. Capçalera puja aquí, títol va aquí, el cos va aquí. Això està en negreta, això és italics-- aquest tipus de detall. [00:10:33] Bé, bé. Així CSS permet usted-- i jo va prendre algunes llibertats allà amb la negreta i cursiva orientada al degut Això és millor implementats amb aquest. CSS és-- què? Digui en una frase. Qualsevol persona en absolut. Sí. [00:10:46] Audiència: Adorns i coses, com la forma de dissenyar-lo. DAVID J. Malan: OK, bé. Els adorns que li permeten dissenyar o estilitzar que amb coses com negreta i cursiva i colors i també més fi posicionament de gra d'elements. D'alguna manera li permet prendre les coses última milla de manera que si, per exemple, en Pset7, t'hauràs adonat de la seva La pàgina de la cartera si estàs en aquest moment ja que una taula per defecte que vostè fer per mostrar les tinences de valors de l'usuari i diners en efectiu, probablement, es veu bastant horrible per defecte, sense espais en blanc. Tot tipus d'atestat de junts en files i columnes. [00:11:18] Bé, amb una mica de CSS, com vostè pot adonar-se, en realitat es pot modificar això i fer que sigui alguna cosa molt més familiar i molt més més bonic de veure. Així que es tracta de la CSS estilització de llocs web. Però llavors, hem introduït una nova llenguatge, PHP, el que ens permet fer el que? [00:11:36] Anem a fer què? Qualsevol persona. He de aventurar-se més enllà el primer parell de files. Sí. [00:11:40] AUDIÈNCIA: Generar contingut dinàmic. DAVID J. Malan: Perfecte. Generar contingut dinàmic. I vostè pot fer això en qualsevol nombre d'idiomes. Ens va passar a utilitzar PHP perquè és en part, tan semblant a la sintaxi de C. [00:11:50] Però PHP fa exactament això. Se li permet generar dinàmicament la sortida. I alguns dels que la producció podria ser HTML, com ho hem estat fent normalment. I també, perquè és un llenguatge de programació, és el mecanisme a través del qual podem parlar amb les bases de dades. [00:12:03] I podem fer consultes a altres servidors com yahoos i programàticament fer res realment que et poden d'una altra manera volen obligar un equip a fer. Així que PHP permet a començar donar sortida de manera dinàmica el contingut. Esta és la lògica, jo no tenia un lloc web dinàmic en 1998. [00:12:16] Era només una pàgina web estàtica. El meu contingut havia de ser canviat per manualment amb gedit o algun equivalent. Però PHP és el que solíem o podria haver utilitzat, més aviat, per a alguna cosa com la Lloc web Frosh missatges instantanis, que se suposava que anava a prendre registres i administrar una llista de coses que users-- en realitat estan canviant més temps, tot i que ens ha tocat utilitzar Perl, una diferent el llenguatge de l'època. [00:12:35] I després, finalment, hem introduït SQL-- Structured Query Language. Així que encara un altre idioma que s'usa per a què? S'utilitza per a què? Podem aventurar slight-- Bé, no anem per arribar molt més lluny de l'orquestra aquí. AUDIÈNCIA: És un protocol utilitzat per parlar amb les bases de dades. DAVID J. Malan: Un protocol utilitzat per parlar amb les bases de dades. Permetin-me modificar. És un llenguatge natural utilitzat parlar amb databases-- selecciona i les insercions i eliminacions i actualitzacions i realitat fins i tot més característiques que que ni tan sols hem bussejat a però és possible que vulgueu tenir explore-- explorar per, per exemple, un projecte final. Així que hi ha aquestes diverses peces. [00:13:09] I és d'esperar Pset7, tot i que seva especificació és bastant llarg, és deliberadament llarg caminar que a través de com aquestes coses poden tots ser escrit junts. Ara, el dilluns, que introduït el nostre últim idioma que anem a introduir formalment en la descomptat-- que és, JavaScript. Això, com PHP, és un llenguatge interpretat. [00:13:25] No obstant això, una distinció clau Jo vaig proposar el dilluns és que mentre que PHP s'està executant o sent interpretat en el servidor, el que en aquest cas és l'aparell CS50, o podria haver-hi alguna web comercial servidor a Internet, JavaScript general és un llenguatge que s'executa el costat del client no servidor side-- així en el navegador. És a dir, de la mateixa manera que quan vaig obrir Facebook fins al codi font i va trobar tot d'aquests arxius .js, la implicació era que quan vostè visita Facebook o més Llocs web en aquests dies, s'obté no només HTML, no només CSS, però un munt de JavaScript codi sovint en la forma d'arxius .js. I llavors és el browser-- seu propi Mac o PC-- que executa aquest codi. [00:14:03] Però el navegador executa. Es pot pensar en una mena de caixa de sorra. Així que el codi JavaScript no hauria de ser capaç d'esborrar arxius a l'ordinador. No hauria de ser capaç de enviar missatges de correu electrònic en el seu nom. El seu tipus de navegador restringeix el que pot fer amb ella. [00:14:17] Així que en aquest sentit, que és una mica menys potent, potser, que C. Però JavaScript pot, com un a un costat, ser utilitzat en el servidor, encara que anem tendim a no parlar referent a això en aquest context. Així que ara anem a lligar aquests junts. Una setmana més enrere, presentem una mica d'HTML a la pàgina web súper avorrit esquerra-. [00:14:34] Només diu hola món. I llavors em vaig proposar a la dreta podem tipus de robar les idees a partir de la discussió de estructures de dades en C i pensar en com aquest jeràrquica llenguatge de marcat de l'esquerra podria ser elaborat o aplicat en la memòria com una estructura d'arbre real amb nodes i punters i aquest tipus de detalls. A la dreta, que anomenem que un document DOM-- Objecte Model-- que és just una forma elegant de dir arbre. [00:14:56] Ara, per què és això útil per a pensar-hi d'aquesta manera? Perquè ara amb JavaScript, perquè tenim codi que arriba a jugar en aquest medi ambient, l'HTML real que és estat enviat al navegador ja i ja té ha carregat en la memòria pel navegador en un arbre en el seu equip de RAM com aquest, podem utilitzar JavaScript per realment recórrer o caminar o recerca o canviar aquest arbre DOM però volem. Així que, de fet, si vostè pensa sobre facebook.com, si s'utilitza la funció de xat, si ús Gmail i la característica Gchat, res on has missatges que vénen una i altra vegada i de nou, aquests missatges són probablement, com, etiqueta LI, etiquetes llista d'elements, potser. [00:15:35] O potser són només divs que mantenen apareixent cada vegada que rebi un missatge instantani. I pel que només significa el que Facebook o Google està fent està cada vegada que aconseguir un missatge des del servidor, probablement estan utilitzant JavaScript que només ha d'afegir un altre node a aquest tree-- un altre node a aquesta arbre que llavors només es veu visualment com una nova línia de text a la pantalla. Però estan inserint en aquesta estructura de dades. [00:15:57] Així que en les classes com CS124 i altres, podràs en realitat escriure més codi contra estructures de dades com aquest. Però per ara en JavaScript, només haurem d'assumir tenim tota aquesta funcionalitat de forma gratuïta des del llenguatge mateix. Així que donem una ullada a un exemple. [00:16:09] Permetin-me obrir un fitxer anomenat form.html. És súper simple. Només es veu com aquest. [00:16:15] No CSS, sense pensar en l'estètica. És purament funcional i pel que sembla estic demanant un correu electrònic, una contrasenya, contrasenya de nou, i després un xec estar d'acord amb alguns dels termes i condicions. El que el codi font d'aquest sembla que és probablement alguna cosa es pot endevinar amb una mica de pensament ara. Tinc una etiqueta de formulari aquí. [00:16:32] Una acció aparentment es va a anar a un fitxer anomenat register.php. El mètode que utilitzaré és arribar. I després tinc un text camp el nom és de correu electrònic. [00:16:40] Tinc un camp de contrasenya el nom és la contrasenya. Tinc una altra camp de contrasenya el nom és la confirmació d'alguna cosa arbitràriament. És només un altre paràmetre HTTP. [00:16:49] I llavors nosaltres no hem utilitzat aquests excepció des dels missatges instantanis Frosh Demo en class-- una casella de verificació que està només tipus és igual a xec. I vaig a trucar a aquest acord. Així que he tipus de forma arbitrària, sinó convenientment anomenat aquests camps. Així que ara, quan aquesta forma aconsegueix presentat, anem a veure què passa. Si ho faig malan@harvard.edu, Vaig a fer una clau d'carmesí. Vaig a fer una contrasenya de res. No anem a cooperar. [00:17:10] I no vaig a marcar la casella. Permetin-me feu clic a Registrar. I diu, hm, que estiguis registrat. En realitat no. [00:17:16] Però l'URL canviar. Així que aquesta forma va ser clarament permès a sotmetre a register.php. Però és de suposar, que hauria de ser la captura d'alguns d'aquests errors. Ara, en Pset7 i alguns dels nostres exemples de conferències, tindríem generalment imprimir un gran missatge d'error vermell aquí dient, el nom que falta, o desapareguts contrasenya. Ho hem fet abans i que hem detecció d'errors del costat del servidor es faci. [00:17:37] No obstant això, molts llocs web en aquests dies fer la detecció d'errors en el client on l'URL no canvia. Tota la pàgina no s'actualitza. Vostè obté una resposta instantània des del navegador. Potser alguna cosa surt vermell. [00:17:48] Potser vostè aconsegueix una pop-up. Però no perdis temps enviant a el servidor de dades que és incompleta. Així que anem a veure com podem aconseguir aquesta característica també. [00:17:56] Déjame anar a form1.html, que té el mateix aspecte. Però si aquesta vegada ho faig malan@harvard.edu i escric carmesí i jo no coopero més però feu clic a Registre, compte ara. No és la solució més sexy. Almenys jo he agafat aquest error. I jo he fet servir l'alerta funció en JavaScript-- que només estem fent servir a classe. En general, vostè no ha d'utilitzar aquest ja que pot arribar molt ràpidament de control. Però contrasenyes no coincideixen és l'error. [00:18:19] Déjame anar endavant i feu clic a D'acord. Però el que el punt clau aquí és que la URL no va canviar. Emaciación Així que no he molestat hora del servidor demanant-li que una pregunta que jo pogués tenir descobert la resposta a mi mateix. [00:18:30] I l'usuari, encara que estat parlant d'això més llarg que l'usuari de pensarà en això, tindrà una resposta instantània. No hi ha latència amb la connexió de xarxes. Així que donem una ullada a aquest codi font. [00:18:40] Mirades form1.html estructuralment similar aquí. La forma és, de fet el mateix. Però anem a veure el que vaig fer aquí. I hi ha diferents maneres de fer això. I jo he fet el més recte seguidor, però no forma més elegant encara. Tinc una etiqueta de script. Llavors jo dic document.getElementById ("registre"). I guardo aquest valor en la forma, una variable. [00:19:04] Llavors, ¿què he fet? Vostè pot pensar en document.getElementById com una funció especial que JavaScript li dóna que les mans, literalment, que una punter a un dels nodes o rectangles en aquest arbre. Així que ara que és el que la nostra variable de formulari en JavaScript que realment està apuntant a. [00:19:21] Així que ara la sintaxi és diferent de C. Però ens estan fent algunes coses aquí. Un d'ells, aquest és una mica estrany buscant, sens dubte davant de C. Però mira la línia 35. Així que en el form.onsubmit esquerra. Recordem que és onsubmit com un camp d'una estructura. Si vostè pensa en la variable de formulari és simplement ser una estructura C, que podria tenir alguns camps. [00:19:42] De tornada en el dia, teníem noms dels estudiants, ID, cases, aquest tipus de camps. Només cal pensar en onsubmit com un altre camp. Però és un camp especial perquè el navegador està preprogramat per esperar .onsubmit a no ser un valor com un nombre o una cadena, però per ser realment una funció o la direcció d'una funció en la memòria de l'ordinador. [00:20:02] I, en efecte, això és el que aquesta paraula clau aquí és així. Això diu, dóna'm una nova funció. Però el que és el seu nom serà, pel que es veu? [00:20:09] Pensant en el dilluns. Quin és el nom d'aquesta funció basada en aquesta sintaxi? No, vull dir, no hi ha claredat sense nom associated-- dubte no en el que jo he destacat aquí. [00:20:21] Però això és en realitat a D'acord. Aquesta és una funció anònima, o un funció lambda com alguns podrien anomenar. I això només significa segueix sent una funció. És només que, no es pot dir pel seu nom. Però això està bé. Perquè de nou, el navegador ha estat programada per empreses com Google o Microsoft o Mozilla o altres persones a només sé que si el camp .onsubmit dins d'un element de formulari té el valor, el tracten com un function-- un punter a funció, si es vol. I dir-quan s'envia el formulari. [00:20:46] Llavors, ¿quin codi ha de ser executat quan s'envia el formulari? Pel que sembla, tot dins del claudàtor. I això és només estilística. [00:20:53] Vostè podria fer això com tendim a fer en CS50. Però en JavaScript, la majoria de persones tendeixen a mantenir-lo en la mateixa línia només perquè és més clarament és associada amb la funció de paraules clau. Així que ara el que estic fent? [00:21:03] Si és igual als iguals form.email.value la cadena buida o gens, aquí hi un avís en què vaig a dir, vostè ha de proporcionar la seva adreça de correu electrònic, i després tornar falsa. I és que la falsa retorn que impedeix que la manera de ser presentat. Mentrestant, si el valor de la contrasenya és en blanc, vaig a cridar a l'usuari i dir, ha de proporcionar una contrasenya. [00:21:21] Mentrestant, les coses són cada vegada una mica més de luxe aquí. Si no ho fa form.password.value igual form.confirmation.value, l'altre camp, cridar-li a l'usuari que les contrasenyes no coincideixen ja que no ho va fer fa un moment. I llavors aquest és un poc més sexy perquè Sé que sabia que conceptualment comprovat és el nom d'una caixa de xec. [00:21:40] Així que només puc utilitzar una exclamació punt de dir si el xec no és checked-- és la booleana valor, vertader o false-- Vaig a cridar a l'usuari per aquest motiu. En cas contrari, si aconseguim a través de totes aquestes condicions, anem a tornar realitat. Deixeu que envia el formulari. I això passarà a continuació. [00:21:56] Anem a escriure en carmesí. Anem xec de la caixa de text, feu clic a Registre. I ara me'n vaig fins a la destinació. Ara, no hi ha cap base de dades allà. No hi ha res interessant en register.php. Només necessitava alguna cosa de parlar amb. Així que permetin-me fer una pausa, aquí. Per a qualsevol dubte sobre el que acabem de fer o el que alguns d'aquesta nova sintaxi és? Acceptar, sí? [00:22:17] AUDIÈNCIA: Així que qualsevol casella és automàticament un booleà. No ha de declarar-ho així. [00:22:21] DAVID J. Malan: Correcte. Qualsevol casella de verificació que s'envia a vostè de un formulari HTML amb el codi JavaScript seran tractats, sí, com una Boole value-- vertader o fals. És una bona pregunta. Considerant que els altres valors, de Per descomptat, han estat el text, cadenes AKA. [00:22:36] Molt bé, així que em va deixar rebobinar una mica més lluny. Quin era el punt sencer d'això? Perquè quedi clar. De la mateixa manera, que ja sabem, fins i tot des Pset7 i fins i tot de la conferència de la setmana passada exemples, que, òbviament, podem comprovar $ _GET $ _POST Veure si l'usuari ens donen un valor buit. Recordeu que la funció de buit en PHP. [00:22:54] Així que per ser clars, el que és una raó per la qual també podria voler fer aquesta revisió d'errors dins del navegador? Quina és la motivació aquí? Sí. [00:23:06] AUDIÈNCIA: més ràpid, i no ho fa enviar dades inútils per al servidor. DAVID J. Malan: Good. És més ràpid. No envia inútil dades al servidor. [00:23:12] Perquè pugui obtenir de nou una més resposta immediata. I, en general, l'usuari experiència és millor. Penseu en l'alternativa. [00:23:17] Si per Gmail-- i estava el cas fa molts anys. Suposem que vostè té un nou correu electrònic de Gmail compte, però l'única manera a través a veure que és, igual que, recarregar tota la pàgina. O suposem que faci clic a un enllaç per llegir un correu electrònic. [00:23:29] Tot ha de recarregar tan que es pot veure l'adreça de correu electrònic. O Facebook-- s'obté un missatge de xat. No ho veu fins que es torni a carregar la pàgina o feu clic a algun enllaç. [00:23:36] De la mateixa manera, això seria una molt experiència de l'usuari molest. I això és el que era, clarament, l'esquena quan em vaig postular per a la unitat de competència i la banda era molt menys dinàmic i JavaScript no era tan popularitzat com ho és ara. I les coses estan molt més dinàmic i molt més costat del client en aquest sentit. [00:23:49] Però hi ha una trampa aquí, i aquesta és una espècie de Gotcha molest. El fet que s'afegeix al client detecció com això no vol dir pot o ha d'abandonar detecció del costat del servidor. Vostè essencialment vol posar el seu error comprovant en tots dos llocs. Perquè el que va ser un de la lliçó apresa de l'article que vaig llegir alguns extractes d'amb aquest estúpid system-- CMS Content Management System-- que era la implementació del seu sistema d'autenticació, la seva entrada a través de quin mecanisme? JavaScript. [00:24:20] AUDIÈNCIA: JavaScript. DAVID J. Malan: JavaScript, exactament, oi? S'estava fent servir JavaScript. I, literalment, vostès tenen jugat una mica, probablement, amb l'inspector de Chrome. I si me'l trobo, inspeccionar element. [00:24:30] Déjame anar a fer totes les opcions de Chrome. I això és el fàcil que és desactivar JavaScript en un navegador. Comprovi, no més de JavaScript. [00:24:38] Així que per ser justos, molts de la web en aquests dies només va a trencar, perquè Gmail i una altra sites-- Facebook-- assumir que JavaScript està habilitat. Però si vostè està fent alguna cosa estúpid com només la validació d'entrada dels usuaris i comprova si existeix errors en el costat del client, un adversari podria fàcilment fer això. I després encara més intel·ligent adversari com vostès ara podria utilitzar Telnet o Curl o comandaments de línia d'ordres només i en realitat enviar missatges al servidor que de la mateixa manera no exempts d'errors facturat. [00:25:05] Així que això és més d'un decisió interfície d'usuari del que és una tècnica real improvement-- implementació costat client alguna cosa com això. Així que ara una ràpida mirada, però després Et remeto a la caminada en línia a través d'aquest. En forma de dos, de fet vam anar a través de i netejar el codi una mica. Però permetin-me remeto a 01:00 dels vídeos probable que anem a Inserir en Pset8 que només mostra una sintaxi similar usant una biblioteca anomenada jQuery, que és un super, super biblioteca popular en JavaScript que francament la majoria de la gent només ha d'utilitzar en aquests dies i fins i tot confondre com propi benestar JavaScript. [00:25:37] I tendeix a involucrar alguns signes de dòlar i paraules clau com a document en parèntesi aquí. Però, de nou, deixa remeto a alguns tutorials més lentes en línia en lloc de veure obligats a realitzar només la sintaxi. Anem a passar a cosa una mica més fresc pel que fa a les aplicacions d'aquest. [00:25:50] Així, en particular, que em deixi anar per davant i obrir aquesta aquí. Vingui. Cal anar. [00:25:59] Permetin-me obrir aquest quadre aquí. Innecessàriament complicat mirant, però descriu una tècnica anomenada AJAX-- Asynchronous JavaScript i XML, on X per l'XML és en realitat ja no s'utilitza realment. Tendeix a usar alguna cosa un altre anomenat JSON. [00:26:13] Però aquí és com una mena de Google Maps o Google Earth funciona. Anem a provar això sobre la marxa, en realitat. Déjame anar per davant i obro Chrome al navegador. [00:26:21] I m'ho dius a mi anar a, dir, maps.google.com. I, de fet, si vostè és vell Només cal recordar el que, com, MapQuest era com tornar en el dia, i potser encara funcionen així. Quan t'acostumes a buscar alguna cosa-- 33 Oxford Street, Cambridge, Massachusetts, farem esto-- vostè faria realitat, si vostè volia a la paella i a baix, esquerra i dreta, que es veuria com un gran fletxa a la part superior, i se li mostrarà altre marc del mapa aquí. O hauria de fer clic a l'esquerra i vostè aniria per aquí, o un altre clic i va a anar per aquí. Però en comptes aquests dies, per descomptat, només donen per fet que podem anar al voltant de Cambridge amb força rapidesa simplement fent clic i arrossegant. Però Tingueu en compte que hi ha alguns problemes tècnics. [00:26:59] Si faig això prou ràpid, el que sembla estar succeint com arrossego una mica massa ràpid per a l'equip per mantenir-se al dia? Què és el que veus? Sí. [00:27:07] AUDIÈNCIA: Els píxels no s'actualitzen. DAVID J. Malan: La píxels no s'actualitzen. Hi ha actually-- i vostè podria veure això, en realitat, si estàs veient en línia i pausa aquest o en realitat alenteix les coses per vegada-- veuràs que hi ha rajoles, quadrats, o rectangles que falten al mapa fins una fracció de segon més tard, més dades, més imatges de realitat apareixerà a la pantalla. I de fet, si fem això mirant fins Chrome's-- diguem, Chrome-- anem a veure. No podem fer això. [00:27:31] Oh, crits. Obrirem maps.google.com. Permetin-me fer la finestra més gran de nou. [00:27:36] Tornar als 33 Oxford Street. Quin va ser el lloc web estava en recentment? Vaig tenir aquesta, com, diatriba privat a a mi mateix que jo havia missatge instantani a continuació qualsevol amic que estava en línia qui volia escoltar-lo. Hi ha una mica de lloc web. Crec que és tan Comcast-- un ISP americà molt gran. Pot, al registrar-se nou cable servei de mòdem o el servei de TV per cable, que tenen una forma molt raonable on se li demanarà la vostra adreça. I tenir aquesta increïble característica anomenada completa d'automòbils, com Google, que comença a omplir en la resposta a la seva pregunta. [00:28:04] El problema és, que fan d'autocompletat sobre les primeres coses que vostè escriu. Així que si vostè comença a escriure en el 33, que mostrarà literalment cada casa als Estats Units que comença amb el número 33 abans de continuar esperes que escrigui més. Així que si escriu 33 Oxford, a continuació et mostra tots els carrers als Estats Units que té 33 a Oxford el seu nom, amb independència de la ciutat que vostè està en. [00:28:25] I després continua escrivint. I, finalment, s'adona que no ho fan oferta de servei a casa a Cambridge o alguna cosa per l'estil. Però el punt és, aquesta és la més aplicació asnal d'auto completar mai. [00:28:34] I jo només vaig fora en aquesta tangent de nou. Però hi ha bones maneres a utilitzar JavaScript i males maneres. I això no és necessàriament la millor. [00:28:40] Però el punt aquí, abans que aquesta diatriba, va anar a obrir les eines aquí i obrir les eines de desenvolupament, com hem encoratjats abans, i per veure la Xarxa fitxa com faig clic molt ràpid. I notar un munt d'obtenir sol·licituds succeir. Tot això va succeir des que em vaig arrossegar. [00:28:57] I el més probable, de fet, una gran quantitat d'aquestes files ara són la imatge de frega JPEG Tipus MIME o tipus de contingut. Això es deu al que està fent crom cada vegada que feu clic i arrossegueu, feu clic a i arrossegament, és És adonar-se, oh, d'anar demanar a Google per la rajola en el mapa que ha acabat aquí, descarregar ràpidament a través d'HTTP, i després afegir-lo a la crida DOM als navegadors web en l'arbre de memòria la representació de manera que l'usuari, mi, veu que rajola actualitzat. I això es deu a una tècnica anomenada AJAX. De tornada al dia, el que realment era el cas que si volia canviar el que està a la pantalla, vostè hauria de fer clic a dalt, a baix, esquerra, dreta. I a continuació, una nova pàgina s'obriria. Però en aquests dies, tot és més dinàmic. Succeeix en la forma en què els éssers humans ho faria espero que realment ho faria de forma interactiva. I ho aconsegueix mitjançant la mitjà d'una tècnica anomenada AJAX, que és potser el més explicat amb un exemple. En primer lloc, deixa anar per davant i obrir un arxiu anomenat quote.php a codi de distribució d'avui. [00:29:53] I llavors m'ho dius a mi fer crits symbol--. Déjame fer símbol = GOOG per només una mica de brou. O en realitat, farem la 1 del joc de paràmetres GRATIS. Retorn. [00:30:05] I ara noto el que jo torni. Així que això és realment un arxiu PHP curt que jo va escriure que simplement pren prestat codi de la funció de recerca de Pset7 i escup l'ús d'aquesta clau de i cites i notació de còlon, pel que sembla, preu de l'acció actual de la empresa que es passa enmig de get. Així que això és diferent de la major part del que hem fet en aquesta nota que sóc literalment escopint el que sembla ser el codi JavaScript. [00:30:27] De fet, aquest és un objecte de JavaScript. De fet, només per ser més clar, JavaScript Object Notation-- JSON-- és només una forma elegant de dir que poden representar dades en JavaScript molt com es fa en PHP utilitzant parells de valors clau. Així que si volia declarar una variable en JavaScript a representa Zamyla, per instance-- una estructura per Zamyla-- i ho anem a cridar estudiant, aquesta variable. La seva identificació és un, la casa està Winthrop, i el nom és Zamyla. [00:30:53] Però també puc tenir una matriu d'objectes. Així que si jo realment volia tenir una matriu en JavaScript que conté múltiples aquests objectes, aquesta temps que representa el personal, Jo podria tenir aquests tres trossos de codi d'esquena de nou a l'esquena d'aquests tres ex funcionaris. Així que la sintaxi, bastant similar a ambdós-- a PHP. Però això és particularment JavaScript. És notació objecte. Llavors, ¿què és això útil per? [00:31:17] Si escric codi que escup cap a fora JSON-- JavaScript Object Notation-- coses que s'assembla a això o coses que s'assembla a l'estructura de Zamyla, De fet, em puc fer servir aquesta en els programes que escric. Déjame anar a ajax0.html. I això també- no gaire pensament donat a l'estètica. Però observin el que passa. [00:31:34] Déjame anar endavant i escric gratis aquí. Feu clic a Obtenir cotització. I noti la URL no ha canviat. Però em va fer arribar un pop-up amb aparentment d'avui cèntim preu de l'acció de US $ 0,15. Així que no tot és tan dolent. Però la diferència és que d'alguna manera, aquestes dades va tornar a mi directament. Però anem a fer un pas cap a una mica més familiar. En la versió un això, permetin-me escrigui lliure de nou, feu clic a Obtenir pressupost, i ara-- oh, això era en realitat la versió de jQuery. Així que no ho vaig fer me-- avanç ràpid bastant prou lluny. Déjame anar a la versió 2, que és on jo volia. Noti el que he fet aquí. Tinc una web page-- un super versió simple de qualsevol pàgina web vostè pot utilitzar avui en dia amb un camp de text aquí de forma gratuïta i després pel que sembla només text. [00:32:14] Això no és una forma aquí, aparentment. Però si faig clic obtinc pressupost, compte de la meva pàgina web està a punt de canviar, com si jo acaba de rebre un nou missatge instantani o com si m'acabo de mudar la el mapa i la necessària per obtenir més dades afegit de forma dinàmica a la pàgina web sense el canvi d'URL i l'usuari experiència sent interromput. De fet, encara estic en el exactament el mateix ajax2.html lloc--. [00:32:35] Així que anem a veure només en aquest exemple i veure com això està succeint. Déjame anar a ajax2.html. I noti la forma en primer lloc. [00:32:44] Aquí sota, m'estic convertint fora de completat automàtic. A vegades es posa molest si el navegador està tractant de mostrar tota la seva història. Així que vostè pot fer-ho en HTML només dir autocompletat apagat. [00:32:53] He donat aquest camp de text 1 symbol-- més aviat, un ID de símbol. I ara, aquesta és una característica interessant. No hem parlat sobre lapse, però es pot pensar-hi com una etiqueta de paràgraf o etiqueta div. És el que es diu un element en línia, que vol dir que no obtindrà un paràgraf trencar per sobre i per sota d'ella. És només va a romandre en línia sense colpejar l'equivalent a entrar. Així que m'he donat a aquest tros d'HTML s'ha de determinar un identificador únic que arbitràriament vaig trucar preu. I tinc un botó Enviar. [00:33:21] Perquè ara fins aquí-- i això és realment súper increïble el poc codi vostè pot escriure que fer relativament net coses-- adonar-se del que he fet fins aquí si vos fins al cap d'aquesta pàgina. He inclòs per primera vegada en meu cap una etiqueta de script que fa referència a una realitat Arxiu JavaScript en altres parts. Això és de l'organització que escriu jQuery, I això és només que li dóna l'última versió de la seva llibreria jQuery. [00:33:42] Així que això és una cosa així com agut incloure en C o requerir en PHP. S'utilitza l'etiqueta script amb un atribut d'origen. Però ara el meu propi codi és estarà bé aquí. [00:33:52] Noti que tinc una funció anomenada Cotitzacions. I sembla una mica críptica a primera vista. Però anem a burlen d'aquesta separació. Dóna'm una variable anomenada URL. Assignar literalment aquesta cadena. Així, cites individuals, dobles cometes en JavaScript només em dóna una cadena. Què fa el més? La concatenació. [00:34:08] Així que això ara és la sintaxi de jQuery que pren una mica de temps per acostumar. Però això només vol dir anar a buscar el DOM node amb identificador únic és símbol. El hashtag no significa símbol identificador únic. [00:34:21] El signe de dòlar en el Els parèntesis només significa, acabar amb això jQuery en una mena de salsa secreta de manera vostè aconsegueix una funcionalitat addicional. I després .VAL és aparentment una funció, o com es diu ara, un mètode en l'interior d'aquest node que només li dóna el valor. Així que en resum, lleig i confús ja que això es veu a primera vista, això només significa arribar amb l'usuari va escriure en, el va posar al final de la cadena mitjançant la concatenació d'ella. Això és tot. [00:34:43] Així que ara, tres últimes línies. Vostè pot esprémer una gran quantitat de funcionalitat de cada tres línies. Aquest signe de dòlar, com una a un costat, és només un sobrenom per a una variable global especial anomenat literalment jQuery. [00:34:55] Signe de dòlar només es veu bé. Així que la comunitat jQuery només tipus del que va usar com el seu símbol especial. No significa el que significa en PHP. En JavaScript, mostra de dòlar és de la mateixa manera que una lletra de l'alfabet o un nombre per a una variable. [00:35:07] Vostè només pot tenir com el nom. Només es veu bé. Així la comunitat adoptat com un sobrenom per la seva pròpia biblioteca anomenada jQuery. [00:35:13] I és súper popular. Així que aconseguir JSON és exactament això. És una funció que la gent de jQuery escriure que pateix és JSON d'un server-- JavaScript Object Notation. Pel que l'URL és que va per obtenir aquesta informació? Pel que sembla, des d'aquest URL aquí. [00:35:27] I què ha de fer el navegador com aviat com es posa de nou aquesta resposta? I aquesta és la màgia d'AJAX, per la qual cosa speak-- Asynchronous JavaScript en XML. És difícil veure per tal exemple senzill, ja que teníem aquí. [00:35:41] Però això va ser asincrònica a el sentit que el meu codi quan executat enviat un missatge al servidor per anar a buscar una mica de JSON. I va succeir molt ràpid que em van donar una resposta. Però el que és interessant és que aquest línia de codi no pengi el meu equip. [00:35:55] Jo no veig una icona de la filatura. No vaig perdre el capacitat de moure el ratolí. El meu navegador realitat era perfectament bé. [00:36:01] A causa de la manera maneja el JavaScript resposta del servidor és el següent. Vostè es registra el que es diu una funció de devolució de trucada, que només vol dir, bé, JavaScript. Tan aviat com el servidor respon amb JSON, si us plau trucar a aquesta funció anònima. [00:36:18] I si us plau, passar a aquesta funció qualsevol que sigui la cadena de servidor escopir com un argument anomenat dades. En altres, paraules, si Estic acoblar dinàmicament quote.php una URL que passa en aquest símbol com GRATIS o GOOG o el que sigui, Llavors jo dic JavaScript anar a buscar aquesta URL. Recordeu que el navegador va a tornar alguna cosa que es veu com hem vist abans els vaig parlar d'això. [00:36:42] I el que el segon argument aquí per aconseguir JSON està dient es digui a aquesta funció quan el servidor torni si es tracta de 10 milisegons a partir d'ara o 10 segons a partir d'ara. I tan aviat com vostè ho fa, afegir el preu a la pàgina. Aquesta sintaxi aquí només significa anar a buscar el node de l'arbre l'únic identificador és preu-- aquest lapse hem vist anteriorment. [00:37:01] Aquest mètode anomenat HTML només diu, vaja reemplaçar el codi HTML que hi és amb data.price. Què hi ha data.price? Bé, el navegador, recordar, em va mostrar aquesta tornant. Així que aquests són les dades. [00:37:14] I el que és una mica críptic per veure les comes aquí. Però, de fet, deixa fer això. Permetin-me enganxa aquest molt ràpid en gedit i mostrar això com vam demostrar L'estructura de Zamyla abans. [00:37:27] El que el servidor envia de tornada és una petit objecte que s'assembla a això. I així és data.price m'acaba de donar a 0,1515. Així que una gran quantitat de moviment parts aquí tots alhora. [00:37:39] Però els robatoris de pilota clau és que tenim aquesta capacitat per fer HTTP addicional peticions utilitzant JavaScript sense haver de recarregar la pàgina. I llavors podem realment canviar la pàgina web sobre la marxa. I resulta que JavaScript i altres llenguatges es pot utilitzar ara no només mutar pàgines web, però en realitat per escriure programari en un equip real, no només es limita a Chrome o similars. [00:38:00] De fet, si: Colton, oi agradaria unir-se a nosaltres de nou per aquí amb el seu codi de laboratori, i Chang també? Seguirem endavant, després d'haver parlat de funcions anònimes i devolucions de trucada i realment temptar la sort aquí amb una demostració en viu amb sagnat tecnologia de punta, una de aquests dispositius Elite moviment. Ara, aquest dispositiu, el record, és un petit dispositiu USB així que-- això és beautiful-- que es connecta als ports USB. [00:38:25] I llavors es proporciona l'entrada en forma de gestos humans mitjançant la detecció de raigs infrarojos utilitzant, essencialment, els moviments del seu braç. Així que mentre que el que Maria va intentar abans era muscular, realment sentir el que està canviant el braç, això és infraroig basat. Per tant, està buscant els moviments dins de l'espècie d'esfera d'un peu més o menys del propi dispositiu. [00:38:46] Llavors, ¿per què no em prenc una punyalada en aquesta primera? I seguirem endavant i tirar per amunt a la sobrecàrrega aquí. Així que anem a posar el portàtil de Colton fins aquí. Tenim Andrew a la televisió. I què li agradaria que fes primer? [00:39:00] COLTON: Vagi per davant i just posar les mans sobre aquest home i vostè veurà una certa brillantor fabulós. [00:39:04] DAVID J. Malan: Very nice. Tot això succeeix en temps real. Okay. Molt bé, i si. Tan agradable. Molt bé, ¿què més podem fer? [00:39:15] COLTON: Anar a la següent pantalla i veure. [00:39:17] DAVID J. Malan: D'acord. [00:39:19] COLTON: Un petit joc on s'arriba a fer robots. [00:39:21] DAVID J. Malan: Molt bé, de manera que aquest és fals mans em mostren el que ha de fer. COLTON: Sí Així que endavant i apoderar-se d'un dels blocs i el va posar a la part superior del cos d'aquest robot. DAVID J. Malan: Oh, aquí està la meva mà. Oh. Acceptar, adorable. Espera un minut, a D'acord. Cal anar. [00:39:41] COLTON: Vaig fer un en accident. [00:39:43] DAVID J. Malan: OK, vaig a aconseguir aquest tipus. Maleïda sigui! Quan estàvem practicant aquesta última nit, ja saps el que això va degenerar en? [00:39:51] Com aquest. Okay. Següent un? [00:39:55] COLTON: És clar. [00:39:56] DAVID J. Malan: Molt bé, i hi ha una tercera. Bé. COLTON: I en aquest, s'obté A-- DAVID J. Malan: Oh, de bella aquest. COLTON: --yeah, esmicolar aquesta flor. DAVID J. Malan: OK. No? Perdudes. [00:40:14] COLTON: Oh, aquí ho tens. [00:40:15] DAVID J. Malan: Ah, mira això. Molt agradable. Bé, per què no 'prenem a terme un voluntari aquí que li agradaria venir a endavant. Què hi ha allà mateix en el verd, no? [00:40:27] Molt bé, i anem a tener-- en lloc de fer això, alguns de vostès podrien saber aquest joc aquí-- tallar la corda, potser? Anem a veure. Tenim les nostres copes per aquí? [00:40:37] Okay. Gràcies. Quin és el teu nom? [00:40:39] AUDIÈNCIA: Laura. [00:40:40] DAVID J. Malan: Laura? És bo veure. Si no t'importa posar Google Glass sobre les seves lents. Això és Colton. [00:40:46] COLTON: Hola. Encantada de conèixer-te. [00:40:48] DAVID J. Malan: OK, anem voltant. Molt bé, així que el que vas a fer aquí, després d'haver jugat això abans, es posa la mà sobre el Leap Motion aquí. I ara la seva fletxa s'ha de moure. Ah, doncs no. [00:40:57] AUDIÈNCIA: No. [00:40:58] DAVID J. Malan: Nosaltres no volen deixar de fumar encara. Acceptar, esperi. Per aquí. Així explica com vostè sosté la seva dit sobre alguna cosa, el ratolí comença a anar verd, que és com es fa clic. [00:41:06] Així que hi ha sobre Play. I només un dit està molt bé. I ara, feu clic a la petita home verd de l'esquerra. I ara tenen fins que s'omple de verd. Bé. Ara, de la mateixa manera que, el nivell un a la superior. [00:41:16] AUDIÈNCIA: Sí, volem que el nivell un, aquí. [00:41:20] DAVID J. Malan: Good. OK, així que tot el que tens de fer és tallar la corda. El cursor és la blanca allà baix. [00:41:28] Molt agradable. Molt bé, es tracta d'aconseguir més difícil. Així que mantenir el dit sobre el proper ara. Bé. Aquest és difícil. [00:41:39] AUDIÈNCIA: Oh merda. Okay. Es vol anar d'aquesta manera. Oh merda, que-- [00:41:44] DAVID J. Malan: Sí. Meta secundària és aconseguir totes les estrelles. D'acord, següent. [00:41:53] Anem a veure si vostè pot aconseguir aquest tercer. Bé. Acceptar, anar-hi. [00:42:06] És clar. Oh, molt agradable. Bé. [00:42:11] Llavors, ¿per què no aixecar la sessió aquí avui? Que ningú vingui a qui vol jugar. Moltes gràcies a la Laura la nostra voluntària. I ens veurem dilluns. [00:42:18] AUDIÈNCIA: Vostè probablement voldrà aquests esquena. [00:42:21] ALTAVEU 2: En el següent CS50--