SPEAKER 1: Kõik, eks tere tulemast tagasi. See on CS50. Ja see on algusest nädalal üheksa. Ja see on algusest ülejäänud oma aega CS50, kus me ülemineku nüüd lõpuks veebis aspekt muidugi, kus saate leiavad, et palju põhialuste et oleme olnud eksportivate nädalat veel tagasi tulla külla, või kummitama, meiega. Aga nüüd, leiad, et see on suurusjärgus lihtsam täita teatud ülesandeid ja Teatud probleemide lahendamiseks - nii palju, et isegi siis, kui sa arvasid, teatud probleem komplekti oli lõbus oma omal moel, ma arvan, et sa leiad, et p seatud 7, lk määrata 8, ja siis, lõpuks, lõplik projekt on seda enam meeldiv, sest sul leiavad, et hakkame enesestmõistetavaks nüüd asjad mälu haldamine ja suunanäitajaks, ja mis toimub on alla kapuuts. Ja jälle, temaatilised, kõik kogu semester on see kihilisus ja kihistumist. Ja nüüd me oleme omamoodi üles Siin seisab õlgadele nädalat varem. Nüüd mäletate viimast korda, et me rääkis, kuidas internet toimib. Ja see oli võib-olla järeleandmisi, kuid pidage meeles, et iga arvuti maailmas on IP lahendada, kuigi see on natuke järeleandmisi ikka. Ja need aadressid on kasutatud üheselt kindlaks masinate et kui saadate teavet või pakette, nii rääkida, võib neil päritolu aadress ja sihtkoha aadress. Ja need samad IP-aadressid on võimalik kasutada nii hea kui ka kurja, sind jälgida, näiteks. Tegelikult igaüks teist koos sülearvuti avada nüüd või telefoni oma tasku, on IP aadress on Harvard võrku. Ja see pole veel kõik, et raske korrelatsioonis, et kes ja kus sa on nendel päevadel. Aga rohkem sellest ehk tulevikus. Nüüd ma mõtlesin, et ma tagasi tuua mõned mälestused [? suurendada?] ja teile teise klipi näidata teile võite leida tuttav. Kui me saaksime päevasõidutulede tuled vaid paar sekundit. Näita Numb3rs. SPEAKER 2: See on 32-bitine IPP4 aadress. SPEAKER 3: IPP nagu internet? SPEAKER 2: Private võrku. Et Amita isiklik võrk. Ta on nii hämmastav. SPEAKER 3: Tule, Charlie. SPEAKER 2: See on. Peegel IP aadress. Ta lastes meile vaadata, mida ta on teinud reaalajas. SPEAKER 1: OK, nii et mõned asjad sellel pildil valesti. Nii et üks ja see on vastuvõetav, see on tegelikult ei ole kehtiv IP-aadress. Kehtiv IP aadress peab olema numbrid vormi w.x.y.z, kus iga need kirjad on 0-255. Aga see on hea, sest nagu filmi, kus nad võltsitud telefoninumbrite need võlts IP aadresse. Sa tegelikult ei tabanud tõeline servereid. Kuid mind sa, et see on brauseris. Ja brauserid ei hakka kirjutamine arvuti koodi niimoodi. Ja kui me vaatame veidi sügavamale, teate et keel, et nad näevad ekraanil on keeles nimetatakse Eesmärk C, mis on keel, mis iPhone apps on kirjutatud, eriti need, mis hõlmavad värvipliiatsid, kui näete lähtekoodi siin. OK, ma arvasin, et see oli naljakas. Nii et see koodilõik on absoluutselt midagi pistmist iganes see eriti episood oli umbes. Nii nali on omamoodi on inimesed võttes selleks antud. Kuid see ei ole kõik, et raske saada nende tehnilised üksikasjad oleksid õiged. Ja ma kutsun teid. Ja tegelikult, 50 võib väga hästi rikkuda palju telesaateid ja filme või te sest leiad, et see on lihtsalt ei ole võimalik see, mida nad on tehes ekraanil. Aga tõesti, see on kood, mida võib näha seda iPhone rakendus või Mac OS. See on midagi üldse pistmist turvalisus. Nii et hoidke silma peal rohkem selline lõbus asjad niimoodi. Aga täna me hakkame sukelduda tegelikult sügavalt kõiki keeli. Tõepoolest, üks üldine takeaways selle osa Muidugi ei ole teada, kuidas programmeerida PHP, mitte õppida SQL iseenesest ei õppida JavaScript per se, vaid pigem õpetada ise, kuidas õpetada ise uusi keeli, sest tõepoolest, hakkame võtma nüüd Apupyörät maha nii, et pärast kursuse lõpuks, sa ei saa eeldada, 20 lehekülje kirjelduse öelda, kuidas rakendada mõningaid programmi. Sul on piisavalt koostisaineid oma meele ja piisavalt vahendeid oma tööriist kit, kellega alustada hoone lahendusi probleemidele huvi sa mõnda õpilast rühmas mõnda uurimisprojekti, või tõesti midagi Teile huvi pakkuda. Nii suunas, et lõpuks meelde, et see oli Pildil juhtis ta viimast korda. Ja see on kaks arvutit, kliendi ja katkestama, räägi üksteisega. Ja protokolli, keel, nii et rääkida, et need kaks arvutit juhtuma kõnelda nimetatakse HTTP. Ja see on lihtsalt kasutatav protokoll arvutid teabe edastamiseks üle World Wide Web. Web, on muidugi vaid üks teenus mis jookseb peal niinimetatud internet. Mis muu teenus saadaval tippu internet nendel päevadel? Mõned teised protokoll või - mis see on? Publik: FTP. SPEAKER 1: FTP. Nii File Transfer Protocol on teine. Enamik teist ilmselt ei ole seda kasutanud. Aga enamik te ilmselt kasutada asjad Gchat või vahetu Sõnumid üldisemalt kindlasti email. Ja need ka, on teenused, mis töötavad tippu internet, sest kell Päeva lõpuks on internet ise tegelikult lihtsalt saada andmeid punktist A punkti B. Ja see kasutab mitmeid osakesed ise üks neist või kaks neist enamik tavaliselt nimetatakse TCP / IP, mis tähendab, et üks arvuti Internetis võib tegelikult olla teeme erinevaid asju, email, ja web, ja nii edasi. Google teeb palju see. Niisiis, kuidas on neid teenuseid üheselt kindlaks, kas me ütleme, arvuti mis võiks tegelikult olla teeme mitu asja? Pordi number. Ja need on vaid suvalise inimese konventsioonides, nagu 80 on web, 443 on krüpteeritud web, 25 on e-mail. Ja seal on kobarad teised. Ja need numbrid on lihtsalt lisatud need paketid teabe, nende virtuaalne ümbrikus, mis tegelikult sisalduva taotluse või vastus. Nii et kui sa tagasi vastus web, tavaliselt sa ei näe numbrid üldse seisukohalt staatuse kood vastust. Sa tegelikult ei näe tööst paketid, mis tulevad tagasi. Aga 200 tähendab tõesti OK. Ja see tähendab, et kõik on hästi. Te olete näinud hunnik neid. Mis on ilmselt kõige levinum olete näinud netis? 404. See tähendab lihtsalt, faili ei leitud. See tähendab, keegi keeras. Sa tegid mida mistyping URL või keegi teine ​​tegi andes teile vigane URL, või need kustutatakse faili ja URL on endiselt mida kasutavad inimesed. Nii tahes mitmel põhjusel võimalik seletada miks faili ei leitud. Ja te näete, et lähinädalatel, need teised veakoodid, ja sa pead ära mõned neist. Halvim on 500. Kui saad 500 viga koodi olete kirjutada, mõelda, et kui mingi analoog seg rikete maailmas veebi programmeerimine. See ei ole päris nii kohutav. Aga see lihtsalt tähendab, et kusagil, sa silmamunad. Seega ootan neid. Aga vaatame, kas me saame näha neid kontekstis. Lubage mul minna brauseri siin ja tehke järgmist. Nii et see on Chrome, mis juhtub paigaldada seade. Aga kõige iga brauser nendel päevadel on mõned samaväärset funktsionaalsust. Ma lähen üles Chrome'i menüü ja mine Tools, ja ma lähen Arendaja tööriistad. Ja te näete, et see väike paneel avaneb akna allosas. Teine otsetee, kui aus olla, siis ma Tavaliselt kasutan ise on Paremklõps või kontrolli nuppu kuskil netis lehele ja minge kontrollige element. Ja see ei ole ainult avatud see on teile. See avab ka konkreetselt Elements osa kohta vasakul pool. Nii et me muidugi näeme Google. Nad muutsid oma logo täna. Aga kui ma keri üles siin, teate et alla Elements, näed mida nimetatakse HTML, hyper Keel ja see on keel et see ja kõik veebilehti, tõesti on kirjutatud sisse Aga see on tegelikult vormindatud meile nii palju readably kui see tavaliselt on. Tegelikult, kui ma suumida ja ma selle asemel lihtsalt paremklõps või Control Click Klõpsake lehel, ja seejärel minna Vaata Page Source, see on sõna otseses mõttes, mida Google saatnud oma brauseris. Nii mõned isiku kirjutas Google.com kasutades lähtekoodi. Enamik see ei ole HTML. See on tegelikult keeles nimetatakse JavaScript, mis me tuleme kolmapäeval. Aga mida Chrome, ja see, mida iga brauser saab teha meie jaoks, on selline vaata minevikus kõik distractions hull süntaks ja taastavad tühik meile ja isegi süntaksi esiletõstmise, või toonida asjad meie jaoks. Nii et sa leiad, et need niinimetatud kehitystyökalut ehitatud brauserid teeb oma elu nii, nii palju lihtsam sest sa võid avastada, läbi selle menüü liides, just see, mida nende aluseks olevate lähtekoodi on iga lehekülg internetis. Ja tõepoolest, see on üks kõige tõhusamaid viise, et õppida, kuidas seda teha midagi uut, vähemalt siis, kui leht ei ole nii keeruline, et uputama, on alustada poking ümber on HTML, vaata selle nn CSS, mis me tuleme et natuke ka selleks, et saada arusaam, et programmeerija rakendanud eelkõige funktsiooni osas. Aga tehniliselt huvitav õigus nüüd saab olema see. Kui ma lähen Network sakk olgem nüüd selge see. Ma lähen kliki vähe rist sümbol siin, ja siis minna teise veebilehel. Ja ma olen lihtsalt kavatse tüüpi aastal Facebook.com. No HTTP, mitte HTTPS ei WWW. Olgem tegelikult näha, mis juhtub siin. Enter. Nüüd teate terve hunnik asju lihtsalt ilmus see alumine paneel, in Lisaks veebilehe ilmumist top. Ma lähen, et kerida tagasi üles Network sakk siin, ja ma lähen klõpsa esimesel real. Mis see tööriist läheb ilmutab meile on iga ühe HTTP taotlusi et kiiresti lihtsalt läksin tagasi ja edasi-minu brauseris ja Facebook serverisse. Ja nii iga üks neist read on üks selline taotlus või Vastuseks ühe või mitme need virtuaalsed ümbrikus. Või rohkem juhuslikult, see on nagu inimene nagu inimene, kliendile restoran, paludes midagi uuesti ja uuesti ja uuesti. Ja kelner hoiab tuues tagasi ühekaupa. Nüüd, kui ma suurendada selle, teate ja see on selline asi, et sa oled teretulnud ja julgustada mängida oma, sest me ei lähe läbi kõik väga üksikasjalikult. Aga teate, seal on mõned sub tabs siin - Päised, Eelvaade Response, Küpsised ja ajastus. Ma lihtsalt vaadata päiseid nüüd, sest need on vähe koostisainete sees ümbriku aidata andmeid saada ja kohtadest. Nii et esimene, las ma klõpsa see, Vaata Allikas kõrval Soovin päised. On nõue, et minu brauser, Chrome, sel juhul saadetakse sees et virtuaalne ümbrikus. Sul meenutada möödunud nädalal käsitsi kirjutatud see kuigi teeseldes brauserit. Seejärel meenutas server, et see on otsin vastuvõtva nimega Facebook.com. Ja siis seal on natuke rohkem keerulisse teavet, mis me laine meie käed nüüd. Aga kui ma hakkan keri nüüd see aken, lubage mul saada vastus päised. See oli see, mis on loodud virtuaalses ümbrik, et tulin tagasi Facebook.com. Ja kui ma nuppu Kuva Lähtekood lihtsalt näha toores teksti see, märgata mõningaid asju. Üks, Facebook räägib ka sama protokoll, versioon 1.1 sätestatut. Nii et on tore. Aga staatuse kood 301, püsivalt liigutatud. Noh, Kui Heck Kas Facebook minna? Mis see üritad edastada meile? Noh, teate siia seal on teine päis nimega Location. Miks on Facebook ütleb mulle, et nad püsivalt liigutatud, et URL kõrval Asukoht? Ma unustasin www. Nii et oli minu valik. Tegelikult enamik meist harva, arvatavasti kirjuta www.whatever.com nendel päevadel. Aga selgub, süsteemiadministraator, nagu Facebook, saavad seadistada oma servereid nii et kas Facebook.com töötab, või www.Facebook.com töötab, või, tõesti, selline eesliide ees oma domeeninimi. Nii nad tegid seda meie eest. Ja neid suunates meid ilmselt mõned tehnilised, mõned põhjustel. Nad tahavad lihtsalt õgvenda edasi www.Facebook.com. Aga see pole päris see. Kui ma keri siin, lähme vaata, mis juhtub. See ütleb mulle, et me püsivalt liigutatud http://www.Facebook.com. Nii vaatame teise taotluse et minu brauser saadab. Kahjuks tundub, et Facebook liikunud jälle, sest teine taotluse, valides et URL selle asemel, ütleb, et liiga, kolis jäädavalt. Ja las ma keri siin et vastus päised. Kus on Facebook läinud nüüd? Nii HTTPS. Nüüd Facebook on alanud, eriti arvestades praegust Viimaste kuude sündmused, eelkõige ja ka viimase paari aasta jooksul sundida kõik oma kasutajatele, hea Muide, kasutada HTTPS, mis on rohkem kindlustada, kuigi mitte täiesti turvaline. Ja nüüd minu leheküljel minu brauser on kavatse nõuda selle kolmanda URL. Ja nüüd lõpuks, saame muidu nähtamatu 200 OK. Mis siis maailmas või kogu need teised read siin. Ma sõna otseses mõttes kirjutatud üks asi ja minu brauser tundub, et on taotletud, nagu 20 mõned kummalised asjad. Mis see on? Publik: Skriptid? SPEAKER 1: Scripts, et teised failid kirjutatud keeles nimetatakse JavaScript, mis jällegi, me vaata natuke kolmapäeval. Mida veel? Style lehed. Seega midagi keeles nimetatakse CSS, mis me näha natuke. GIF ja JPEG ja pngs ja pilte, ja videofaile - olenemata veebileht on kõige tõenäolisem kujul faili. Ja mis me näeme vasakul servas on kõik failid et Chrome pidi alla, rekursiivselt, kui soovite, et komponeerida kogu lehel. Niisiis, mida me nägime hetk tagasi Google, kui ma vajutan Elements tab see, muidugi, on HTML, keelt, mis komponeerib seda lehte. Aga seal on kobarad muid asju. Seal on logo. Seal on need, sinakas ikoonid seal. Ja seal on muid elemente veel leht, mis ise võib olla eraldi failidena. Mis on ilus umbes brauser on, et vaadeldakse keele me hakake, või olete juba hakkas kirjalikult P komplekti 7, arvud välja, kus need failid elavad ja läheb ja haarab neid samuti. Ja ma ei saa piisavalt rõhutada, isegi kuigi mõned see võib tunduda natuke kauge või valdav esmapilgul õppida, kuidas programmi taotluste veebis, see on hindamatu mõista, kuidas need vähe vahendeid tööle. Need on omamoodi nagu GDB nagu tööriistad kuid palju lihtsam lõppkokkuvõttes kasutada - ja tegelikult annab teile silma, milliseid oleme võtnud ette antud juba mõnda aega. Mida me saame nüüd teha seda teavet? Noh, tegelikult, kui heita pilk aluseks olevad mõisted HTML. Ja me edasi lükata, kui meil juba on, et lõigud sel nädalal, et probleem määratud 7 spetsifikatsioon, et mõned rohkem andmed nendest keeltest. Aga vaatame, kas me ei saa maalida pilt, mida sa peaksid mõistma, üldine siin. Nii HTML Hypertext Markup Language, ei ole programmeerimiskeel. Mida see tegelikult tähendab? Nii HTML näeb välja selline. Ja mõned teist juba teavad seda. Mõned teist on seda teinud see juba mõnda aega. Aga vaatame, kui me ei suuda täita mõnel toorikud samuti. Nii märkate paar asja siin. Üks, see on lihtsalt teksti. Nii et see on nagu lähtekoodi C, või mõni muu keel. Pange tähele, et seal tundub olema muster siin. Seal on taandus, kuid tehniliselt taane on lihtsalt inimese konventsioon. Brauserid ei hooli, kas seal on uus joonte ja kaarte nagu me näeme seal. Aga teate, et seal on sümmeetria siin. Seal on see, mida ma kutsun, ülaosas Selle faili avatud tunnussõna või algus tag nimega HTML. Ja siis, allapoole, täiesti vooderdatud up, meelega teeme looksulg, näeme sulg, edasi slash, HTML, sulg. Nii et see vastab lähedal tag või end tag, sest see asi. Koos kõik sees niinimetatud avatud tag ja tihe tag kirjutada, mida me kutsume element. Ja me näeme, et üks hetk, see on tõesti sõlme puud. Sest kui sa arvad nüüd taandus et vaikiv siin, siis selline on, nagu, vanavanem sõlme nimetatakse HTML. Mitu last võib teile öelda, mis põhineb Selle pildi HTML element on? Nii ilmselt kaks. Üks pea on element, ilmselt. Ja üks on keha element. Ja miks kaks last? Noh, ma olen lihtsalt selline järeldada, et kui Mul on avatud pea tag ja siis Sulge pea tag, see element. Ja siis, kui seal on veel avatud keha tag ja lähedal body, mis on nagu teine ​​element. Nii et selles mõttes, et kui ma mingi pööramine pilt külili, see on nagu võttes HTML tag, ja siis pea tag ja siis body ja siis mingi teksti, tere, rippuvad off body ise. Nii saame teha, et olukord tunduda see. Kujundid on meelevaldne. Aga teate, et ma olen kasutanud omamoodi ellips ülaosas esindama dokumendis endas. Selgub, ei saa olla muud kraami sees veebileht, ma ei ole tõmmata. Nii et me ei kavatse isegi riputada HTML sõlme välja nn dokumendi sõlme. Ja siis on meil head ja keha ja pealkiri, teade, mis on pesastatud edasi. Ma ei viitsinud panna lisarida puruneb sees pealkiri tag. See lihtsalt tundus see oli saada natuke liiga paljusõnaline. Nii et ma jätsin ta ühele joonele seal, kus avatud pealkiri, tere, lähedal pealkiri. Ja siis on meil mingi tekst rippuvad off siin. Nii et see pilt tulevad tagasi meid, kui me sukelduda JavaScript. Ja mõista, et kui sa kirjutada HTML meeldib see, mida on brauseri teed? Noh, me ei pea muretsema kuidas ta seda teeb, või mida algoritm, kuid lõpus päeval, kui brauser saab HTML nagu et alates Facebook või Google, see korrastab , nii et rääkida, ta loeb seda, midagi nagu fread, ülevalt alla, vasakult paremale, ja kui see mõistab, oh, avatud tag ja sulgege tag, see hakkab malloc niiöelda, sõlme puu. Ja kui ta avastab, nagu me oleme kaudselt siin taandus, laps sõlme, see mallocs sõlm et ja lisatud, et puu. Seega puu struktuuri, binaarne puid sulam kolme puud ja suuremad puud, mis me pilgu nädal või kaks tagasi, teade et sama põhimõte on tulevad meile tagasi. Ja kes ellu, Chrome iganes meeskond tegi, et arvatavasti oli rakendada mingi puu struktuuri all kapuuts. Ja see on iseenesest arvatavasti keeles nagu C või C + + või madalam tase keeles, kanname nüüd kasutada atop veebis. Nüüd, võibolla on see tahe mõttekam. Tegelik tattoo mõnest mees, kes võiks kahetsen seda hiljem, omamoodi. OK, olgu, nii palju web huumor. See ei ole tõesti üle nii hästi täna. Nii me edasi liikuda. Hea küll. Võtame pilk nüüd juures mõned näited. Lihtsaim võimalik asi võib olla selles. Ma lähen edasi minna ja avada ka gedit fail nimega hello.php. Ja sees siin, ma lähen kiiresti lihtsalt seda, printf, tsiteerin lõppeb, "tere." Nii teate, ja ma teen oma Kenoviiva n, Ma ei ole vaevunud kuulutada peamine. Selgub, php, ja palju keeles, sa ei pea peamiseks funktsioon iseenesest. Sa võid alustada kirjalikult oma programmi. Nüüd, kui ma salvestada see fail, teate ma olen läheb on teha järgmist. Ma ei kavatse kasutada tegema, ja ma ei ole kavatse kasutada rõkkama sest PHP, erinevalt C, ei ole koostatud keeles. See on see, mida nimetatakse tõlgendada keel, mis tähendab, et sa jooksed ta kui sisend läbi teise programmi nimetatakse tõlk. Ja et programm loeb seda, ülevalt alla, vasakult paremale, ja teeb mida sa öelda tahad. Nii et selles asjas on mul üks rida, mis ütleb printf. Nii et kui ma saan selle lähtekoodi hello.php, kuigi programm, mis juhtub, mugavalt, mida nimetatakse PHP, et programm PHP loen see fail, ülevalt alla, vasakult paremale, ja see saab teha seda, mida ma öelda seda, mida teha - täidesaatva kood, ja kui ta ei tunne midagi, lihtsalt sülitada välja. Nii et ma lähen edasi minna ja käivitada PHP kohta hello.php. Enter. Ja see pole päris see, mida ma ette. Noh, miks see nii on? Noh, PHP on keel, mis on tegelikult eesmärk on olla üsna põimunud veebis. Tehes veebilehti selles keeles PHP, nagu me varsti näeme, siis me tahad teha midagi print välja rida niimoodi. Ma lähen seda tegema. Sulg, küsimärk, PHP, ja nüüd ma lihtsalt taane lihtsalt hoida asjad kena. Ja nüüd ma lähen tegema, küsimus tähistada sulg. Nii et seal on natuke asümmeetria siin. Sa ei saa seda teha. Ja sa ei pea tegema slash, nii PHP on veidi erinev. Aga nüüd, kui ma uuesti, see programm, PHP hello.php nüüd ma tegelikult saada Hello World. Ja me näeme, miks see on väärtuslik. Üks, see võimaldab mul täpsustada, super sõnaselgelt, et see on kood, käivitada see. Ja see on tõesti see, mida need eriline sildid tähenda siin. Aga see tähendab ka, et kui ma lihtsalt teha midagi ma eesmärk siin, et tähendab, et sõna otseses mõttes, et lihtsalt välja trükkida, ilma vajaduseta tegelikult helistada printf või printida, või muu sarnane funktsioon. Nii et me tuleme tagasi, et vaid hetk. Esiteks, ärgem seda teha. Seadme sisemust, meil kataloog nimega Vhosts, virtuaalne võõrustajate kärpida kohalik host, kärpida avalik. Nii et see on natuke verbose, kuid pikk lugu lühike, et seade on mõeldud mitte ainult toetada C. Samuti kavandatud toetama PHP. Aga see on ka mõeldud web server ja andmebaas server. Ja see on projekteeritud ja tõeliselt konfigureeritud, olema meenutab iga kaubik web hosting ettevõte, mis sa võiksid maksta $ 5 kuus, $ 100 kuus. Ükskõik teenus on, see on konfigureeritud olla väga sarnane Reaalses maailmas tootmise server. Ja mida see tähendab, on see, et see töötab Seade on veebiserveri tarkvara. See juhtub, et kutsuda Apache. See on lihtsalt tasuta ja avatud lähtekoodiga ja väga populaarne. Ja meil on seadistatud Apache teada et kui ma külastan teatud URL, koos Chrome või brauseri sees seade, et uurida selle kataloogi failide jaoks kasutaja taotleb. Teisisõnu, andke minna ja seda teha. Toas minu avalik kataloog, ma lähen minna ja luua uus fail nimega index.html. See annab mulle lingile siin. Ja ma lähen väga kiiresti ja minna ja paugu välja Selle programmi siin. DOCTYPE HTML, mis nüüd, just eeldan, et sa pead kirjutama. See on lihtsalt kauge tag, mis ei ole tõeliselt HTML tag, mis määrab, et siin on mõned HTML. Ma lähen edasi minna ja taastada mida nägime hetkeks tagasi. Siin on pea osas. Toas oli pea - nii pealkiri. Nii ütleme tere, maailm. Ja siis siin all oli body. Lubage mul lõpetada body. Ja siis siin ma ka öelda, lihtsalt selguse, tere. Nii et see on väidetavalt lihtsaim võimalik veebileht te saab teha, et see kehtib. See on süntaktiliselt korrektne. Kõik, mis on avatud on suletud. Kõik on kenasti stiilis ja liigestatud. Vaatame nüüd, kuidas ma saab avada faili. Noh, lubage mul minna Chrome siin. Ja lubage mul minna http://localhost/index.html. Mis on kohalik server? Noh, kõige tahes arvuti maailmas, Linux, Mac OS, Windows, on hüüdnimi kutsus kohalik host. Nii et kui sa kunagi tahad rääkida oma arvutisse - olgugi, veidralt reflexively - helistate ise kohalik host. Ükskõik milline on sinu tegelik arvuti nimetatakse, kas see on Taaveti MacBook Air, või midagi verbose niimoodi. Nii et see link on ilmselt kavatse kasutada HTTP rääkida kohaliku peremehe sama arvuti, seadme-ja see läheb küsida, võtke lihtsalt arvan, mida faili? Index.html. Seega seade on konfigureeritud eelnevalt teada, et kui ma palun midagi nagu index.html, otsige kausta nimega Vhosts, in kausta nimega localhost, kausta selles nn avalik. See on koht, kus kõik mu avalik faile saab olema. Nii et ma nüüd lähen Enter. Ja kurat, on see keelatud sõnum, mida nimetatakse 403, numbrilise koodi. Mis on valesti? Noh, see ei ole piisav, et lihtsalt panna faili sees minu kausta. Mul on vaja tegelikult teha järgmist. Lase mul minna minu Vhosts kataloog sisseveo localhost, riikliku ja lase Teen Kas kriips l. Ja seal on mõned muud asjad siin tänase eesmärkidel. Aga teate vasakul servas, kõrval et index.html, me näha ainult üks RW. Ja minevikus, mida on RW seisis? Lihtsalt lugeda ega kirjutada. Asjaolu, et ta ütleb rw vasakul tähendab, et mul on selle faili omanikku, saab lugeda või kirjutada. Aga mul on vaja, et lasta kõik inimesed maailma lugeda seda, kuigi mitte kirjutada. Nii et ma lähen muuta viisi faili chmod, kõik pluss r anda igaüks lugeda luba edasi fail nimega index.html. Ja kui ma nüüd Korda LS kriips l, teade et, siin on mõned rohkem Ri on hüppasid üles. Ja nüüd, spec läheb üksikasjalikumalt. P komplekti 7, mis tähendab lihtsalt kõigile saab nüüd lugeda seda faili. Kui ma lähen tagasi oma brauseris nüüd ja uuesti, voila. Tere maailm. Ja ma ei saa isegi avada minu Chrome tööriistad ja vaata, just nagu Google ja Facebook, et seal on minu HTML, vormindatud vähe erinevalt ja värviline. Kui ma lähen võrgu kaart ja asetage lehekülje märgata, et seal on saada taotleda, et Chrome on saatmine seadmele. Seal on 200 kohta, et konkreetse faili. Nii lühike, on see, kuidas kõik need erinevat tulevad kokku. See lihtsalt nii juhtub, et web server me kasutame praegu ei ole väike, nagu Facebook. See on sõna otseses mõttes sama arvuti, mis on täiesti OK. Nii et mida rohkem me saame teha veebilehele? Noh, lihtsalt, lähme põgusalt paari neid asju. Aga lubage mul minna ja uuesti Gedit koos index.html. Ja lubage mul minna ja tere öelda CS50, salvestada see fail, mine tagasi brauser, tõesti underwhelming muutusi. Aga mis siis, kui me tahame, et tegelikult linkida midagi nüüd? Nii selgub, et meil on lingid HTML, mis on lihtsalt sildid ise. See juhtub, et kutsuda ankur tag. href võrdub https://www.cs50.net, www.cs50.net Sulge quote, sulg. Ja nüüd vaatame, mis muidu tuleb järgmisena. Olen avatud tag. Nüüd on vaja, et anda sellele fraas nagu CS50. Lubage mul lõpetada tag. Ja teate mõned asjad. Kuigi seal on see segasena asi siin, ma ei korrata, kui sa sulgeda tag. Sa lihtsalt sulgeda tag tema nimi üksi. Ja see on see, mis on tuntud kui atribuudi väärtus. Omadused lihtsalt muuta käitumist Mõnede tag sees lehekülg. Nii et see on määratud kindlaks, et hüper viide, fancy viis öelda URL selle ankur, selle link peaks olema CS50.net. Ja tekst, mida me tahame näidata kasutaja ei ole nii toores URL, vaid pigem sõna CS50. Nii et kui nüüd ma uuesti laadida, lubage mul suurendada eest selgus, lubage mul asendusostu lehekülge, teate, et meil on see vana kooli sinine allajoonitud link. Ja kui ma hover üle, ja see toimub olla raske näha, et all vasakul nurgas ekraani, teate et ta ütleb aadressi, kuhu Ma lähen minema. Ja kui ma vajutan sinna, voila, nüüd ma teen veebilehti. Ja me oleme viinud end et kodulehekülg. Aga teate, mis potentsiaal see pakub meile. Turvalisus on väga palju moes nendel päevadel. Mis siis, kui ma selle asemel öelda midagi seda, ja ma selle asemel minna, ütleme, olgem vaata, fakeCS50.net. Värskenda seda lehte. OK, nii et teate seda ikka näeb välja nagu ma olen läheb CS50, kui nutikas silma märkad ma lähen võlts CS50. Ma arvan, see domeen ei ole võtnud. OK, nii see ei ole kättesaadav. Nii see on hea. Keegi tegelikult on, et domeen. Aga olgem veidi pahatahtlik sest see on tobe. Mis siis, kui me muudame seda Paypal. Ja mis siis, kui me nimetame seda, nagu, www.paypal.badguy.com, olenemata domeeni. See ilmselt olemas. Nüüd lubage mul asendusostu lehekülge. Ja siin me oleme omamoodi phishing rünnak, P-H-I-S-H-I-N-G, mis on tobe sõna antud rünnak püüab kala teavet või parem veel, raha välja inimesed tricking neid teabe, et nad muidu ei tee. See tundub täiesti õigustatud, eks? Mul peab olema link siin Paypal.com. In õigluse, kui ma mingit sugu ta välja mõned graafika, saame muuta see otsima rohkem nagu PayPal. Õigus? Sest ma saaksin, kui kõrvale jätta, Ma võiks minna Paypal.com. Ja me oleme just näinud, kuidas ma saan vaata kõik oma HTML. Ma võiks lihtsalt kopeerida ja uuesti esteetika Paypal mitte minna vana kooli siin. Aga teate, muidugi, ja see on natuke väike ikka, ainult põhja vasakus nurgas, et nagu 10 punkti font, sa näed, mida URL oled tegelikult saab olema viis. Ja kui te olete kunagi saanud rämpsposti öelda minna, ja sa oled konto on rikutud. Palun kliki seda linki ja andke teada, oma parool, et saaksime tagada oled sa, ei ole kunagi seda teha. Need asjad peaks olema iseenesestmõistetav. Aga see on imeliselt lõbus, ja traagiline, kuidas igal aastal see tundub juhtuda mõned nullist hulk inimesi. Ja see on ilu phishing rünnakuid. Võite saata miljoni e-kirju. Ja isegi kui 0,01% inimestest tegelikult klõpsa Paypal ja teile oma parool, see on ikka nullist number inimesed, kes olen lihtsalt annab sa oma raha. Ja saata e-kirju, muidugi, on üsna lihtne ja sisuliselt vaba nendel päevadel. Nii pikk lugu lühike, imeliselt ilus mõte, eks? Aastaid tagasi, see oli varem veebis, mis võimaldab web hüperlinkide vahel ressursse. Aga nii kiiresti see võiks olla kasutatakse haige eesmärkidel. Ja e-posti, siis piisab sellest, kui öelda, need päeva, on HTML varjatud sees. Noh, las ma lihtsalt veel üks asi. Ja me lükata suuresti jagu probleem seatud seitse, mis võimaldab teil uurida üksikasju. Aga lubage mul minna ja teha mõned asjad siin. Ma lähen minema ja kuulutama mida nimetatakse div või jagunemise osas. Lubage mul lõpetada, et div tag. Ja ma ütlen üles siin lehe ülaosas. Ja siis alla, ma lähen tegema midagi muud div, sulgege see tag, ja tegema lehekülje. Ja olgem salvestage see. Nüüd lähme tagasi oma faili. Väga underwhelming. Aga mida divisjoni kasutatakse, all kapuuts, on see tegelikult kena struktuuriline element. See ei ole mingit esteetika kuivõrd näeme, va ilmselt paneb asjad on uued liinid. Aga teate, kui kõrvale jätta, vaid lööb Sisesta ei lõigata HTML nagu see Mis aastal C. Võib arvata, et see on panen kena suur vahe ülemine ja alumine leht. Aga see tähelepanuta. Valge ruum on sisuliselt ignoreeritud veebilehti, va kõige esimene tühikut isiksuse või kelgutagastusmärgid et vajutad klaviatuuril. Kui soovite rohkem reavahetused, siis pea seda ise. Nii et ma lähen tegema mõned asjad siin näidata, mis toimub. Ma lähen lisada atribuut, mis olemas ja jälle, kuidas sa õpid mis omistab olemas, mida sildid on olemas, tõesti, online viited. HTML on omamoodi keel - see on ei programmeerimiskeelt. See on märgistuskeel - et pärast hea pool tundi, võib-olla, tund see, saate kindlasti aru, kõige tõenäoline, põhiidee. Ja siis Google otsing kaugusel on kõik võimalik sildid, mis sa võiksid olla huvitatud Ja kohta spec, mis on üsna tervitada ja julgustada siin. Nüüd lubage mul minna ja midagi sellist teha. Background-color. Ja nüüd, ma lähen tegema midagi nagu punane, semikoolon. Ja te võite seda teha mitu erinevat võimalust. Ma olen lihtsalt omamoodi kirjutades seda super selgelt kui võimalik. Aga selgub, et see väärtus siin on mida nimetatakse CSS, kaskaadlaadistiku Lehed, mis on teise keel üldse. CSS ei ole midagi pistmist avada sildid ja tihe sildid. See on pistmist omadused. Ja omadused on lihtsalt põhiväärtus paari, mis tähendab lihtsalt mingi sõna, koolon ja seejärel mõnda muud sõna. Ja kui teil on mitu ones või lihtsalt üks siin, võite selle lõppu semikoolon, lihtsalt selguse huvides. Aga see ka töötab siin. Nüüd mis see nüüd teeme? Te saate tõenäoliselt arvan. Lubage mul minna ja laadige see leht. Ja nüüd on see tõesti tuleb. Niisiis peale minu leht on punane. Aga mis on võti siin on see, et ma mainisin varem, et div annab teile jagunemise osas. Ja see on tõesti see, mida ta teeb. Sisuliselt jagab lehekülje ristküliku, mis saab siis manipuleerida. Ja seda mõistet ristkülikud on selline olulisemaks, et kui sa arvad kõige tahes veebilehel, seal on ilmselt mõned struktuuri ta. Enamik olete ilmselt harva Facebook kodulehel, kui olete sisse logitud kogu aeg. Aga Facebook kodulehekülg, seal on mingi div ülaosas. Ja see ei pruugi olla nii lihtne ühe div, kuid seal ristkülikukujuline piirkond seal. Ülejäänud leht on nagu tohutu div, nagu palju suurem ristkülikukujuline piirkond. Nii pikk lugu lühike, lihtsalt võttes neid vähe ehitusplokkide võime mudel asjad nagu ristkülikud, kas lai või kitsas, saate ka teha veerud potentsiaalselt võimaldab teil panema lehekülge, tõesti, aga sa tahaks. Me tõesti ainult kriimustada pinda siin. Tõepoolest, kui ma üks teine, lase mul minna ja teha stiilis background-color, me teeme midagi nagu sinine, lähedal hinnapakkumisi. Vaatame uuesti seda. Nüüd see muutub veelgi koledam. Aga nüüd ma saan sellist uhkeldama minu P määratud viis oskuste, eks? Red. See meenutab mulle RGB, Red Roheline Sinine kolmikud. Noh, selgub veebi programmeerimine, või web design, mis on see, me oleme veel programmeeritud midagi per se, saab tegelikult on Heksadesimaalikoodin. Seega midagi midagi midagi midagi, midagi, midagi. Nii saab olema kuus kuueteistkümnendsüsteemis märkide või kolm, mõnel juhul ja kõik need küsimärgid Peab olema kuueteistkümnendarvudega, null kuni f. Kui ma tahan olla palju punane ja rohelist ja sinist, mis on vastand null kasutades hex? See on f. Ma võin teha ff, null null, null null salvestada, ja nüüd siin. Ja ma tegelikult ei näe muutusi. Nii quote Tsitaat lõppeb "punane" on ilmselt sünonüüm kõik punane, ei roheline, mitte sinine. Vahepeal teeme tahtlikult muuta see peab olema midagi juhuslik, nagu ABCDF. Vaatame, mis see on. See on tõesti kena sinine, tegelikult, baby blue. Olgu, need on lihtsalt nüüd mõnevõrra juhuslik kombinatsioonid tähemärki. Nii et me ei Tyssätä siin. Aga jälle, see räägib täpsus et saab hakata kohaldatakse - isegi kui sa oled väga ülekoormatud poolt esteetika. Tegelikult, kui sa tõesti tahad olla muljet, lubage mul minna ja muuta kirjasuuruse, näiteks. Ja teate semikoolon, mis on vaja seal. Fondi suurus, võime olla lihtsalt naeruväärne siin, 96 punkti. Salvesta seda. Wow, see on suur kirjasuurus. Olgu, see on väga lihtne. Ja tegelikult, sa oled sisuliselt nägemine kõige esimene veebileht tegin aastat tagasi, kui ma esimest korda õppinud seda kraami. See on väga lihtne teha väga jubedusi kiiresti. Ja kui sa oled tuttav Wayback Masin archive.org, siis leiad kõik mu kole undergrad veebilehti. Üks oli Kermit Frog ees. Läksin läbi faasi, kus ma arvasin, see oli lahe, et võtta taustal punane kardin, kui sain teada, kuidas te saab plaat pilte uuesti ja uuesti, ja uuesti, et täita lehekülge suur kleepuv punane kardin. Ja siis, peale seda, oli ikoon et sa pidid kliki siseneda minu kodu lehekülg, sest see oli väga moes. Ja siis minu esimene programm, mida ma kunagi kirjutasin ei olnud PHP, kuid keel nimega Pearl kirjutas külalisraamatusse, mis on väga lahe asi, mis Paljud inimesed eeldavad, et oled avaldab kodulehekülg. Kui sa saad lehele, mida nad tahavad sind sisse logida, ja öelda, kes sa oled, ja miks sa oled seal. See on väga 1990ndate stiilis web design. Aga need päevad, kindlasti oleme tulla palju kaugemal. Ja te näete, et osa, ja isegi aasta probleem seatud seitse, mida võimendades raamatukogud nendel päevadel, see on nii palju lihtsam teha ilusam asjad kiiresti. Tõesti siin, me lihtsalt kriimustada pinnal, mida saate teha stiililiselt. Ja tegelikult juba, lubage mul rõhutada, et see on juba saada inetu, ei lihtsalt esteetiliselt, kuid seoses stiil minu kood, või disain minu kood. Olen praegu comingled HTML, mis on rohekas avatud sildid seal, kus CSS omadused, mis on täiesti õigustatud. See on tõesti, kui keel oli oma päritolu. Aga huvides puhas disain, palju nagu alustasime faktooring värk välja C faile. h faili, lase mind tegelikult harjutada sellist põhimõtet ja alustada teed Selle asemel. Las ma panen stiil tag siin, mis on olemas ka HTML, ja lase mind täpsustada järgmist. Las ma kustutan selle. Tausta värv saab olema punane. Ma lähen kustutada täielikult. Ma lähen, et saada lahti stiili omistada, ja ma lähen üheselt selgitada selle div koos sõna - suvaliselt, vaid mõistlikult, quote Tsitaat lõppeb "top". Ja id on eriline atribuut, mis unikaalselt määratleb teatud HTML element kellel et id. Kui ma nüüd tahan stiliseeritud seda, kuni siin pea minu lehe sees style tag, märkate, et Ma saan hash top. Ja siis ma ei pane paar lokkis traksid, meenutab C, ja seejärel lasta mulle kleepida et stiliseerimine. Ja lubage mul minna siin ja ennetada kui ma lähen seda. Lubage mul ka luua kõige alumine div. Lubage mul rüütama see kole kood maha siin, pane see siin ja ma tulen veidi anal nüüd ja stiliseeritud see poolt lihtsalt paneb asjad omal line, mis lõpeb semikooloniga. Lubage mul vabaneda stiil tag. Aga ma pole seda veel teinud. Mul on vaja teha üks asi. Jah, ID võrdub quote Tsitaat lõppeb "alt" või mis iganes id tahan anda, et element. Nüüd lubage mul minna tagasi siia. Ja see on metsik. Ma ei saa tegeleda 96 punkti. Teeme 24 punkti. Või siis võiks olla täpsem. Võite tegelikult kasutada pikslit, px, nii et sa tõesti peenem tera kontrolli oma lehele. Nagu kõrvale, see ei ole tingimata parim asi, kui kasutajate jaoks kättesaadavus põhjustel taha võimalik suurendada suurused. Nii mõistame, et on olemas viise asju, mis ei pruugi raske koodi kõike. Olgu, see on suurem, 24 punkti, kui iganes vaikimisi. Aga nüüd on see veidi puhtamaks. Ja lubage mul seda ühe sammu edasi. Just nagu idee header faili, märkate oleme ühe sammu lähemale, et. Mul on arvutatud välja, kuid ikka, sees minu lehele neid CSS reeglid. Miks võiks ma tahan seda sammu edasi, eemaldage see täielikult ja pane see eraldi faili? Ma võin seda kasutada, eks? See on lihtsalt selline intuitsioon kohe. Enne, ma väita, et see oli lihtsalt saada inetu võttes stiil Omadused sees DIVs ise. Aga selline arvates läbi. Nagu lehel saab kauem ja kauem, kui sa paned siin ja siin, ja siin ja siin, kõik need erinevad värvid ja font suurused ja muu selline atribuudid, lehel on väga kiiresti läheb muutunud juhitamatuks teile. Kui keegi tuleb teie ja ütleb, oh, sa tead, mida? Ma tõesti tahaks muuta fondi suurust kaks lisapunkti, siis oleks võinud minna ja otsida ja asendada suur hulk ridu koodi. See on palju selgem, et koondada kõik nagu esteetika siin. Aga kui soovite, et uuesti neid esteetika mitu veebilehekülge, kõik rohkem kaalukaid jaoks Näiteks luua faili nimetatakse nende sisu. Ja lubage mul seda teha. Salvesta see fail. Ütlen styles.css, meelevaldne, aga tavaline. Ma panen selle John Harvard koju kataloogis praegu lihtsuse. Ja mida ma saan teha minu veebileht on saada lahti stiilis tag üldse, ja mõnevõrra unintuitively, kasutage link tag, mis ei anna teile lingi hüperlinki klikitav mõttes, vaid kui ma ütlen, link, href võrdub styles.css. Ja suhe, et see element on koos veebileht on olla oma stiil. Niisiis, kuidas ma tean seda? Üks, sa lihtsalt lugeda kasutusjuhendit, või te Google'i ümber, ja sa vaadata erinevaid vahendeid. Ma mõtlen, et tõesti on see, kuidas te kiirenemist tehnikaid nagu see, ja järjepidev Selle idee õpetamise enese uus keeles, jälle sa leiad, et seal on ainult piiratud hulk asju mis tahes keeles, et kui sa saad neid, leiad, et see muutub kiiremini ja kiiremini kirjutada. Tõepoolest, õppida uue programmiperioodi keel on nii palju kiiremini, kui uus kõnekeel, sest need asjad on palju väiksem ja palju muud täpselt määratletud. Aga ma olen rõhutanud natuke on anomaalia siin. Miks ma esile selle kaldkriips siin? Sest mul on sulgeda tag. Ma sulgeda tag. Ja leiad lugematuid ressursse line, mis ei vajalik tihe sildid. Ja reaalselt, see ei ole rangelt vajalikud tehnilised ja on põhjustel reaalsuse, brauserid on vaid üsna tolerantne vigu web lehekülge, hea või halb, kuid enamasti hullemaks. Nii et see siin on lihtsalt puhtam viis öelda midagi loll nagu see, kus, kui soovite avada link tag aga sulgeda, seal on tõesti mingit mõiste sisu eest link tag. See tähendab lihtsalt, laadige see fail ja pane see siia. See on nagu terav Kaasa C. Võite avada ja sulgeda tag korraga Samasse tag. Ja seal on teisi näiteid. See ei ole viis, kuidas seda teha, kuid br tag jaoks reavahetused, kui ma tõesti tahtsin saavutada seda, mida ma olin üritab enne lööb Enter, kui Ma selgesõnaliselt öelda Reapiiri Reapiiri Reapiiri Reapiiri ja seejärel laadige see leht, nüüd märkad et lehe allosas on Tõepoolest, palju kaugemale alla lehekülje allosas. Aga isegi, mida saab teha palju rohkem puhtalt CSS, ja marginaale, ja muude selliste esteetiliste tehnikat. Nii et nüüd, takeaways on see. HTML, meil on need asju nimetatakse sildid. CSS, meil on need asjad nimetatakse omadused. Saame comingle need kaks keelt, kasutades kas style atribuut, või stiilis tag või parim veel, faktooring pihta, kui me teeme Probleemse määratud 7. Küsimused, seejärel umbes kontseptuaalne põhitõdesid siin? Publik: mul on üks küsimus. SPEAKER 1: Oh, vabandust. Publik: Miks ei olnud see värviline - SPEAKER 1: Oh, teistes tab? See siin on? Publik: Ei, see on nagu - SPEAKER 1: Oh, see on sellepärast, Olin on lohakas. Panin faili vales kohas. Nii et kui ma tegelikult pane see siia ja ma chmod see kõik + r styles.css ja Nüüd laadige leht uuesti, nüüd saada stiliseerimine tagasi. Ja kuna font suurused erinevad, ei näe me üsna palju valge ruum. Me mitte näha, mis on Vaikimisi on selle asemel. Hea küsimus. Jah? Publik: Miks on link tag sees header? SPEAKER 1: Miks on lingid tag sees päises - Lühike vastus, just sellepärast. See on see, mida otsustati. See, kui link sildid lähevad sul on, mida nimetatakse väline stiil. Muud küsimused? Olgu teeme seda. Meil on nii palju lõbu meie ees täna. See on lihtsalt kriimustada pinna CSS. Teeme seda. Võtame viis minutit pausi siin sest iga minu e-posti, lähme riputada seal kuni 02:30-ish täna. Aga kui sa ei pea jäta, see on hea. Aga me läheme edasi pärast viis minutit puhkust. Ja õpime natuke midagi umbes PHP, MySQL ja rohkem. Olgu, proovime, nüüd siduda mõned neist ideedest koos ja teha, öelda, meie enda otsingumootori. Märkasin, pigem uudishimulikult, järgmised. Kui teil on Google.com, sa oled tavaliselt URL nagu see siin mitte midagi peale dot com. Aga kui ma otsin midagi loll nagu kassid ja vajuta Enter, et me jõuame - mitte loll, aga sa tead. OK, nii et teate, ülaosas lehekülge, nüüd, link on muidugi muutunud. Ja see ei ole midagi uus, et keegi meist. Klõpsate lingid ja stuff juhtub veebis. Aga mis on huvitav siin on järgmine. Seal on palju segadusega, kuid lubage mind visata asju, mida ma ei ole päris hästi aru või ei tõesti vaatama asjakohane. Lubage mul vabaneda sellest. Lubage mul vabaneda sellest. Ja las ma lihtsalt lahti saada see kõik. Ja nüüd teate, et kassid on URL, järgida q, siis võrdne logi sisse ees. Nii selgub see, kuidas kuidas see toimib, kui tegemist on sisend ja väljund. Me oleme kaua rääkinud mustad kastid, eks? Nii et kui see on funktsioon rakendatud siin on must kast, kulub sisend ja annab väljundi, noh, tähendab mille abil anda oma panus kodulehel on teel, sageli oma URL. Sa lihtsalt panna küsimärk ja seejärel klahvi võrdub raha. Ja siis äkki ampersand, ja siis teine ​​võti on võrdne väärtus, siis võib-olla teise märgi, võti on võrdne väärtus. See, kuidas sa edasi ka võtmed ja väärtused, paari sisendeid. Nii et kui ma Enter nüüd, mis on huvitav Google on see, et kõik et segadusega ma välja ei ilmu tingimata vajalik. Kõik ma pean saatma Google'ile on küsimus märk q võrdub kassid saada tagasi mõned kassid. Noh, mis tähendas seda, siis, on see, kui ma tõmba gedit, ma olen hakanud muutes oma otsingumootori siin aastal fail nimega seach0.html. Ja lubage mul minna ja kustutada veel üks joon, mis te ei tohtinud näha. Ja nüüd, lubage mul minna oma brauseris nii mitte Google, ja minna http://localhost. Ja see läheb saada takistuseks. Nii et me ei kavatse öelda hüvasti et nüüd, liiguta seda siin, oh, nüüd me peame hüvasti, et faili. Kui teil on fail nimega index.html või index.php sisse kataloog, kui veebiserver on konfigureeritud nii, mida saate vaata, vaikimisi on sisu, et faili asemel loetelu kataloog, nagu ma tahtsin siin. Veel selle aasta spec. Sa ei näinud seda. Nii et see on see, mida ma tegelikult tahtsin. Aga hetk tagasi oli fail selles kaustas nimega index.html ja index.php. Ja nii veebiserver oli näitab mulle neid faile. Selle asemel, ma tahan, et see kataloog loetletud siin. Ma lähen minema CSS ja minna search0. Ja ma väita, et see on see saab olema alguses oma konkurentsivõimeline otsingumootori. Ja et seda teha, ma lähen minema siin sisseveo CSS ja avada koos gedit, search 0. Aga kahjuks pole ei ole palju siin toimub. Kõik mida ma ei olnud kasutada pealkirja tag, mis juhtub nimetada h1, mis Sisuliselt tähendab suur ja julge, ja see on kõik. Aga mille abil saame anda sisendeid nende kaudu asju nimetatakse vorme. Nii et lubage mul minna ja avada ja sulgeda, ennetavalt, vormi tag seal. Ja lubage mul minna ja teha midagi sellist. Input tüüp võrdub teksti. Ja siis lähme sulgeda tag jooksul Sulgudes ise. Mul ei ole vaja hakata tekstiväli ja lõpetage tekstiväljale. See on lihtsalt saab olema seal või mitte. Ja siis alla, et teeme sisendi tüüp võrdub esitama. Salvesta see. Ja nüüd siis teha kiire meelerahu vaadata. Teeme uuesti. OK, nii see ei ole halb. See ei ole Google'i stiilis, aga see on üsna lähedal. Seal on tekstiväli. Ma ei kirjuta mõned asjad, Enter, kuid midagi ei juhtu veel. Ja see on, sest ma ei ole määratletud hagi vormi, nii rääkida. Nii et kui ma lähen tagasi vormi element, Selgub, ja ma tean, et see ainult omamast dokumentatsiooni lugeda, et vormi tag võtab atribuut nimetatakse tegevust, mis on URL kohta veebilehe, kus sa soovite saata kujul. Ma tõesti ei arva, et me aega rakendada kogu kolp eest otsingumootori täna. Nii me lihtsalt öelda, eh, minna google.com / search. Ja nüüd andke mulle sulen hinnapakkumisi. Ja lubage mul täpsustada, et meetodit kasutada saab mida nimetatakse saada. Pikk lugu lühike, seal on kaks võimalust, on vähemalt, et saate esitada teavet alates brauseri server. Üks on saada ning tänase eesmärkidel see tähendab lihtsalt URL. Näed täpselt küsimärke, võrdusmärke ja sümboliga, mis me nägime. Või on olemas alternatiiv nimetatakse ametikohale. Praegu teame, et postitus on sageli kasutatud kui soovite faile üles laadida, nagu pilte ja nii edasi, või kui soovite esitama krediitkaardi andmed, või paroole, midagi, et see ei tõesti mõtet, kontseptuaalselt või turvalisus tark, et lõpuks URL brauseri kus snooping vanemad, või toakaaslased või keegi, kellel on juurdepääs et arvuti võib näha. Teeme salvestada et siin. Ja ma pean tegema veel üks asi. See ei ole piisav, vaid et ütlevad mulle tekstiväljale. Mul on anda selles valdkonnas on Väärtustame nimi. Nii et lubage mul laenata Google'i valik nimed, q, ning täpsustada, et teine omistada ma tõesti ei hooli nimi nuppu Esita. Kõik, mida ma hoolin on esitanud mida kasutaja tipib sisse Ja nüüd see on selline kole. Ta lihtsalt ütleb esitama. Selgub, ja tean seda dokumentatsioon, ma ei saa tegelikult öelda väärtus võrdub quote Tsitaat lõppeb "CS50 Piiratud, "close tsiteerida. Siis lähme uuesti uuesti. Nii ma saan pihta Command-R või Kontroll-R minu klaviatuuri uuesti laadida. Nüüd on meil rohkem huvitavaid otsingumootori. See ei ole päris välja nägema Google veel, kuigi. Nii lähme edasi siin ja teha natuke reavahetuse. OK, nii et nüüd on meil Google. Me tegelikult peaaegu ei ole Google. Nüüd mis juhtub? Ma lähen kirjuta midagi nagu kassi. Ja brauser läheb sõeluda et vorm, mida ma määratleda. Ja see saab saata kasutaja, et URL. Nii et see aeg, mõnede kummaline põhjus, Sain rohkem teavet kalavarude kui tegelike kassid. Aga see on hea, sest teate me ikka lõpetasin siin, q võrdub kassid. Nii pikk lugu lühike, tundub üsna triviaalne saada sisend kasutaja. Ja kui aus olla, ei kimpu teist tüüpi vormi väljad. Seal on ruudud, ja vähe vastastikku eksklusiivne nööpide ja rippmenüüst menüüde ja rohkem. Aga kõik need on suhteliselt kergesti rakendada see tekstiväli oli. Ja lõpuks, me peame lihtsalt tegema kindel, et keegi ei kuula teiselt rea lõppu, et saada, et töödeldava teabe, kuidagi, ja anda meile tagasi meie kassid. Vaatame veidi rohkem seotud näiteks. Lase mul minna minu Vhost on kataloogi, kohalikku host, avalik ja kui ma panna tänane lähtekoodi. Kõik see toimub kursuse veebileht, kus saab käpard. Ja kui ma minema froshims, lubage mul avada üles selle faili nüüd, froshim0.php. See üks on natuke verbose, nii me ei kirjuta seda nullist. Aga teate nüüd paar mõnevõrra tuttav omadused. Üks, vormi tag erinevaid meetmeid. See ei ole täielik URL. Nüüd on ilmselt fail nimega register0.php sest hetkel Ma lähen õpetada ennast veidi midagi PHP, programmeerimine keel, sest PHP saab kasutada rakendada, mida Google rakendatud tagasi lõpuks oma otsingumootorid. Google tegelikult ilmselt kasutab mõned Python, mõned C + +, ja kobarad teistes keeltes. Aga me võiksime kindlasti rakendada otsing tulemusi, kasutades PHP kui tahtsime. Aga nüüd, me hoida lihtsa. Ja see on tegelikult meenutab üks teise väga esimene veebilehed I tehtud aasta tagasi. Tagasi minu päev, siis registreeritud ettevõttesisene sport nagu uustulnuk poolt täites paberile, kõndimine üle õue, ja kukutades seda postkasti Proctor sisse Wigglesworth, ja see oli, kui sa registreeritud. Ja nii minu projekt varsti pärast CS50, oli panna, et mis teeb meistriks mõttes, veebi, mis ei olnud nagu moes siis, kui see on praegu. Aga kõik me pidime tegema, oli luua sisuliselt HTML-vormi. Ja et vorm tundus umbes niimoodi. Mul oli sisendiks uustulnuk nimi. Mul oli teine ​​ruut või või nad ei tahtnud olla kapten, mida nende sugu oli ja mida nende ühiselamus oli. Ja siis ma kõva kodeeritud asjad nagu Apley Kohtu ja Canaday, Hallid, ja nii edasi. Nii et taas, uued sildid. Ei ole näinud neid enne, uus atribuudid, kuid üsna kättesaadavad. Kui näete näiteks, saate objekti ja laenata, et idee ja teha drop rippmenüü jaoks kõige midagi. Aga mis peamine on see, et iga need asjad on nimed. Ja allosas selle vormi, seal submit nupp mille etiketil või väärtus on registris. Nii lähme sellele lehele. Lubage mul minna tagasi kataloogis. Lubage mul minna froshims, ja minna froshim0.php. Nii et see on kole, see oleks õiglane. Nii et ma oleks kindlasti Stilisoida see mõned CSS, ma võiks teha mõned graafika, võibolla lisada mõned värvid, ja muuta see ilusamaks. Aga funktsionaalselt, ma väita, et see on tegelikult päris valmis. Kahjuks, kui ma täitke see ära, David, kapten, Mees, me valida, oletame Matthews, register, kõik, mis juhtub on see. Aga teate paar takeaways. Üks, mida fail tagastatakse need tulemusi, ilmselt? Nii et see on tõepoolest register0.php. Nii, et me nägime, et hagi väärtus hetkel tagasi võtta register0 see kinnitab, et me tõepoolest lõppenud kuni selle konkreetse faili. Nüüd on see lihtsalt inetu tekst. Aga teate, et see tekst on pärit kohaliku peremehe mis on seadet. Mõtle seade nüüd lihtsalt web server, mis võivad olla Science Center. See võib olla tegelik web. Nii et see on avalikult kättesaadav. Nii selgelt, seal on kuidagi läbimise vormiväljale sisendite server nii et ta saab midagi teha nendega. Kahjuks register0 on päris loll. Kõik see on välja printida array mis näeb välja selline. Ja see ei ole massiivi selles mõttes, et me teame seda. Selgub, et PHP ja palju keeles, ei ole mitte ainult arvuliselt indekseeritud massiivid kelle esimene indeks on null, üks, siis kaks, siis dot, dot, dot, n miinus 1. See on see, mida nimetatakse assotsiatiivne massiiv. Assotsiatiivne massiiv on selline, kus saate salvestada põhiväärtus paari kus võti ei pruugi number. See võib tegelikult olla string sõna. Ja nii see on võimalik rakendada, all kapuuts, selgub, kasutades andmete struktuuri, mida nimetatakse? Arvasin midagi dramaatilist oli umbes juhtuda - hash tabelis. Nii hash tabel, mäletate, you need kes tegi seda P komplekt 6 või isegi meenutada see, vähemalt isegi kui sa proovida, hash tabel, meie kasutamisest, kasutati lihtsalt hoidke sõnu. Aga tõesti, sa olid hoidmine võtmed ja väärtused. Kui te ellu hash tabelit P määratud 6 sõnastik, võtmed olid sõnad ise, ja väärtused oli tegelikult õige või vale. Jah, siin, või kaudselt, Ei, mitte siin. Noh, võib üldistada, et idee. Ja me võiks kasutada väga sarnane andmed struktuur salvestada ei string ise üksi oma hash tabel, kuid Oletatakse, et iga ühe oma hash tabeli tippu. Ja siis võiks isegi seda teha proovida mitte lihtsalt bool. Sul võib olla midagi muud. Mis siis, kui võti ei maxwell jaoks Näiteks vaid quote Tsitaat lõppeb "nimi" või Tsiteerin lõppeb "kapten." Ja sees oma C andmestruktuur, paned väärtus, mitte ainult Loogiline, kuid väärtus nagu quote Tsitaat lõppeb "David" või "M" või "Matthews," ja nii edasi. Nii et need sama andmestruktuurid kasutasime ilmselt on olemas ka teistes keeltes. Ja ma tahaks väita, et nad on tegelikult palju, palju lihtsam juurdepääs siin. Olgem tegelikult vaatleme nüüd mõned sellised süntaks. Ma lähen minema PHP kataloog. Ja ma lähen avama parem versiooni tere-0-st enne. Pange tähele, et kõik, mis ma tegin, oli lisada mõned märkused. Nii saame lahti saada, et juhtida tähelepanu kõrvale. Ja see programm tõepoolest prindib tere, sest ma olen määratletud vahel sildid, et ma tahan täita selle koodi. Nüüd me näeme, et hetkel miks see on kasulik. Aga Avame ühe teise näiteks siin. Lubage mul minna ja avada öelda, gedit tingimuste üks. See on viis ajas tagasi nüüd. Aga nädal tagasi, ma arvan, et nädal üks või nädal kaks oli meil näiteks nn conditions1.c. Ja ma otsustasin implementeerid see PHP, lihtsalt mingi rõhutada, et PHP, süntaktiliselt, on peaaegu identne et C. See ei ole suur hüpe eelmisel nädalal sellele. Teade ülaosas see programm, mille algab, kui varem, sest mõned kommentaarid, mis ma vabaneda AS häiritud. Pange tähele, et ma olen PHP režiimis selles failis. Nii et see kood, me näeme, saavad täidetud. Pange tähele, et seal on readline, mis on ilmselt analoog PHP kohta getString. Teade, et see on veidi erinev. Sa tegelikult täpsustada viip funktsiooni nimetatakse lugeda line, ja see on mida kasutaja näeb. Nii et sa ei pea printf käsitsi. Aga see ei ole suur asi. Ma lähen hoida, sees $ n, tagastatav väärtus see, et olenemata kasutaja liigid on nende int. Ja siin on veel uudishimu. Selgub, PHP, iga muutuja lihtsalt tuleb eesliide koos dollari märk. See on natuke tüütu. Aga teate, mida ma teinud ei ole PHP. Mis puudub vasakul pool võrdusmärki? Ei mainita tüüp. Nii et see on erinev C. parem või veel hullem, PHP on nõrgalt kirjutatud keeles. Tal on numbrid. Tal on stringid. Tal on tõeväärtused. Ja see ei ole paar muud tüüpi andmeid. Aga sina, programmeerija, tavaliselt ei pea hooli neist. Segamini on see, et ta teeb see veidi lihtsam programm. Sa ei mõtle veidi vähem. Negatiivne külg on see ka avab sulle võimalikke vigu, kui te kogemata ravida number string, string kui number, mis võib, kuid isegi siis, PHP, ja palju keeli, on üsna tolerantne. Nad kasutavad, mida nimetatakse kaudne casting. Ja kui sa püüad kasutada n kontekstis arvulise olukorras tahe teisendada mida siin saab olema string, sest kui kasutaja liigid midagi, ja sa saad tulemuse, Nagu readline või saada string, et läheb tagasi string. Aga teate, paar rida hiljem, ma vaadake, kui n on suurem kui null. Nii PHP läheb kaudselt koo mu "String" 123 või mis iganes kasutaja liigid sisseveo int. Nii lühike, asju lihtsalt töötab palju rohkem intuitiivselt. Nii et me nüüd hakkame lõõgastuda mõned asju, mida me oleme teinud minevikus. Palju see kraam on sama, kuigi. Ikka on võrdne võrdne. Nagu kõrvale PHP on ka võrdne võrdsete võrdne, kuid rohkem, et võib-olla ka tulevikus. See oli. Typo vaid kaks võrdusmärke tähendab sama asi nagu enne, võrdluseks. printf tähendab sama, mis enne. Längkriipsu n tähendab sama asi nagu enne. Niisiis, kuidas ma saan selle programmiga? Noh, nagu enne, kui ma PHP, conditions1.php ja kirjuta number nagu 123. See on positiivne number. Kui ma sisestada 0, I pick 0. Ja kui ma kirjuta negatiivne 123, saan tagasi negatiivne arv, mis on ainult öelda, süntaktiliselt, PHP on super, super sarnased. Miks see nii on nüüd kasulik aastal web kontekstis? Noh, lähme tagasi selle froshims Näiteks, mis tundus, uuesti, nagu see siin. Ja olgem tegelikult tõmba veebileht uuesti, mis nägi välja selline. Mida me saame teha koos andmed, mis on esitatud? Noh, lubage mul avada uuema versioon sellest. Ja te näete, et probleem komplekti kirjelduse suunab teid läbi mõned neist. Selle asemel, et alustada nullist, Vaatame froshims3, mis teeb natuke rohkem. Teade esimene, tegelikult, olgem avatud up mis 0 oli, nii et näete mida register 0 oli. Pane tähele, mida register 0 tegid. Üks on mul comments ülaosas. Kustuta need ja keskenduda ainult sellele. Enamik sisu register0.php on ilmselt mis keeles? Just tooraine PHP. Nii teate, seda faili ei käivitu koos, hetkel, sulg, küsimärk, PHP. PHP ei võimalda teil segunevad PHP koodi HTML teeke. Aga ma olen teinud, et siin sees on leht siin. Nüüd jällegi, sa ainult ei tea seda alates olles tutvunud kasutusjuhendiga. print_r, Selgub, et on print_recursive. _recursive Ja see on lihtsalt mugav kasulikkusfunktsioon et lihtsalt trükib, rekursiivselt, mida iganes sa käe ta. Kui sa käe ta massiivi see saab printida massiivi. Kui sa käe ta number, see saab trükkida number. Anna see string, siis see prindi string. Kui sa käe ta hash tabel, see välja printida hash tabelis. Te ei pea kirjutama kõik selle kood ise. Nüüd teate, et ma olen sisenevad PHP režiim siia. Ma väljumise PHP režiim siia. Nii et kui veebiserver loeb seda faili ülevalt alla, vasakult paremale, sest see lõpeb failinimi kutsutud. php, kõike, mis ei ole sees PHP sildid on lihtsalt saab olema sülitada välja, nagu toores HTML. Ei midagi erilist. Aga niipea, kui veebiserver märkab see, et see saab öelda, ma ei peaks sülitama, sõna otseses mõttes, print_r ametikoha. Ma peaks rahuldama järgmisi rida koodi. Seega viimane küsimus, siis selle faili on, noh, mida kuradit see on? Võtke oletus. Mis on $ _POST, ilmselt? Publik: [kuuldamatu] SPEAKER 1: Jah, postitatud andmed. Tuletame meelde, lähme kerida tagasi aeg hetkeks. froshim0 jällegi tundus see. Super enamus on lihtsalt HTML. Jällegi, mõned märksõnad, mida ei näinud veel, või mis te olete juba tuttav. Aga huvitav asi oli see. See üks rida on see, mis tegelikult ühendab see meie register0.php faili. Ma esitamise kaudu meetod postitus. Ja see tähendab, et parameetrid kasutaja liigid ei ole läheb lõpuks kus. Nad ei kavatse ilmu URL. Nad on ikka veel välja saata kliendi brauserist, et server, vaid lihtsalt läbi mõne muu mehhanism, et me loobuda meie kätes kell täna, kuid see ei ole URL. Aga teate suhe nüüd post, mis tavapäraselt on väiketähed siin. Aga kui ma avada register0.php, Ma ilmselt trükkimiseks. Nii et see on imelik nimetades konventsiooni. Aga mis on kena PHP on see, et kui kasutades PHP web kontekstis mitte käsurea nagu mina tegin hetk tagasi kui sa tegelikult kasutades seda veebi lehe Vhost kataloog sest me oleme, automaatselt siis PHP täita seda asi, mis on assotsiatiivne massiiv, niiöelda hash tabel, kus kõik kasutaja sisestatud sisse Ühesõnaga, $ _POST kõik mütsid on globaalne muutuja PHP lihtsalt võluväel tekitab teile kui kasutades PHP web kontekstis. Ja see paneb sees on kõik nimed parameetreid kujul, et esitati seda faili ja kõik väärtused, et kasutaja sisestatud sisse Nii ta jätab sulle, mida kasutaja kirjutasid selle vormi. Nii et enne, meil tõesti loll väljund lihtsalt näha seda, sest kõik, mida ma tegin oli rekursiivselt prindi see massiiv. Oluline on nimi, mille väärtus on David. Oluline on kapten. Väärtus on. Ja topeltnooleks ja nurk sulg ei, see on lihtsalt meelevaldne. See ei ole koodi. See on vaid PHP võimalus näidata Mis väärtus mõned olulised on. Aga nüüd andke mulle ettepaneku, et froshIMs3, see on peaaegu identne välja arvatud see leiab selle faili. Ja veel, me ei kavatse sellist lihtsalt pilk see, lihtsalt et näha, mõned süntaks, kuid teate mis seda faili ei. Võtke vist lihtsalt põhineb rida kood, mis ilmselt ei sarnanema Kreeka, mõningal määral ilmselt teeb. See fail on kuidagi seotud e-posti, e-posti. Mis siis on see programm teeb? Selles versioonis, kui ma tegelikult täitke see vorm - ja lubage mul minna froshIMs3, ei froshIMs0 - vorm ja välja näeb sama. David, kapten, male, ühiselamus, Matthews. Aga kui ma saadan selle, see fail on kavatse minna register3.php. Ja ma väita, vaadates see lähtekoodi, see läheb kuidagi kaasata email. Lubage mul minna ja avada see üles suurem aken, nii et me näete seda puhtamalt. Oleme Vhosts, kohalik host, avalik, froshims. Ma lähen avama erinevates programm, just nii me näete rohkem korraga. Nüüd siin märgata mõningaid asju. Ülaosas fail on avatud sulg, küsimärk, PHP. Siis on hunnik kommentaare mida me ei saa eirata, on ebahuvitav nüüd. Nüüd on see. Selgub, PHP on palju Koodi nimetatakse nõuavad. See on väga sarnase sisuga C on sisaldab hash sisaldavad mis põhiliselt haarab sisu mõned muu fail ja lihtsalt plops neid siin, nii et saate neid kasutada. Sel juhul on seadmel, eelinstalleeritud, raamatukogu tasuta ja avatud lähtekoodiga raamatukogu kutsus PHP mailer, et igaüks saab alla laadida internetist. Me tegime seda sinu jaoks. Ja see tähendab, et ma nüüd on e-posti funktsionaalsus minu käsutuses. Nüüd teate mõned asjad. Ma lähen, et kinnitada vormi esitamist. Tuleb välja, PHP, üks, on hüüatus punkte ei operaator, nagu C. Kuid PHP on ka funktsioon nimetatakse tühi. Tühi lihtsalt tagastab tõsi, kui väärtus on asi, mida see tuleb Sulgudes on tühi, nagu kasutaja ei kirjuta midagi sisse Nii et see on see sõna ja teate süntaks, väga meenutab C, kui nimi võti, nii nimi väljale vormi, mille kaudu esitada posti teel kasutaja ei ole tühi, ja nende sugu ei ole tühi kujul nagu Noh, ja nende ühiselamus ei ole tühi - aga teate ma ei hooli Kapten, siis mida me teeme? Ma lähen täitma see rida koodi. Ja sa ei mõtle seda liiki nagu malloc, kuid see on natuke raskemat. Aga nüüd see annab mulle erilist vatseti tüüpi PHP mailer. Kuid ignoreerida märksõna uus täna. Nüüd ma lähen helistada funktsioon nimega IsSMTP, mis ütleb, kasuta SMTP. See on port 25, nagu ka video eelmisel nädalal, kui asi oli viskamine kirjadest tulemüüri. Port 25 on SMTP. SMTP tähendab kasutada posti server. Kumb saame kasutada Harvardi SMTP.fas.harvard.edu. Meil on võimalik valida alates aadress olema John Harvardi. Kui ma keri edasi, ma ei saa määrata saaja aadress, vaid omavoliliselt, oleks John Harvardi samuti. Nii ta läheb, mida postitada ise. Nüüd on võimalik valida teema olema registreeritud. Ja ma ei saa määrata keha e-posti järgmiselt. See rida tundub veidi segasena, aga see on lihtsalt sellepärast, et seal on palju Teabe ta. Üks, seal dot operaator. Keegi peab teadma juba mida dot operaator teeb. See ahel. Nii et kui soovite võtta stringi PHP, ja lisada, või ülaloleva see, et teise stringi PHP, jumal tänatud sa ei pea kasutama strcopy ja malloc, ja kõik see enam. Kui soovite concatenate kaks stringi, kes hoolib mälu. Olgu PHP näitaja läbi sulle. Mis PHP pistmist dot operaator siin on lihtsalt suur lause välja Selle rea, seda joont, see joon, seda joont. Ja nüüd ette, et see saab sokutama väärtushinnangutes. Nii e-posti, et John Harvard läheb saada sõna otseses mõttes ütlen nimi, koolon, midagi, mitte, siis me sulgemiseks string ja concatenate edasi olenemata kasutaja sisestatud aastal, siis uus rida. Siis järgmisel real John Harvardi e, et see saab öelda, Kapten, Sees või midagi. See saab öelda sugu, mees või naine. Dorm saab olema Matthews minu puhul. Ja siis märkate tuttav semikoolon päris lõpus. Ja siis siia, teate, mõnevõrra segasena veel, kuid jällegi, pärast muster, mis harjuvad pärast P seatud 7, kui saata mail tagastab false, siis minna ja surra. Nii PHP on funktsioon nimega die, mis sõna otseses mõttes lihtsalt tapab kodulehel ja lihtsalt trükib välja mida iganes sa ütled seda - tema on suremas sõnad, nii rääkida. Ja see, kui tegemist on, siis printida millised vea info on mis juhtus valesti minema. Nii pikk lugu lühike siin, mida me oleme on näide sellest, kui kasutaja esitab vormi, froshim0, froshims3.php, see läheb register3.php. Aga register3.php siis tulu täita kõik need read. Nii et seal on mõned take kahjustavad tegurid siin. Üks, see on ilmselt üsna lihtne, programmiliselt, saata e-kirju, mis on hea. Kui kasutajad registreeruma saidile sisse Sellisel juhul, kui nad registreerivad oma sport, saate e-posti uustulnuk Proctor või John Harvard, käesoleval juhul. Aga see tähendab ka seda, mida saate teha, mis? Saada e-kirju, et keegi kedagi. Ja see on väga õige. See ei ole nii lihtne teha, kui sa oled harjunud kasutama Gmaili. Aga kui sa oled kunagi kasutada Eudora või Outlook, saab päris palju öelda posti server, et olete keegi tahad. Ja see on koht, kus ma pean panema et müts ja öelda, ei tee seda. Aga see on märk sellest, kui lihtne see on täita phishing rünnakuid, ja saata anonüümseid e-kirju ja spam üldisemalt. Ja see tõesti taandub Asjaolu, et kõik, mida vajame, on mõned programmiline juurdepääs. Nagu kõrvale, minu lähedaste kohtumine reklaam pardal, minu uustulnuk aastal, oli, kui ma avastasin selle cool trikk, et wow, saate saata e-kirju kelleltki. Ja nii me olime võttes mõned loll argument, sõna otseses mõttes, Matthews, üks minu Proctor grupp. Ma isegi ei mäleta mis teema oli. Aga ma tahtsin proovida panna lõppu, et see loll arutelu. Nii et ma otsustasin ma lihtsalt saata e-posti minu Proctor grupp, teeseldes, et teine ​​noormees, kellel kelle arvamus nõus, ja teda päri mis iganes minu arvates oli selle konkreetse arutelu. Ja nii ma sepistatud seda e-posti kasutades tehnikat sarnase sisuga seda. Aga see oli tegelikult lihtsam ajal. Tulemus saata. Ta ei olnud rahul, ega kõrvalda on reklaami pardal. Ja ma olin väga kiiresti püütud sekundit, sest nagu te teate, ma kirjutama minu e-kirju teatud viisil. Ja kuigi ma seda teha käsitsi, suurtes osa, 15 aastat hiljem, sest olin traumeeritud, et. Mul ei ole allkirja minu e-posti nüüd. Aga aastal 1995, ma lihtsalt pidin sig, allkiri on minu e-posti. Nii oli see teadmiseks öeldes Kallis Proctor grupp, ma leppida minu arvamus ja nõus David allkirjastatud nii ja Niisiis, uus liin, uus liin, DJM. Nii ei tee seda või üldiselt võtta ära seda tehnikat. Aga kui teha veebileht, nagu ette oma lõpliku projekti tegemisel kodulehel midagi ettevõtlikkust, see on see, kuidas, pragmaatiliselt, saate võimendada muid teenuseid internetis nagu posti ja siis tegelikult Kirjuta asju kasutades koodi. Niisiis, kuidas me saame täiustada seda? Noh, esiteks võtame kiirülevaate mõned asjad, mis sa näed, ja siis, kui heita pilk paar näidet. Nii et üks, rahustada, sest Me lendame läbi PHP. Ja ma tean, et mingil hetkel sa pead tegelikult hakake seda, kui te ei ole juba. Mõistma, et üks, peamine on selline ja aknast PHP. Kui soovite kirjutada koodi, mis saab täide, sa lihtsalt hakake seda fail nimega. php nii kaua teil on sulg küsimärk PHP tag. Aga teate need on tingimused php. Teade, et see on täpselt sama slaid meil oli nädalas üks, kui meil oli tingimused C. Tingimused PHP on struktuurilt ja süntaktiliselt sama. Ainus tõeline erinevus on see, kui sul on muutujaid kaasatud, siis on need dollari märke. Vahepeal Loogiline väljendeid näevad välja täpselt nagu seda või-se või ja-se koos. Lülitid välja täpselt sama. Mis on tore, PHP, samas C, lülitid olema juhtudel primitiivid nagu ints või sümbolit, PHP Sinu puhul avaldusi võib tegelikult olla kohta tervikuna stringid, mis on tegelikult omamoodi kena. Säästab aega. Ei saanud teha, et C. Siin for loop PHP. See on identne. Võib-olla mõned dollari märgid muutujate. Sa ei pea mainima, et midagi on int. Sa lihtsalt kuulutada koos dollari märk ja muutuja nimi. Aga jaoks silmus on sama. Samas loop on sama. Teha, kui silmus on sama. See on veidi erinev. Nii PHP, array, saate staatiliselt deklareerida massiivi, nagu C, aga sa kasutad nurksulgudes. In C, siis oleks kasutada looksulg, kui sa isegi teadsin seda. Aga see on tegelikult väga levinud PHP kuulutada array, sel juhul numbrid ja helistage muutuja numbrid. Muutujad ise näeb välja selline. Siin on string, tsiteerin lõppeb "tere maailmas. "Sa oleks võinud längkriipsu n. Ma lihtsalt ei ole käesolevas asjas. Nüüd on see huvitav ehitada. C ei ole seda. Aga see on super abivalmis. Ja te näete seda P kogum 7 spec - iga ehitada. Kui soovite korrata üle kõik elementide massiiv, sa ei pea tegeleda $ i ja $ n, ja + +, ja kõik. Võid sõna otseses mõttes öelda, PHP, see - iga numbrite arv, nii Ma oletan, et $ numbrid on massiivi numbrid. Ja kui ma ütlen iga numbrid kui number, see läheb automaatselt, kui minu loop hukatakse, uuendada, iga iteratsiooni, väärtus sees dollari märk number - uuesti ja uuesti ja uuesti jalgsi minu jaoks üle, et massiivi. Nii see lihtsalt säästab meid kood. No semikoolonit ei + + 's, mitte i on, ei n on, see on lihtsalt kena. Kuid PHP on ka see. Ja see on super võimas. Ja sa kasutada seda, käed edasi, P seada 7. Ja assotsiatiivne massiiv on ka kuulutatud nurksulgudega. Aga teate süntaksi nüüd. See meenutab nägime koos print_r hetk tagasi. Mitu võtmed, kui vähe Psüühikavise Mis see massiivi tundub, et on. Nii et see on kaks. Ja ma nimetan seda massiivi. Aga kui see aitab, võite mõelda Selle kui hash tabel, või assotsiatiivne massiiv. Aga see on lihtsalt erinevad tüüpi massiiv. Ja jälle erinevaid keeli on need. Me näeme midagi sarnast JavaScript samuti. Seal on kaks võtit. Üks on tsitaat lõppeb, "sümbol," üks on Tsiteerin lõppeb "hinnaga." Ja need võtmed iga on väärtus. Sel juhul sümboli väärtus on FB jaoks Facebook ja hindade väärtus on 49, 26, mis oli Facebooki aktsia hinnad alates hommikul. Mis on kasulik umbes assotsiatiivne massiiv. Mul oleks võinud arvuliselt indekseeritud massiivi lihtsalt lihtne nurksulgudes. Ja ma oleks võinud dollari märk quote võrdub lihtsalt see. Las ma tegelikult seda teha. Oletame, ma selle asemel lihtsalt tunnistada Selle massiivi niimoodi. See on täiesti kehtiv, süntaktiliselt. See ei kaota andmeid, per se. Ma ikka näen, et sümbol on fb, ja et hind on 49, 26. Miks on assotsiatiivne massiivid mõjuvad? Publik: Te ei pea meeles pidama, kui paned asjad. SPEAKER 1: Täpselt nii, sa ei pea meeles pidada, kuhu panna asjad. Sul ei ole suvaliselt meeles et aktsia sümbol on sulg null, ja aktsiahinnad on sulg üks, mis on eriti ohtlik, kui te muuta asju, lõpuks. See on palju parem siduda mida me kutsume metaandmed oma tegelikke andmeid. Ma tahaks väita, et see, mida me tõesti hoolime umbes siin on fb ja 49, 26. Sümbol ja hind on metaandmete mis kirjeldab andmeid, mida me tegelikult hoolivad. Aga see on lihtsalt nii palju lihtsam juurdepääs. Nüüd, kui kõrvale mis hind, mida me maksma? Me oleme seda teinud juba aastal CS50 nädalaid. See funktsioon peab tulema teatud hind. Mälu. Nii et sa ei ole lihtsalt ladustamiseks 32-bit täisarv, näiteks. Sa ladustamiseks sümbol / 0, ilmselt. Nii et te kasutate rohkem mälu. Ja mis on täitmiseks otsin midagi üles assotsiatiivne massiiv, ilmselt? See on ilmselt aeglasem. Muutmälu on tore, eriti kui saad teha binaarne otsing. Aga kui sa oled tegelikult nüüd vaadates ei numbrite, vaid stringid, seda tõeliselt ellu all kapuuts, tõenäoliselt hash tabel, kus kasutad ükskõik kumba hash tabel eraldi ühendamine. Või te kasutate proovida tegelikult salvestada väärtusi. Nii et äkki saab teha pidevalt aega, kuid teil on ikka vaadata S-Y-M-B-O-L, potentsiaalselt asemel lihtsalt 32 bits otsida midagi üles. Nii et taas, need samad mõtted tulevad Tagasi korduda selles kontekstis. Aga jälle, PHP on nüüd mõned super globaalseid, et selgub, on assotsiatiivne massiivid. Nägime üks hetk tagasi, $ _POST. Ja et super globaalne on võtmed ja väärtused. Täpsemalt võtmed rivistama, mida? Kust võtmed $ _POST tulevad? Lihtsalt sulgege? Publik: Nimi. SPEAKER 1: nimi, kus? Publik: [kuuldamatu] SPEAKER 1: nimi on atribuut. Noh, aga kus nad tegid algselt pärit on? Vormi. Nii et kui HTML lehel on vorm tag, mille sees on mõned sisendid, nagu ruudud, tekstiväljade rippmenüüst menüüd, millest igaühel on nimi, nende nimed lõpuks nagu võtmed $ _POST ning ausalt, et asi, $ _GET. Kui meetod on GET, sama mõte. See on lihtsalt erinevas super globaalne. Ja väärtusi, muidugi, on pärit olenemata kasutaja tipitud tema või tema brauser. Aga seal on mõned teised. Seal on küpsis, mis me tulen tagasi tulla lõpuks. Aga need on asjad, mida sa tead, web kasutab mõnda head või halba. Aga me tuleme tagasi selle. Server ja istungil ja need kaks on mingi eriline kasulikkust. Aga võtame pilk see. Lubage mul minna ja avada näiteks nimetatakse mvc0.php Nii MVC tähistab järgmist. Ja me võtame kasutusele seda varem on Tüüpiline, tõesti, et sa projekteerimine Ülesanded 7 ja ka lõplik projektide aastal omamoodi tööstus tavapärasel viisil, ja puhas viis. See on hea disain. Nii et sa parasjagu näha, ja sa pead kogemus, P komplekti 7, paradigma, sorteerida programmeerimise mõtteviisi, mis näeb natuke midagi sellist. M mudeli, C Controller, V View. Pikk lugu lühike, MVC on lihtsalt selline on metoodika, moodus veebilehed, eriti, mille te panna kõik oma, loll lause - äriloogika - kõik oma intellektuaalse omandi mida nimetatakse kontroller, fail nagu index.php või me näeme, quote.php või buy.php. Kontekstis Ülesanded 7, oma mudelid sisaldavad tavaliselt oma andmed, midagi, mis on seotud andmebaasi, kui paneme lõpuks näha ja oma seisukohti sisaldavad esteetika oma site, HTML, CSS. Nii et me juba nägime seda C vähe natuke abil. h failid. Me tõesti nägin seda hetk tagasi koos CSS, poolt faktooring CSS stiliseerimine kraami meie HTML. Nii MVC on tõesti ainult umbes joonistus jooned liiva sisse ja ütles: huvitav programmeerimine kood oma veebilehel kuulub mida me kutsume kontroller. Stuff seotud andmebaas tavaliselt jõuab mudel. Aga näete, et Ülesanded 7, me ühendada C ja M hoida lihtsa. Aga vaade on koht, kus kõik oma HTML ja esteetika tavaliselt minna. Mida see tähendab reaalselt? Noh, lubage mul minna oma MVC kataloog järgmiselt. Ja te näete, mitu neist käinud läbi spec. Nii mvc0, ma väita, et see on, nagu, versioon 0 CS50 veebisaidil. Meil on vaid mõned HTML, nagu suur h1 tag, ilmselt. Ja siis täpploendit. Ma pole kunagi näinud täpploendit enne, aga pole hullu. Lähme kiiresti vaadata lähtekoodi. Selgub Tavalise nimekirja kuulidega on sulg ul ühe või rohkem loendielementidest li. Nii teate siin on ankur tag. Me nägime, et hetk tagasi. Nii see on, kuidas ma ellu sellel lehel. Mul on kaks lingid, kaks loendielementidest üks ul eest Tavalise nimekirja, ning lõpuks tulemus, esteetiliselt, on see väga ilus veebileht, versioon 0 siin. Aga mis on huvitav nüüd, kuidas see rakendatakse all kapuuts. Lubage mul minna gedit ja avada see esimene näide, et maalida. Ja me vaatame, mis on vigane, potentsiaalselt siin. Nüüd, kui ma minema localhost, avaliku MVC, märkate mõne faili. Ma kutsun neid, et Praegu kõik kontrollerid. Aga see on natuke kuritarvitamise tõttu näete kõik on segatud sees neist. Ja lase mul minna sees index.php. Ja me näeme, sõna otseses mõttes, sama HTML. Nii et kuigi see fail lõpeb . Php, see ei tähenda, et see on mingit PHP koodi. See võib lihtsalt olla toores HTML, kuigi see on tobe. Aga teate pole sulg PHP sildistada, välja arvatud see, mis ausalt öeldes on lihtsalt selleks, et teenida kommentaari. Aga see on funktsionaalselt ei isegi, et huvitav. Aga märka seda. Huvitav on nüüd see, mida muudatused sellel lehel. Lubage mul kliki loenguid. Ja teate URL on umbes muuta. Nüüd ma olen lectures.php. Lubage mul kliki null. Nüüd ma olen week0.php Ja nüüd mul avada neid faile gedit. Mitte lihtsalt indeks, kuid lubage mind avama loenguid. Ja lubage mul vabaneda kommentaarid keskenduda vaid selle osa. Ja nüüd lubage mul avada veel üks, week0.php, visake kommentaare lihtsalt puhastada see üles. Ja nüüd märkate järgmist. Mõeldes tõesti omamoodi hoolikalt disain ja teeme seda rida kuni sama, mida saaks teha parem siin, sa arvad? Kuidas ma saan teha nädalas üks? Kuidas see. Nii see on, kuidas ma tegin nädal üks. Ma läksin File, New, Paste, Salvesta week1.php ja siis ma läksin sisse. Ja ma muutsin üks - Mis oli see, üks reedeni. Muutsin nulle üks. Muutsin selle ühe. OK, nüüd vaadata minu faile. Mida võiks teha teisiti? Kus on võimalik, võib-olla? Nii et seal on võimalus alustada faktooring seda kraami välja. Lubage mul avada, nagu spoiler, jaoks mida näete P kogum 7. Kui ma avada, nüüd index.php versioonis viis see, tundub, viis rohkem segasena küll. Aga see, nüüd on see, mida ma kutsun kontroller, mis on kontrolli loogika minu lehel. Ja te võite objekti rekonstrueerida, intuitiivselt ehk mis toimub. Esimesel real, see on veidi segasena. Aga teate ma nõuavad, jms terav sisaldavad faili nimega helpers.php. Ja siis ma helistan, ilmselt funktsioon, mida nimetatakse krohvi, mis kulgeb kaks argumenti. Üks on tsitaat lõppeb, päises. Ja teine ​​on, millist andmetüüp on see, mis põhineb meie süntaks varem? See on seotud massiivi. Täpsemalt, see kulgeb pealkiri mõned metaandmed, mis meenutab mulle, mis see on ja selle väärtust. Siis ma näen kõva kodeeritud ul, et mõned toores HTML. Aga siis ma olen tagasi PHP režiim helistades funktsioon krohvi. Nii et isegi kui sa ei ole kunagi kasutanud HTML või PHP enne ja kuigi see tundub hirmsam, miks on see ilmselt parem disain? Mis on parem sellest, põhineb järeldus? Publik: [kuuldamatu] SPEAKER 1: Vähem ülearune et enam ei ole mingit HTML tag, mitte rohkem pea tag, mitte rohkem body igas kuradi faili. Selle asemel, ma arvutatud välja sarnasuste ja arvatavasti panna neid see faili kuidagi seotud et päises. Ja sama asja lähedal keha tag, lähedal HTML tag. See on ilmselt siia sees on jalus kuskil. Ja te näete, et Ülesanded 7, väike ekskursioon läbi selle. Niisiis, mis ees ootab? Üks asi, mida me ei ole võimeline veel on tegelikult talletamiseks. Ja mis me hakkame nägema Kolmapäev, näiteks, on see, et oma vana sõber Excel või numbrid, võimaldab salvestada palju andmed ridade ja veergude. Tuleb välja, mida saate teha, et see, mis on nimetatakse andmebaasi programmiliselt. maniakaalne Ja selgub, pärast seda, me saaks salvestada asjad see, mida te näete jälle P set 7, terve hunnik kasutajanimed ja paroolid, millest viimane on tegelikult krüpteeritud palju nagu nad olid P komplekt 2 on häkker väljaanne. Ja lõpuks, saate rakendada seda, oma Etrade-nagu kodulehel, et rakendab kollektiivselt CS50 rahastamiseks. Lõpuks, kuna olete siin ööbinud nii hilja täna, kui sa tulla tagasi selle osa campus, kell 04:00 täna, siis me annab teile mitte ainult nõu, kell SCES Nõustamine Fair, kell 16:00 in Maxwell-Dworkin, me anname teile mõned Americone Dream, Cherry Garcia, Chocolate Fudge Brownie, Chocolate Chip Cookie Tainas, ja kui te Google Chunky Monkey, saad selle. Seega kõik, mis ootab kell 04:00 PM Maxwell-Dworkin. Näeme kolmapäeval samuti. SPEAKER 2: Järgmisel CS50, RJ magab sisse RJ: Minu jagu! Ha! Oh,