ROGER ZURAWICKI: Tere kõigile. Kas ma saan oma tähelepanu? Aitäh, poisid. Täna ma tahan rääkida Meteor. On JavaScript raamistik. Me lähen läbi, kuidas saate teha lahedaid web apps. 

Enne kui me sattuda JavaScript, ma lihtsalt tahan öelda, et te, et see tuleb - sul on hiljem tükk see semester. See peaks olema umbes JavaScript. Ma arvan, et [kuuldamatu] on esimene kavatse katta web HTML PHP värk, enne kui me liikuda JavaScript. Ja CS50, JavaScript peetakse nagu kliendi kood. Nii et ainult saab sõidetud veebibrauser. 

Kuid tänu viimastel edusammud tehnoloogia, oleme nüüd suutnud joosta JavaScript server samuti. Nii et see on loonud väga lahe raamistikus, kuna nüüd saab kirjutada seaduslikult sama kood klient ja server. Ja kui sa määratleda funktsioonide server, teie klient võib helistada neile samad funktsioonid. Ja see muudab palju lihtsamaks. Kui enne, kui te kasutate PHP server, JavaScript esiküljel lõpus, siis on vaja kirjutada PHP funktsiooni ja siis JavaScript versioon Sama funktsioon teha sama töö. 

Nii et enne kui me Alustamiseks, tahaksin näidata demo, mida Meteor teha saab. Ma näitan sulle, demo, mis on see, mis sa pead olema võimeline looma poolt lõpuks see seminar. Me lihtsalt minema siit. See on Leaderboard app. See on tegelikult põhineb välja näiteks et Meteor annab. 

Meteor on väga tore, sest kui sa paigaldada see paketina, saate põhimõtteliselt mängida Nende nelja demos. Ja edetabelit Esimene neist demos. Pärast seminari, ma kutsun teid kõiki lihtsalt uurida teisi demos sest ma arvan, et nad on tõesti lahe, ja nad näitavad sulle võimu Meteor. 

Mis see on, see on majutatud edetabel. See on lihtsalt öeldes nimistuga. Ja saate valida inimesi. Nad muutuvad kollaseks. Ja siis saab anda neid viis punkti. Ja sa märkad, et nimekiri on Sorteeritud sest ma annan endale rohkem ja rohkem punkte, ma olen nüüd üleval. Nii et see on koht, kus me hakkame. 

Ja mida sa pead olema võimeline ära võtta selle seminar on veel mõned funktsioone I lisanud edetabel. Uurime, mis hõlmavad kuidas, samuti lisada viis punkti, et mängija, saame kustutada mängijaid, võime lisada uusi mängijaid, ja me saame valida, kuidas me tahame neid sorteerida. Ja kõik need on väga lihtne API kõned et Meteor pakub teile. Sul on ka funktsioon siin randomiseerida hinded. 

Mis on väga lahe selle on kutid saavad tegelikult kõik saidile minna. Ma panen selle suurem tekst siin. One-radikaalne-plii erboard.meteor.com. Ja kui te lähete saidi, siis peaks olema võimalik muuta ala ja kõik oma muudatused on nähtav et kõik teised. Nii saab - kas te olete kõik võimalik ühendada saidile? Nii mängi sellega. Mine ja alustada kustutamist mõned nimed. Vaata mis juhtub. 

Nii et näete igaüks saab mängida. See on lihtsalt default turvalisus režiim Meteor. Sa näed, et kõik saaksid muuta üksteise andmeid. Ära muretse. Meteor ei ole turvalisust. See on väga lihtne rakendada funktsioon, kuhu võiks luua kasutajatele ja sisselogimise. Aga praegu keegi, kes külastab sait ei anna ennast nii palju märgib, nagu nad tahavad. Nii et ma alati niimoodi, sest see on lõbus viis, et alustada. Ja siis me lihtsalt rääkida üksikasjadest, kuidas Meteor teeb selle võimalikuks. 

Ma lähen, et katta mis Meteor on ja siis me lihtsalt vaja, et katta kaks eeltingimust, et CS50 ei hõlma piisavalt. Aga lõpuks sõna, siis tuleb olla rahul nii HTML ja JavaScript tõesti käed määrdunud töötavad Meteor. Ja ma arvan, et see on lihtsalt suurepärane võimalus isegi vähem mugav õpilastel teha lõplik projekte, sest nad saavad tegelikult viibida üks keel, ja nad saavad näha muutusi oma kohe tööle. 

Nii et see slaidiprogrammi vaid mõned olulist tehnoloogiat, et Meteor JS annab teile. Meteor ei ole uus tehnoloogia omal. See on tõesti kuhi kõik need erinevad asjad meil internet. Samuti HTML, CSS, JavaScript, me mõned tehnoloogiad, nagu Node.js, mis on see, mis võimaldab käivitada JavaScript lõppfaasi oma server, samuti mõned JavaScript raamatukogud, nagu jQuery, alljoon. 

Kõik need on tuttav sa lõpuks semester. Ja meil on ka saada kasutada andmebaasi kutsus Mongodb, mis on tegelikult populaarne andmebaasi nüüd Nende uute alustavatel. Sa ei mõtle seda nagu MySQL, kuid see toimib väga kenasti JavaScript. Ja seal on mõned teised tehnoloogiad siin ja palju rohkem ma ei ole loetletud et kõik interface tõesti kenasti Meteor. 

Ma pean panema selle slide sest mõnikord ma saan segadust selle kohta. Meteor on ainult JavaScript. See ei ole PHP. See ei Ruby on Rails. Nii et kui sa kirjutad koodi, kui soovite kirjuta Meteor projekti, siis tõesti ei saa kasutada Ruby koodi. Sa tõesti ei kasuta PHP. 

Kuigi me näeme, et erinevused kood ja süntaks ei pruugi olla, et erinevad, ma tahan rõhutada, et teile, et Meteor, kõike kood on ainult JavaScript. Ja kõike, mida näidata kasutaja saab HTML CSS. Aga sa ei ole tegelikult kasutavad mõnda teistesse keeltesse, et teisi seminarid võiksid katta. Mida Meteor ka on, on veebiserver. Nii et isegi kui sa ei ole üldse JavaScript ja tahad lihtsalt teenida CSS ja HTML-faile, Meteor saab teha, et teie jaoks. 

Ja siin on link uuesti demo, et sain teiega hakkas mängima koos. Kuid olgem liikuda HTML. Kui palju inimesi siin on ei tea, mida HTML on? OK suur. Ja see on täiesti korras. Sa tõesti ei pea teadma, palju sest me läheme üle kasutamine väga lihtsalt. 

See on see, mida lihtne HTML lehekülg välja näeb. See võib olla nagu su tere maailma HTML, arvestades, et me algas C hello, world. Ma ei taha, et sa rõhku üksikasjad, mida HTML, mida head, mida organ, mis pealkiri seal teed. Ma tahan rõhutada, struktuuri, kuidas teil on märksõnad. Ja see on nurksulud. Ja see, kui teil on teie kirjeldused. 

Nii võite olla HTML dokument. Ja siis saate sulgeda HTML dokument koos kurakriips sama asi. Ja sul on erinevaid koode. Ja teate, mis nad kõik kokku sobitada. Sul on nagu body ja seejärel lähedal body. Ja sees body, et tulen sisu oma veebilehel. Nii et see veebileht lihtsalt kuvada valge taust ja must tekst hello, world. Kas see on mõistlik? OK. 

Nüüd ma lähen kiiresti katta JavaScript. Sõnu eelmine TF, "JavaScript on parim programmeerimine keel praegu olemas. Teised inimesed üritavad öelda teisiti. Nad eksivad. "JavaScript on päris kena, ja ma näitan teile, miks. 

Nii et see on klassikaline näide hakkame In C. Meil ​​hello, world. Ja te teate, et isegi kui sa kahaneb see, mida sa pead olema vähemalt kaks rida koodi siin. Mul on mitu rida koodi. Seda saab teha väga lihtsalt. Üks rida JavaScripti console.log, ja siis oma string, hello, world. 

Nüüd, kuigi me liigume uude keel JavaScript, peaaegu kõik oskusi, mida olete õppinud, kodeerimine C on otseselt kantavad. Nii stringid, idee stringid jutumärgid, et see on sama. Semikoolon, et see on sama. 

Puhas funktsioon umbes JavaScript tegelikult on see, et sa ei pea semikooloniga. See võib arvata, et sa peaksid pane semikoolon seal. Kuid seda öelnud, siis tuleb alati proovida panna oma semikoolonit seal. Seda peetakse heaks tooniks. Ja ka seal ei ole peamine funktsioon. Sa lihtsalt alustada ülaosas faili ja lugeda asju rida realt. 

Siis on, mida ta võtab, et muuta et hello, world programm. Ja siis märkate, et teil on teha tere ja siis joosta tere. Javascripti, see peetakse tõlgendada keeles. Mida sa pead teadma, on see, et puudub tegemisel. 

Pole kompileerida. Sa lihtsalt käivitada sõlme. Ja pidage meeles, sõlm on programm, mis kestab Teie JavaScript konsoolile, musta kasti, mitte veebilehel. Nii et sa lihtsalt anna see fail ja see on trükkimineku hello, world. 

Ma tõesti veidi demo et kutid on siin. Lähme üle minu Node.js terminal. OK. Liigume siin. Nii et ma hakkan sõlme. Ja ma näitan teile, poisid lihtsalt sec, kuidas seda installitud, kui sa seda ei tee. Las ma teen selle veidi suuremaks. OK. Ma loodan, et te ei näe. 

Ma võin kirjutada koodi nagu mina tegin varem console.log. Tere, Roger. Ja teate ma ei pea tegema semikoolon, aga siis ma saan seda imelik määratlemata asi. Noh tegelikult, rääkimata umbes määratlemata asi. Asjad mida ma tahan, et te teate, et teil ei pea põhiülesanne siin et hakatakse kood. Ja pole kurakriips lõppu. Seal on mõned vähe funktsioone, mis JavaScript teha saab. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Oh yeah. Mul on kahju sellest. Ja et nool tähendab lihtsalt sõlme on valmis uueks kapteniks. Nii et sa saad selle teha lihtsaid matemaatika, nagu 1 + 1. Ja just nagu C, need matemaatika sümbolid on lihtsalt sama. Ma võin teha console.log mitmeid. Ja siis ta trükib kaks. JavaScript on tore selles mõttes, sest kuigi kaks on int, nagu C, kui sa printf koos kaks, siis oleks saanud viga. 

Aga JavaScript teab, oh, sa oled trükkimine midagi. Ma vajan string. Nii et lubage mul teisendada, et kaks string teile. Ja sa võid ka teha mingi imelik värk nagu tere ja siis pluss kaks. See on vaid üks näide, kuidas kaks saab ümber seal hästi. 

Nii et tee pealt, lähme lihtsalt katta veidi JavaScript. Nii C meil tüübid. Kui me loodud uus muutuja, me pean ütlema, et see on see char * või string puhul CS50. Või kui meil oli kümnendmurruna pidime ütlema float. Kui meil on vaja Loogiline, pidime ütlema b. Ja siis, kui meil on midagi, mis aastal B-ta pidi jääma bool. Me ei võluväel muuta selle int kui me kirjutas sulgudes, int b. 

JavaScript puuduvad tüübid. Sa arvad, et see nagu var. Ja var on, kuidas luua uut tüüpi. Nii et see võib olla var s on string, var n on float, ja var b on tõsi. Ja üks asi, mida sa teha ei saa C on Ma võin nüüd öelda, pärast seda joont, b võrdub täisarv. Ja see töötab just fine. Arvestades, C, siis ütleksin, nagu oma täisarv ei ole tõeväärtus. Ma ei saa seda teile. Või [kuuldamatu] oleks visata viga. 

Ja ma ei saa kiiresti tagasi minema sõlm ja näitavad mõned, et funktsionaalsust. Ma võin olla var. Nimetagem seda "Apple". Nüüd, kui ma printida, Ma saan string, "Apple". Aga ma ei ka nüüd öelda võrdub 3. Ja teate pole viga. Ja nüüd on võrdne 3. Küsimusi nii palju? Jah. 

Publik: Oota, console.log on põhimõtteliselt printf, eks? 

ROGER ZURAWICKI: Console.log on oma printf. 

Publik: Õigus. Niisiis, kuidas tulla, kui sa lihtsalt kirjuta kaheksa või [kuuldamatu] mida see [Kuuldamatu]? 

ROGER ZURAWICKI: Õigus. Nii see on - kraami roheline saab trükitud konsoolile. Ja mida me näeme, on järgmisena kui astume web lehekülg, siis me ei tee - JavaScript saab võttes HTML template, mis ma katta Meteor osa seminar. Ja see, kui sa ei saa öelda, anna mulle väärtus, ja see paneb sisse oma veebilehel. Sest iga veebibrauser tegelikult on väike konsool. Ja kui sa vaatasid väga hoolikalt, siis oleks saada mõned andmed, nagu oma printf tekkimise-seal iga veebilehe te laadida. 

Publik: Kuidas sa kest ekraani? 

ROGER ZURAWICKI: Nii et käsk nimetatakse sõlme, ja see on kaasas Meteor. Nii et ma lihtsalt loobuda sealt välja. Sõlme on programm, mis jookseb JavaScript. Kui te lähete meteor.com, siis saab installida Meteor ja Meteor kaasas sõlme. Kuna Meteor on lihtsalt kogumik kõik need paketid. Millal saame meie näide, ma kõndida kaudu kõigile paigaldus Meteor ja siis saab mängida lümfisõlm ise. OK, tore. 

Nii teine ​​hea omadus töötamise kohta JavaScript on silmad on samad. Päris palju täpselt sama. Sest silmad, samas silmuseid, tee samas silmuseid, kui muidu. See kõik on sama traksid. See on sama süntaksit. Juhul silmus, vähe detail, et sa pead pöörama tähelepanu et on selle asemel, et int i on 0, meil öelda var i on 0. Aga see on, sest muutujaid liigid, mis me rääkisime varem. 

Pange tähele, et printf muutub Logi console.log. Ja me ei pea tegema protsenti p kurakriips n ja siis liigu i. Sa võid öelda, et ma. Ja see oleks printida numbrid nullist neljani. Kui te tahate, et proovida seda, sest sa tõid hea punkt. Kui sa tahad teha selle koodi oma oma brauseri, ma soovitaks, et igaüks avab Google Chrome. Google Chrome või veebibrauser tõesti, aga mulle meeldib Google Chrome sest see on väga standardiseeritud. 

Võite minna, ma usun, et kui sa õige kliki tahes veebilehel, igaks valge ruum, näete valik nimetatakse Kontrollige element. See on tavaliselt viimane. Ja kui sellel klõpsata, siis peaks saama asi alt ilmuvad siin. Las ma suumida siin. Ja meil on mõned klapid siin. Üks hoolid on konsool. 

Ja see on JavaScript konsool et nüüd on võimalik töötada. Suur. Nii et ma ei kirjuta sama värk Olin kirjutades varem sõlme. Üks pluss üks on kaks. Var võrdub "Apple". Ja siis ma printida, ja on "Apple". Nii tahes veebibrauser, Firefox, Chrome, Safari, mida iganes sa kasutada, kui Niikaua kui teil on juurdepääs JavaScript konsool, sama liiki koodi ma jooksin sõlme sa saab sõita oma konsooli. 

Publik: [kuuldamatu]? 

ROGER ZURAWICKI: kuidas saada konsool? Sa pead paremklõps tühja ruumi lehel, ja siis minna Kontrollige element. Seega tegelikult ma tahaksin, et te lihtsalt veendumaks, et sa ei Kontrollige element Chrome. Ja vaata, kui sa kirjutad mõned koodi konsool et see töötab korralikult. Julgelt küsida küsimusi, kui midagi ei ole selge, siin. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Iga liik, eks. Seal on ainult üks tüüp kõik muutujate JavaScript. Ja kui sa pead deklareerima muutuja, ütlete var. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Jah. Ta teeb, aga JavaScript, et see on väga arukas eraldada mälu. Ei ole malloc. Ei ole tasuta. Nii et sa ei pea muretsema, et. See on veel üks tore omadus, et JavaScript pakub. 

Nii et ma tahaks minna. Kas see oleks OK? OK. Suur. 

Publik: Ma lihtsalt probleeme leida [? Kontrollige element. ?] 

ROGER ZURAWICKI: Nii Safari välimus natuke erinev, kuid sa on Chrome või Firefox? Need on lihtsam need töötada. Ja teie projektide salli seismise üks brauser, kuna saad palju vigu peaaegu sest iga brauseri kohtleb JavaScript HTML natuke teistmoodi. Nii et ma arvan, et su elu on palju lihtsam, kui sa kinni Chrome sest see on saadaval kõik masinad. Ja see on üsna populaarne brauser. OK? 

Nii et järgmine teema, et me ei peaks katta JavaScript - Mul on kahju, vormingu siin. Mul oli venitada slaidid sobitada widescreen projektorit. Aga ma tahaksin nüüd rääkida kuidas sa seda ülesannet. In C, peame kuulutama iga funktsioon. Nagu int lisada, ja see võtab int sisse x ja int y, ja siis lisame neile ja tagastab selle. 

In JavaScript, funktsioonid on tegelikult teise muutuja tüüp. Nii et me lihtsalt öelda var lisada, ja see võrdub funktsiooni. Funktsioon, mis võtab x ja y. Ja mida see funktsioon teeb? Ta naaseb x pluss y on täpselt sama süntaks nagu C. Ja te teate, et JavaScript, siis ei saa teada, mida tagastab funktsioon, sest alates muutujad ei ole tüüpi niikuinii, see see ei ole tõesti produktiivne, ma arvan, tuleb täpsustab kõik oma liigid oma funktsioone. Ja siis, kui sa kasutad funktsiooni, see on täpselt sama süntaksit C. You ulata oma kaks argumenti. Ma tahaks proovida seda minu sõlme. Kas ma saan muuta slaidi? 

Publik: [kuuldamatu]. Kas me saame koopia esitluse? 

ROGER ZURAWICKI: Jah. Lähme tagasi sõlme. OK. Nii et ma ütlen var add võrdub funktsiooni. Võttes x võttes y. Ja siis ta teab, et see avaldus on ole lõpetatud. Nii sõlme või oma konsooli, märkad dot dot dot. Nii saate hoida sisesta oma kood. Ja nüüd ma ütlen tagastamise x pluss y. Ja sulgege traksidega. Ja hetkel ma sulen traksidega, see näeb, et avaldus on lõppenud. 

Ja nüüd võin öelda, lisada üks ja kaks. Ja ma saan kolm. Pange tähele, et kui ma ei lisa, siis ütleb mulle, et see on funktsioon. Ja üks asi lihtsalt tähelepanu pöörata on, kui annad talle vale number argumendid, see teeb. See töötab, kuid võite saada mõned väga imelik tulemusi. Objekti nagu prügi väärtus, sa ei mõtle seda. Nii et palun minna ja proovida, see brauserites. 

OK, nii et huvi aja jooksul, siis ma nüüd liikuda järgmise funktsioonid JavaScript. Niisiis oleme rääkinud funktsioone. Me oleme rääkinud silmad, Kui avaldused ka. Süntaks on sama nagu C ja muutujad. Ja nüüd ma tahan rääkida massiivid. Mul on kahju, et slaidid sain natuke lõigata. Aga tegelikult, esimeses osas kõike, mida vaja töötab. 

Nii et meil on veel üks liik muutujad nimega massiivid. Ja me kasutame nurksulgudes tähistamaks neid. Nii esimese näite var arr, tühi massiiv. See on tühi nimekirjas, siis massiivi ei sisalda elemente. Ja saab ka massiivi kolme keelt. In C iga element oma valikut pidi olema sama tüüpi. 

Kuid kuna JavaScript on ainult üks liik, massiivid saab tegelikult on erinevaid väärtusi. Nagu siin, meil on massiiv float, bool ja int. Nii saad pikkusega massiiv, sa tegelikult ei pea kasutama suurus või midagi. Sa lihtsalt öelda massiivi ja siis dot pikkus. Ja see dot pikkus, võite mõelda see on nagu struct, kuidas iga massiivi väljale pildi muutuja sees on nn pikkus, mis jälgib, kui kaua teie massiiv on. 

Nii et ma lihtsalt kiiresti lähe sõlm ja näidata teile poisid sama asi. Ma võin olla massiivi. See võib olla tühja nimekirja. Ja see prinditakse mind tagasi tühja nimekirja. Suur. Ma võin nüüd öelda, et massiivi on 1 ja 2,3 ja tõsi. Nii et kõik erinevad. Ja te märkate see töötab just fine. Array ma tagasi toed kõik väärtused Ma andsin. 

Kui ma tahtsin saada esimese elemendi massiiv, süntaks on tegelikult sama nagu C. Te Võib öelda, array null. Ja sa saad ühe. Võin öelda sama massiivi kaks, ja ma saan tõsi. Kui ma midagi väljaspool massiivi JavaScript on turvaline keel sest ma ei saa seg süü. Ma toon määramata. 

Ja see määramata, saate objekti ja mõtle, kui null. Aga see võib olla tõesti tüütu, kui sa kood, sest sa pead veenduge, et peaaegu kõik, mida sa teed, sa tööd on määramata. Ja me näeme näiteid see, kui töötame Meteor. 

Kuigi array neli on määramata, Ma ei anna seda raha. Nii et ma ütlen, see võrdub üks. Ja siis, kui ma lähen massiiv, I on ekstra raha olemas. Ja teate, mis massiivi kolm, mis ka oli määramata, jääb määramata. Nii et ma nüüd massiiv auk keskel. Aga kui ma trükitud array neli, Tahaksin saada üks. Kui ma tegin array kolm, saan määramata. 

Nii tore omadus, et JavaScript saate teha on see, et nimekirju saab muuta suurust. Massiivid, massiivid on nimekirjad, nad muudavad suurust. Ja saate määrata mis tahes kohas sees neist. Ja kõik lüngad on täidetud Nende määramata väärtusi. 

Niisiis oleme rääkinud massiivid. Nüüd viimane asi, mida ma tahan, et katta JavaScript, ja see on väga oluline mõistmiseks kood, mis Ma lähen näitan sulle, saab olema objektid. Ja objektid on mõiste - Põhimõtteliselt, need esinevad palju programmeerimiskeeli. Ja iga programmeerimiskeele meeldib mõtle neid veidi erinevalt. 

Aga ma arvan, et Meteor, hea Analoogselt on C struct. C, kui tahame leida struct õpilane, siis oleks meil täpsustada kõik asjad sees on. Nii et see peab olema nimi. Peab olema aastas. Peab olema sugu. Aga meil on ka anda talle tüüpi kõik need asjad. 

Ja nüüd, kui meil see hallituse struct nimetatakse üliõpilane, meil on uus struct ja siis saab käsitsi öelda, mida igaüks väljad. Ja see, kui me kasutame dot nimi, dot aasta dot sugu. Ja siis lihtsalt, et viimane rida kood siin, ma lihtsalt välja printida nimi; struct õpilane. 

In JavaScript maailmas on ei ole sellist asja nagu struct õpilane. Sa ei teeni etteantud struktuuri. Te tegelikult ainult nendel sulgudes sa öelda, mida kõike on. Ja see on see imelik märkuse koolon ja siis koma, kuid võite harjud varsti. 

Ja see on tegelikult väga lihtne, paindlikult lihtsalt manipuleerides objekte. Te teate, et kui ma tahan nüüd saada Nime s, ma lihtsalt teha s.name. Kas on mingeid küsimusi selle kohta? Tavaliselt on olnud väga segane teema, kui me tutvustada inimestele JavaScript. Ma teen mõned näited selle sõlme. Jah? 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Nii et sa on näiteks mitu muutujaid, et tüüp. 

Publik: [kuuldamatu]. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: OK. Nii et ma arvan, et seda, kuidas teil läheb umbes on te paneks objektide massiiv, ja nüüd sa pead array objektid. Kas see vastab su küsimusele? 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Jah. S on üks eesmärk. Nii et me ei lähe sõlme ja lihtsalt mängida natuke. 

Publik: [kuuldamatu]? 

ROGER ZURAWICKI: Oh, OK. Nii et kui te küsite, mida klassid on, klasside koheldakse väga erinevalt, ja nad on väga imelik kava nimega prototüübi, mis sul ei ole vaja teada. Ei ole kindlaks määratud, kuidas seda teha. Nii et kui soovite luua mitu, siis oleks lihtsalt selline on funktsioon või midagi. Sa luua oma funktsiooni. Ja siis oleks tagasi objektile. See oleks kõige lihtsam kuidas seda teha. Kas see on mõtet? OK. Suur. Nii et kui meil on arusaam JavaScript objektid, nad on - oh, jah. 

Publik: [kuuldamatu] Näiteks, mis vahe on "Roger" jutumärgid versus [Kuuldamatu] ühe hinnapakkumisi. 

ROGER ZURAWICKI: OK. Nii et see on C, meil on ühtse hinnapakkumisi esindavad sümbolid ja topelt hinnapakkumisi esindavad stringe. JavaScript tegelikult viskab selle ära sest sul võib olla keeli ühe või kahe hinnapakkumisi ja seal ei ole sellist asja nagu ühe char. Aga kui sa lihtsalt kopeerida sama C koodi JavaScript oleks ravida just fine. Mistõttu ma käsitleda seda - sellepärast ma sõna-sõnalt port kood selles mõttes. 

Ja ma tahan teile näidata, näiteks of keerulisem objekti. Nii saad teada, et üks objekt võib olla stringid väärtused. See võib olla ka väärtuste nimekirja. See võiks olla nimekiri objektide väärtused. Seal tõesti ei ole piiranguks. Nii et siin, see on lihtsalt hea demonstratsioon kuidas sa saad palju erinevate toimub kõik ühe objekti. Kas see on mõtet? 

Nüüd saab ka massiive objektide kohta. Ja siin on selline sarnane sellega, mida küsis, kas võib objektide Sama tüüpi. Kuid probleem on, ei ole fikseeritud vormi objektid JavaScript. Nii et teil on vaja neid ise. Ja sa pead veenduge, et nad on ühtne. Nii siin, kui ma luua objekti, mul on veenduda, et igaüks Nime, ja iga üks on majas. 

Ja siis mul on array need, ja see võib olla minu maja. Ja siis siin saate objekti vaata silmus toimub. Silmus on lihtsalt tõesti ühine viis läbida üle massiivi JavaScript. Pange tähele, et see muster on väga sarnane to C ekvivalendina kuhu olema int i võrdub nulliga. mina on väiksem kui pikkus. Ja siis ma pluss pluss. 

See on peaaegu sama kood, välja arvatud mõned detailid. Nii ei igaüks aru Mis eesmärk on? Lihtsalt mõtle selle peale, kui C struct. Ja kuidas te juurdepääsu väljad on lihtsalt koos dot. Ja nii kaua, kui see teile meenub, kuidas kasutada punkti, siis saad trahvi. 

OK, nii et nüüd saab igaüks lugesin, et link? Siin on link, et projekti. Kas keegi on probleeme nägemine link? OK, olgem muuta siis. See ei ole - Jah, see on ilmselt Lihtsaim viis seda teha. Suur. 

Nii et kui te lähete sellel saidil, ei tohiks mõned juhised, et ma minna üle, kuidas saame paigaldada Meteor ja saada meie proovi projekt pooleli. Ma tahan veenduda, et kõigil on link maha, enne kui ma liikuda. Kas ma saan edasi liikuda? OK, tore. 

Nii et siin ma olen veebilehel. Märkad readme faili meil on mõned juhised, kuidas saada th loodud. Sa pead olema kas CS50 seade või lihtsalt Mac. Windows ei tööta. Aga põhimõtteliselt midagi, mis ei ole Windows peaks tegema nende juhiseid just fine. Aga ma ei tee seda veidi suurem ka. 

Nii saate käivitada esimene paari käske. Need kutid lihtsalt paigaldada Meteor. Ma ei hakka oma terminal. Ja kui ma saan sama asja nüüd, Mul on juba see installitud. Nii et see on veidi lühem. See võib võtta veidi kauem kutid. Aga ma tahan kõigepealt veenduda et meil Meteor töötab. Pärast Meteor on paigaldatud, siis tuleb võimalik saada sõlme konsooli. 

Publik: Nad küsivad parooli. 

ROGER ZURAWICKI: See oleks teie kasutaja parool, kui sa oled Mac. See lihtsalt peab loa muuta mõningaid süsteemi faile. Nii et küsimus oli, kui ta küsib parool, see on lihtsalt teilt Teie kasutajanimi parool te logite sisse oma Mac. Ja see on nii, et saate muuta süsteemi faile. 

Ja kui sa oled valmis, siis saab liikuda Järgmise sammuna, mis kopeerib proovi kood on mul veebilehel. Ja saad uue kataloogi oma kodukataloogis jättibanneri ja saame alustada tööd sealt. Nii et ma lihtsalt kopeerige need käske minu terminal. Ja minu jaoks, ma juba kloonitud ta. Nii et ma ei saa lihtsalt edasi liikuda arvesse edetabel. Ja ma peaks olema mõni failid sinna. Kas on küsimusi? 

Publik: [kuuldamatu] ei tööta. 

ROGER ZURAWICKI: Oh, siis võib vaja git paigaldatud samuti. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Vabandust? 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Oh, OK. OK. See on sellepärast, et peate olema sisseloginud GitHub saada see link. Kui te näete, et kõige lihtsam kuidas seda teha tahaksin siis öelda, lae zip. Ja see on lihtsalt alla kõik failid. Ja siis kui paned selle oma laadida või oma kodukataloogi - Ma soovitan panna see oma kataloogi, et saaksime kõik kestab sama käske. Niikaua kui meil on failid, siis me saaks alustada tööd nendega. Anna teada, kui inimesed, kellel raskusi allalaadimisel faili. 

Publik: Autor kodukataloogi, sa mõtled - 

ROGER ZURAWICKI: Nii kataloogi oleks olema John Harvard, kui te olete CS50 aparaat. Et saada oma kataloogi, lihtsalt kirjuta C. 

Publik: [kuuldamatu] CS50 seade [kuuldamatu]. 

ROGER ZURAWICKI: Jah. Soovite käivitada käske Teie terminal. 

Publik: [kuuldamatu]. Ma sain viga, mis ütleb, ei ole sellist faili või kataloogi. 

ROGER ZURAWICKI: Saame võtta kiire murda ja lihtsalt veenduda, et kõigil on Meteor paigaldatud ja ma minge proovige aidata inimesi. Palun proovige üksteist aidata, kui näed probleeme. Sorry, jah. Oled nii seadet? 

Publik: Jah. Mul on RISA 

ROGER ZURAWICKI: OK. Kui sa lähed tagasi veebilehte, minge liikuge üles tippu. Ja seal see HTTPS. 

Publik: Kopeeri see? 

ROGER ZURAWICKI: Jah. Ja siis sa tahad kirjuta git kloon. Nii et kui sa vajutad kontrolli - 

Publik: Siin? Ja kas [kuuldamatu]? 

ROGER ZURAWICKI: G-I-T. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Git ja siis klooni. Nii et see on väga sarnane käsk, mida oli eespool, kuid URL muudetud. Nii et enne seda oli see, nüüd on see. Lubage mul uuendada - jah. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: See on alla laaditud. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Oh, nii et see ei kloonida õigesti. Ma parandada. On viga üritab laadida faile. Lubage mul uuendada käsk kutid nii et ma ei saa teha kindel, et see töötab. Mul on kahju sellest. See peaks olema sama Mac või CS50 aparaat. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Olen muutnud käsu number kaks, kui sa värskenda lehekülge. Ja see, URL, siis peaks olema võimalik alla laadida faile. 

Publik: Kui me oleme ikka allalaadimine [kuuldamatu]. 

ROGER ZURAWICKI: Kui sa oled veel allalaadimine Meteor? 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Jah, kui soovite, arendada oma Mac. Aga sa pead Xcode arendaja tööriistad paigaldatud. Olen katsetatud neid käske CS50 seade, nii et ma ei saa garanteerida et ta töötab. Jah. lase mul minna ja aidata. 

Publik: [kuuldamatu]. Ma annan oma parooli. See on Mac. Ja siis ma teen [kuuldamatu]. 

ROGER ZURAWICKI: OK. Tahaksin proovida töötab kõik käsud ainult CS50 seadme terminal. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: ma saan seda tööd kõigepealt terminalis, CS50 seade ja seejärel Mac terminal. 

Publik: Nii et kui sa seda CS50 seadmega nagu, et [kuuldamatu]. 

ROGER ZURAWICKI: tahaksin liikuda , aga kui inimesed on endiselt vaeva loomise Meteor, Kevin on rohkem kui hea meel teid aidata välja Kevin halli särki. Mida me peaksime olema, on me kulgema viimase käsu, number kolm, in Meie terminal. Kui me seda teeme, siis me joosta Meteor. 

Ja sa peaksid - oh, mul on juba Meteor töötab. Nii et see ei lase - las ma lihtsalt sulen muu Meteor. Kui ma saan Meteor, siis peaksid nüüd näha, et - sa peaksid nägema praeguses kataloog et see töötab. Ja nüüd ta läheb öelda server töötab http://localhost. See on URL, mida soovite panna aastal oma veebibrauseris. 

Ja et URL, siis peaks olema võimalik juurdepääsu toreda edetabel. Nii teate, et see on localhost, mis tähendab, et kui te kõik muudatusi, et sa ei kavatse vaata üksteise muudatusi. Arvestades veebilehel ma näitasin sulle alguses me võiksime saada igaühe muudatused, sest kõik pöördus samal veebilehel. 

Lubage mul minna [? sõna?] 3000. Nii et sa peaksid suutma lihtsalt kinnitada et funktsionaalsus toimib. Saate valida erinevate inimestega ning saate anda neile erinevaid punkte. Nii et ma annan kellelegi punkti. Samuti saab näha, et nad tõusevad auaste. 

Nüüd huvides ajal, siis On kolm funktsioone, mis ma olen rakendatud. Ja me ei kavatse rakendada kustutamine kasutajad kui meie esimene mängufilm. Aga enne kui edasi liigume, on Kas küsimusi on? Sul oli käsi püsti. Jah? 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Kuidas kontrollida et Meteor paigaldatud? 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Local host 3000? Ja sa oled CS50 seade? Mida ma teha saan - sa ei pea olema Mac. See töötab aparaat. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Tavapärase veebibrauser, jah. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Kas Meteor näitama? Nii OK, seal on vahet siin. Kui näed seda seade, mida pead tegema, localhost jooksul seade. Kui näed seda oma Mac, nagu ma olen, siis ma ei saa teha minu Mac Google Chrome. Aga kui te kasutate CS50 seadme sa pead tegema kõik, seadmesse. Nii et teil on kasutada Google Chrome aparaat. 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: On ikka ei tööta? 

Publik: [kuuldamatu]. 

ROGER ZURAWICKI: Nii lihtsalt korrata, kuidas sa juurdepääsu veebisaidi nüüd. Sul on link siin localhost 3000. Kui oled CS50 seadme sa pead avama CS50 Seade on Google Chrome. Ja et Google Chrome jooksul seade, saate sisestada, et URL, ja sa peaksid nägema edetabel. Nii et ma lähen lihtsalt pane see maha Lisa pool siin natuke. Ja nüüd ma lähen avan tekstiredaktor siia. Nii et lubage mul lihtsalt veenduda, et kood on korras. OK. Suur. 

Ma tahaks nüüd kõndida läbi koodi natuke. Ja esimene fail Sooviksin alustada IS Leaderboard.html. Sul on võimalik saada seda koodi pärast seminar, nii et ma lihtsalt tahan näidata sa minu arvuti, mis toimub. Nii et ma loodan, et igaüks võib seda näha. Nii alguses faili, me on meie peas ja pealkiri, mis on sarnane sellega, mida nägime iga HTML dokument. Ja siis me ei kavatse olla body siin. 

Mida ma olen valinud, on peamised keha, põhimõtteliselt mis hakka kuvata. Kuid on ka mõned uued mitte-HTML asjad, ja see on double nurksulud. Ja need on malli sildid. Nii et te näete siin sulg sulg uus edetabel. Ja see on omamoodi - mõtlevad kui helistate funktsiooni HTML. 

See on eriversioon HTML. See on versioon, et Meteor kasutab, mis Sellepärast saab kuvada erinevaid asjad, nagu edetabel nimed ja nupud. Aga suur bänner ütleb teile, et minna malli nimi edetabel. Nii malli ei saa kuvada ise, aga see on funktsioon, nii et see saavad nn. Ja teil asendada see kõik kood siin arvesse edetabel. 

Huvitav osa Tahvel siin on lihtsalt selles tabelis. Kui sa just lugesin seda, loe seda koodi valjusti, see peaks olema arusaadav sest suur bänner, kõik me siin on tabel. See ID klassi asju sa ei pea muretsema. Lihtsalt tean, et seal on tabel päises. See on see thead. 

Ja ta leiab nimi ja tulemus. Kõik need märksõnad, nagu thtable, thead, sa pead lihtsalt õppima lähete mööda. See ei ole oluline, et teil meeles neid, sest sa võid lihtsalt pääseda mistahes viide võrgus. Või semestri lõpuks, need lihtsalt olla väga tuttav teile. 

Pärast päist tabeli, osa, mida ma tahan juhtida teie tähelepanu on see h tag. Sest see on topelt sulgudes, see mall. See tähendab iga mängijad olenemata mängijate, peame kuvamiseks. Ja me läheme mängija malli. 

Kui me keri natuke rohkem - Loodan, et kõik on võimalik näha. Meil on mängija malli. Ja seda malli põhiliselt määratleb tabeli lahtrisse, kuhu panna nime siin ja skoor. Vähendamisvõimalus nüüd näeme, et see patakas kood - ja see oli meie mängija seal - määratletakse üks nendest rakkudest. Iga asi, mis ma vajutan muutub kollaseks. 

Lihtne viis, kuidas ma saaks seda muuta nüüd. Veenduge Meteor töötab endiselt. Meteor peaks server protsess, nii et sa lihtsalt lahkuda töötab, kui teil on tekkinud. Oletame, et ma tahtsin, et muuta kõik nimed ja skoor. Ja ma ütleksin, ma lähen lisada punkti. Nii muutus Tegin siin oli, asemel lihtsalt tulemus, I Lisa skoor ruumi punkti. 

Ma lähen välja suumida, ja ma olen päästa oma faili. Ja pärast ma hoian oma fail, ma vajan veenduda Meteor töötab. Vabandust. Ma tahan teile näidata edits tehti reaalajas. Nii et ma lihtsalt muuta mõned teksti. Klõpsa mängija. Ma panen selle kõik mütsid. Ja see peaks olema, et kui see töötab õigesti, kui ma salvestada see ajakohastatakse. 

Oh, ma arvan, et praegu on probleem selles Ma ei ole õiges kataloogis. OK. Mul on kahju sellest. Nii et siin, mida te teate, minu muudatus läbis. Nüüd ütlen ma tahan tagasi muuta. Ma tahan minna tagasi, mida pidin. Ma lihtsalt kirjuta see tavaliselt. Klõpsa mängija. 

Praegu ma salvestada, site värskendab minu jaoks. Ja ma näen, minu muutus site koheselt. See on tõesti kasulik omadus aastal silumine, sest nüüd Ma ei pea - kui me kirjutame C kood, mitte ainult ei me on faili salvestada, kuid me pidime teha ja seejärel käivitage see uuesti. Meteor on väga tore, sest erinevalt C, hetkel salvestate HTML või JavaScript fail, muutus näitab üles kohe. 

Üks küsimus on need mallid, kuidas ma saan väärtused nagu mängijad või valige nimi? Kui ma suumida siin minu kood, Ma näen seda iga mängijat. Nii malli teab, et Mul on mängijaid kuidagi. Ja ta teab, et seal on valitud nimi. Kust see tuli? See pärineb JavaScript. 

Ja kui te lähete leaderboard.js see fail, nüüd, kui ma lähen siin on meil mõned käsud määratletud. See on eriline Meteor süntaks. Pange tähele, et sa ei pea vars või midagi. Aga need on lihtsalt structs peale structs upon structs või objektid. Ja ma määratlemisel on template nimetatakse edetabel. 

Leaderboard peaks saama asi nimega mängijat. Ja mis on mängijaid? See on see, mis see väljend tagastab. Ja mis on valitud nimi? On veel mõned koodi. Üksikasjad kood meiepoolsete katta veidi hiljem. Aga nüüd ma tahan, et sa aru et see kood, me võtame mängijad ja me anname selle väärtust. Sel juhul on see funktsioon mis saab täidetud. Nii saame raha tagasi kui võtame funktsiooni. See on samamoodi. Kas see on mõtet? 

Ma ei muuda seda, kuidas see on järjestatud. Siin, seal on mingi objekt. Ja mida see ütleb on, et ma hakkan sorteerima punktiarvestus kahanevalt esimene ja siis nime järgi kasvavalt. Kui ma seda muuta üks, see läheb sorteerida tulemus kasvavalt. Nii null peaks olema peal. Ja kui ma suumida oma veebilehel, me Nüüd näeme, et veebilehel uuendatud. Ja tulemus on tõusta. 

Järgmine funktsioon Ma tahan katmiseks on click juurdekasvu. Pole huvi aega, ma ei katma mitut Meteor kood, kuid seal on palju ressursse olemas, ja ma olen siin pärast seminari. Aga ma tahan, et katta Edetabeli üritusi. See süntaks õpite Natuke hiljem loengus. See on JavaScript. 

Me lihtsalt öelda, kui me click, ja see on samm, seda hash tähendab lihtsalt ID. On juurdekasvu ID tag, siis me tahame uuendada - võtmesõnadeks Ma tahan, et sa vaadata on uuendatud ja valida ja mängija. Niisiis kumb mängija valimisel me ajakohastada. Ja mida me teeme, on meie juurdekasvu oma skoori viis. Ja mis kirjeldavad funktsioonid meil siin on. 

Pärast seda seminar, me tulen võimalik näha veel mõned koodi. Aga minnes tagasi minu eesmärk, mida tahan muuta ala, tahtsin siia lisamiseks eemaldage nupp nii Võin kustutada mängija. Niisiis, mida teha, et ma vajan teha kahte asja. Mul on vaja uuendada HTML, ajakohastada vaadata, mida saab näidata kasutajale, ja Seejärel on mõned JavaScript et kui nuppu, Meteor läheb midagi teha. See saab eemaldada, et mängija. 

Seega on palju tükkideks kood mis on põhimõtteliselt juba tehtud mulle. Kui ma vaatan siin, mul on juba viis saada valitud mängija. See on see kraam, kui te näete seda. Nii et kui ma lihtsalt - Ma lähen on teine ​​sündmus. Ma lähen kopeerida mis mul on. Sest see on nimekiri, Ma lihtsalt pean koma. 

Nüüd ma lähen kliki kustutada. Ja siis selle asemel, et mängijad värskenduse Ma lähen tegema mängijad kustutada. Ja kõik mängijad kustutada vajadustele on valitud mängija. Nii et see funktsioon on kõik, mida vajame. Ma ei vaja lisada mõned HTML siin küll. Nii et kui ma keri siit see on HTML-i vaade. Meil oli asi siin, mis oli tag. Sa ei pea muretsema, et. 

Mis on oluline, et teil on Selle ID juurdekasvu. Ja see on see, mis võimaldab meil öelda, kui me klõpsatud juurdekasvu, peame anna viis punkti. Ja te näete, et see on nupp. Seda btn tähendab. Ja tekstiga nupp ei anna viis punkti. Niisiis, mida ma lähen tegema, on mul läheb kopeerida selle rea. Ma lähen, et muuta ID kustutada. Ja ma lähen muuta Kirjuta siia jätta. 

Seega veenduge, et kõik on salvestatud. Ma tahan minna tagasi oma JavaScript veenduda, et mul on kustutada rivistatud siin. Väga hea. Nii et ma lähen säästa faile. Pärast salvestamist nii faile, me minna tagasi põhja. Ja nüüd me näeme, on meil kustuta nuppu. Ja veel üks samm. Te teate võite saada viga, sest kui ma vajutan kustutada, ei juhtu midagi. 

Viis debug on minna tagasi Kontrollige element. Ma teen seda meelega, et saaksite näha, kuidas te oleks siluda midagi. In Kontrollige Element meil kõik meie tekst siia. Ma tahan minna tagasi konsooli. Ja mis juhtub, kui ma lähen siit on mul mingi viga. Ta ütleb, et ei ole meetod kustutada. 

Niisiis, mida see ütleb, on see, kui ma lähen Tagasi kood, ma helistasin mängija kustutamiseks siin. Kustuta tegelikult ei ole õige käsk. Nii et välja selgitada, mis õige käsk on, seal on Meteor API. Dokumentatsioon Tahan tähelepanu juhtida teid poisid on just meteor.com. Nii et mul on see siin. See on lihtsalt nii te teate kus rohkem teada saada. 

Seal on link dokumentatsioonile. Ja põhimõtteliselt ma vaid ei leia delete. Ja mida sa näed, kustutada tegelikult eemaldada. See on käsk, et Mul on vaja helistada. Nüüd, et me teame, et ma lähen Selle muutmiseks kustutage eemaldada. Nüüd, kui ma lähen minu suur bänner site, ma lähen kliki kustutada, ja nüüd ma olen läinud. Ei ole veel Roger. Ja ma ei jätka kustutamist iga ühe nime kuni mul on midagi jäänud. 

Nii et oli väike eelvaade kuidas kasutada Meteor. Õpid palju rohkem JavaScript ja HTML vaja teha see näeks välja ilusam, mida me katta Selle nädala [? tükk?] seatud HTML ja JavaScript järgmise [? tükk?] kehtestatud. 

Nii ei saa mures, kui mitte kõik see kraam on lihtne teile. See ajaks lõplik projekt. Täname ilmumise. Link Ma uuendab varsti pärast seminar, et näed, mõned rohkem näiteid, mida ma olen rakendanud, kuidas saada rohkem arenenud suur bänner et mul on sellel veebilehel siin üks-radikaalne-leaderboard.meteor. Aitäh. 

[APLAUS]