>> 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,