>> [Tónlist spila]
DAVID J MALAN: Allt í lagi, velkominn aftur.
Þetta er CS50.
Þetta er endir viku sjö.
Og það er í lok þess hrææta veiði frá Heimadæmi fjórir
að þú gætir muna.
Eftir að jafna öll þessir JPEG starfsmanna,
þú varst áskorun, ef þú vilt, að ljósmynda sjálfur með eins og margir
af þeim fólkinu sem þú getur.
Við fengum helling af uppgjöf á undanförnum vikum,
reyndar alveg nokkrar rétt fyrir hádegi dag, eru sum hver þau hér,
veiddur hér in-- lítur like-- Annenberg Hall á skrifstofutíma, einn hér
í Lowell House með Nick.
Hér er Ramon verið veiddur á símanum.
Þetta var á CS50 hádeginu.
Þetta var Jason skyping með meira skapandi bekkjarfélaga,
sem hringdi hann á þennan veg.
Við vitum ekki hvað þetta var.
>> [Hlátur]
>> DAVID J MALAN: En það er þess virði að gígabæti.
Hér er Chang, sem bókstaflega hljóp niður af sviðinu
til að forðast að ljósmynda einn dag, en var að lokum veiddur.
Hér er Nick.
Og hér er Alison niður um reitina.
Og Zamyla jafnvel fannst á danssalur samkeppni.
Þannig að við munum fara í gegnum þessar myndir, reikna út
sem lögð mest elstu, og laun
einn stórkostlegur verðlaun, eins lofað í sérstakur.
Og við munum líka að fylgja upp um plássið sem var að ræða.
>> A par af announcements-- svo hádegismat er, aftur, á föstudaginn á 13:15.
Ef þú vilt tengja okkur, RSVP á þessari vefslóð hér.
Jason birtist aftur hér frá einu gagnabankanum a par af ár
aftur, sem gerðist að falla á Halloween.
Og reyndar, klæddur hann sem a grasker sem einkum ári.
Ef þú horfir á þetta kafla af hans frá 2011 kafla
átta, ef þú ert forvitinn, á CS50.tv, held ég
þetta var árið sem Loftdæla hans var að vinna.
>> Ef þú horfir þá svipað kafla árið 2012,
þú munt sjá þetta Jason mikið reiknaðar, þar sem málið er ekki lengur virkað,
sem er aðeins að segja á föstudaginn, ef að þú vilt
eins og til að móta grasker með Daven og Gabe og aðrir, RSVP til höfuð
á cs50.harvard.edu heimilisfang.
Það lofar að vera frábær skemmtun.
Daven, við erum sagði, hefur skorið Pumpkins allt líf hans.
Gabriel frá Brasilíu hefur aldrei rista grasker fyrir Halloween.
Svo vera þar með þeim sem hann lærir.
>> Málstofur, meanwhile-- svo þú munt læra fljótt
um hvaða væntingar okkar eru fyrir lokaverkefni, sem í raun
mun sjóða niður hanna og innleiða
flest allir verkefni áhugaverð þú, að vísu með fyrirvara um samþykki
og leiðsögn frá kennslu náungi þinn.
Undir lok hins önn, kynna við fjölda
ráðstefna, sem eru valfrjáls flokkum leiddi af kennslu félagar og Harvard
starfsfólk, vinir námskeiðsins allan Campus, um ýmis málefni sem
eru snertifleti undirliggjandi kennsluáætlun Auðvitað er
en engu að síður við, gaman, og mismunandi fyrir hugsanlegum lokaverkefnum.
>> Til dæmis, í fyrsta lagi ef þú vilt að skrá, höfuð til þessa vefslóð þar.
Og þetta er lína fyrir málstofur á þessu ári ein.
En ljóst að við höfum heilmikið af námskeið frá árum áður, sem öll
eru tengd í málstofum valmyndinni kost á heimasíðu Auðvitað er.
Þannig að ef þú ert að hugsa um fara út svæðinu þægindi
eða tína upp nokkrar nýja færni, til dæmis, forritun iPhone
Apps með Swift, nýtt tungumál frá Apple eða Objective-C
eða Android apps eða forritun [? bending?] ljósaperur, eða einhverju efni
upp hér og fleiri, vegna stöðva út the skráning blaðsíða.
>> Svo við byrjuðum og lauk á Mánudagur með útlit á HTTP.
Svo fljótur refresher-- HTTP, HyperText Transfer Protocol.
En hvað þýðir það í raun þýtt?
Hvað þýðir það í raun þýtt?
Er að hönd?
Ég veit að þú ert bara að klóra höfuðið.
En þú vilt að leggja hvað HTTP er?
>> Áhorfendur: Hvernig tölvur samskipti við [inaudible].
DAVID J MALAN: Ég missti síðasta hluta.
Hvernig tölvur samskipti with--
>> Áhorfendur: Internet netþjónum.
DAVID J MALAN: Good-- með internetið netþjóna, og sérstaklega, vefur framreiðslumaður.
Vegna muna, það er fullt af þjónustu á internetinu, sem sum hver
þú notar líklega daglega milli spjall og skilaboð, spjall, og vefur, og email,
og þess háttar.
Og HTTP er bara siðareglur sem vefur flettitæki
tala í samskiptum við vefþjónum, og öfugt.
Og hliðstæðu við að manna heim gæti verið,
Ég lengja hönd mína að hrista sumir Annað er mannlegt og hann eða hún
viðurkennir með því að útvíkka hans eða hönd hennar eins og heilbrigður.
Svo er það bara siðareglur, a setja af samningum.
>> Og hvað reyndar eru þessir sáttmálar?
Jæja, sjóða það bara niður að senda skilaboð fram og til baka,
eins og við lýst hér.
Og það er a par af leiðir sem hægt er að senda þessi skilaboð.
Og kannski mest algengt er þekktur og fá.
Og við munum sjá andstæða þessu áður en langur.
>> En fá beiðni frá vafranum við miðlara bara lítur svona út.
Það er fullt af texta sem það setur inni í raunverulegur umslagi.
Á utan á þeim umslagi fara nokkra stykki af upplýsingar.
Hvað þarf að fara á umslag, svo að segja,
í því skyni að fá beiðni eins þetta frá mér til a vefur framreiðslumaður?
Já.
>> Áhorfendur: IP talan þín.
>> DAVID J MALAN: IP netfang mitt í From reitinn, svo að segja,
og að sjálfsögðu, IP heimilisfang viðtakanda.
En í tilfelli af a vefur pakka, þurfum aðeins meiri smáatriði
Það er ekki nóg bara að senda umslag til miðlara,
vegna þess að framreiðslumaður gæti verið hlusta mismunandi gerðir
internetið umferð.
Svo hvað annað þurfum auk IP viðtakanda?
Já?
>> Áhorfendur: Er það TCP?
DAVID J MALAN: Good.
TCP--
>> Áhorfendur: Address.
>> DAVID J MALAN: Heimilisfang, eða höfn, eins og það er kallað.
Loka, en TCP höfn tala.
Og það er fullt af þessu.
En örugglega mest þekki ætti lokum
vera 80, sem er sjálfgefið er notað fyrir umferð á vefnum.
Og annar þekki einn brátt verður 443,
sem er notað fyrir örugga vefur umferð, vefslóðir sem byrja á https.
>> Svo er þetta það sem fer inni af því umslagi.
Og fá / bara þýðir, gefa mér vefsíðan sjálfgefna síðu.
Gefðu mér rót harður aka á þeim vefþjóni.
Og vonandi, vefur framreiðslumaður vilja bregðast við, OK
og fjöldi 200, sem er bara a venju segja, já, alla
er örugglega í lagi.
Hér er síðan.
The tegund af vefsíðu er að fara að vera texti, en nánar tiltekið, HTML,
sem við erum að fara að kafa aftur í.
Og punktur punktur punktur bara leið, hér er HTML.
Og það er þar sem við taka upp söguna í dag,
raun skrifa HTML, HyperText Markup Language, sem
er tungumál sem vefsíður eru skrifuð.
Það er ekki forritunarmál.
There er engar aðgerðir eða lykkjur eða aðstæður.
Það er Markup Language, svo aftur sjá í dag,
sem gerir þér kleift að tilgreina hvernig á að uppbygging og stylize
fagurfræðilega a vefur blaðsíða.
>> Svo þetta var einn og aðeins síðu sem við virkilega
horfði á, ef stuttlega, á mánudag.
Og taka nokkrar mikilvæg einkenni.
There er a einhver fjöldi af opinn horn krappi og loka horn krappi.
Á milli þessara horn sviga eru orð.
Og við erum að fara að byrja hringja þessi orð tags.
Svo opinn krappi höfuð og lokað krappi höfuð
eru opin og lokuð tags, eða upphaf og lok merki
sömu röð, af HTML frumefni, eins og við munum kalla það, sem kallast höfuð.
Og sama hrognamál gildir á líkama í HTML og svo framvegis.
>> Og hvað er gott er HTML-- og reyndar við munum
eyða hrikalega lítill tími á það, vegna þess að þú munt aðallega bara reikna út
hvaða eiginleika það hefur þegar þér raun hafa steypu vandamál
að solve-- þú munt komast að því að vafrinn er ansi heimsk.
Það er bara að fara að do-- ekki ólíkt a computer-- hvað þú segir því að gera.
Og svo þegar þú ert opinn krappi HTML á mjög toppur
það, sem fyrst og fremst bara þýðir, hey, vafrinn,
hér kemur vefsíðu skrifuð í HTML.
>> Þegar það sér opinn krappi höfuð, það bara þýðir,
hey, vafrinn, hér kemur höfuð, eða hæstur hluti vefsíðu mína.
Þegar það sér lokaðan krappi höfuð, það bara þýðir, hey,
það er það fyrir höfuð.
Biðstaða fyrir eitthvað annað.
Og að eitthvað annað er virðist fara að vera líkaminn.
Og þegar þú ert ekki með merki, eins þú hefur bara halló, kommum, veröld,
það er bara að fara að vera hrár texti sem lokum birtist á skjánum.
>> Nú, þú munt taka eftir líka inndrátt hér.
Þú getur sennilega álykta hvernig við erum stylizing það.
Í hvert skipti sem ég opna merki, svo að segja, að draga inn I.
Og í hvert skipti sem ég loka a tag, ég un-undirlið
svipuð í anda við hrokkið axlabönd.
Og umfram það, ég er góður að nota dómgreind mína.
Takið eftir að ég gerði ekki nennir hitting Sláðu inni þessi titill tag.
Hvers vegna?
Jæja, ég ákvað bara að það horfði a lítið hreinni mér, manna,
bara ekki nenna að gera það.
Svo aftur, það er sumir dómur kallar bara
eins og það er í C ​​eða hvaða tungumáli.
>> En taka líka að þetta inndráttur lánar sig til andlegs fyrirmynd,
ekki til yfir flækja það.
En tré, ekki satt?
Ef þú hugsa um vef síðu, greinilega skrifað
eins og þetta, eins og að vera fallega inndregin þannig,
þú getur nánast hugsa um opinn krappi HTML lokað krappi tag er demarcating
rót hnút, fjölskyldu tré stíl hnút í stíl trjánum
við skoðuðum síðasta föstudag.
>> Og reyndar höfum við á hérna það sem við munum kalla DOM, D-O-M, skjal
mótmæla líkan, fínt leið til að segja tré sem táknar að HTML.
Og taka eftir að HTML hafi munum við segja, eins ættartré, tvö börn.
Á vinstri er höfuð.
Á hægri er líkami.
>> Og rétt eins og mindless hugsun æfingu, höfuð, að sjálfsögðu, hefur hversu mörg börn
í samræmi við þessa byggingu?
Svo bara einn, title-- og það er þess vegna sem við höfum
örin fara frá höfði að titlinum.
Svo það er eins og þessi maður í ættartré hafði bara einn afkvæmi.
Og þá titill sig geta að segja að eignast barn líka.
>> Muna að HTML hafði halló, komma, veröld undir honum.
Og ég hef einfaldlega dregið hana innan sporöskjulaga í stað þess að ferhyrnings bara
að segja merkingu að jafnvel þótt það er a hnút í tré, svo að segja,
það er tegund af grundvallaratriðum öðruvísi.
Það er ekki merki.
Eða meira rétt, það er ekki frumefni.
Það er bara texti hnút, ef þú vilt.
En þetta eru alveg handahófskennt manna samninga.
Þetta er bara núna mín leið fulltrúi hvað ég sem samanlagt
hringja í skjalið.
>> Og sem innskot, the hlutur á frábær efst vinstra horninu,
opinn krappi upphrópunarmerki Doc gerð HTML, þetta lítur út eins og merki,
en það er heimskulegt horn tilfelli þar það er bara þarna, afrita og líma
til kynna vafra þetta er HTML útgáfa 5.
Heimurinn heldur að breytast hvað á Fyrsta lína af kóða í síðu ætti að vera.
Þetta þýðir bara útgáfa 5.
Svo það er ekki alveg líta út eins og aðrir.
>> Allt í lagi, svo við að sagði, þú munt nú þakka
þetta nokkuð þetta heimskur húðflúr einhver fékk.
>> [Hlátur]
>> DAVID J MALAN: Allt í lagi, og nú skulum raunverulega kafa
í að gera eitthvað með þetta.
Þú munt muna að síðasta sinn Ég opnaði CS50 Tæki
og ég gerði eitthvað sem einfalt og opnun upp gedit.
Og ég spara skrána jafnvel á desktop-- minn hvergi special--
eins hello.html.
>> Svo láta mig gera það again-- hello.html Enter.
Og nú í þessari skrá, er ég að fara að fara á undan og endurtaka það sem við bara
saw-- læknir gerð HTML þá er ég að fara til legg krappi HTML lokað krappi.
Og þá er ég að fara að preemptively opna og loka merki.
Hvers vegna?
Bara svo ég gleymi ekki síðar.
Það er bara gott starf, eins og opnun og loka hrokkið axlabönd allt í einu.
>> Og hvað þá kom næst?
Þú getur hugsað um húðflúr.
>> Áhorfendur: Höfuð.
>> DAVID J MALAN: The höfuð.
Og þá í hérna, ég hafði titilinn, held ég.
Og titill var geðþótta, halló, heimur loka titill.
Og svo niður hér, líkami, af course-- þá við loka líkami tag.
Og þá bara nokkuð redundantly, Ég hafði það sama hérna.
>> Þannig að ég halda því fram að þetta er vefur blaðsíða.
Þetta er eitthvað sem gæti nú lifa á vefnum,
jafnvel þó auðvitað er það bókstaflega býr á skjáborðinu mínu núna.
En reyndar, ef ég lágmarka gedit, Ég sé á skjáborðinu mínu íkon þess.
Jafnvel þó að þetta er tækið, þú gætir gert þetta á Mac OS
án TextEdit eða Glugga með Notepad jafnvel.
>> Og ef ég fer á undan og tvöfaldur smellur að jafnvel, og select-- Jæja, við skulum
ekki valið að vegna Chrome er ekki opnuð.
Skulum fara á undan og opna Chrome.
Og þá gera Command-O fyrir opinn Og sigla á skjáborðið mitt
og opna þá skrá.
Það er hvernig vafrinn túlkar HTML, toppur til botn, vinstri til hægri.
Hey, vafrinn hér er HTML.
Hér er höfuð.
Hér er titillinn.
Hér er líkaminn.
Og reyndar, þetta er hvernig það gerir þessi vefur blaðsíða.
>> En taka slóðina.
Enginn yðar gæti draga upp þessa tiltekna síðu á fartölvur núna,
jafnvel inni af þinn tæki með þessari vefslóð,
því skrá: // bendir það er í raun á skrá kerfi minn, harður ökuferð mín,
ekki þitt.
Þannig að þetta er ekki allt sem að gagni.
>> Skulum fara nú til nota raunveruleg vefþjón.
Og það kemur í ljós á CS50 Tæki er meira en bara umhverfi þar
þú getur skrifað C kóða og safna saman og keyra það eins og þú hafir verið að gera.
Það hefur einnig verið stillt af starfsfólk til að tákna dæmigerður vefur
Miðlarinn sem er á netinu, eitt sem þú vilt borga fyrir
eða einn sem er í svokölluðu ský.
>> Og það er í gangi staðall frjáls opinn uppspretta
hugbúnaður, til dæmis, eitthvað heitir Apache, sem er ef til vill
enn vinsæll vefur framreiðslumaður hugbúnaður í heimi
að þúsundir vefsíður nota í dag.
Og það hefur einnig jafnvel hugbúnaður eins og MySQL,
sem er gagnagrunnur miðlara að við munum loksins fá að,
sem er aðeins að segja Ég get byrjað að meðhöndla
tæki mitt eins og a fullur viðvaningur framreiðslumaður að ég ætla ekki að borga fyrir annars staðar.
Það býr bara á eigin fartölvu mína fyrir þróun og þægindi tilgangi.
>> Svo skulum við fara á undan og nýta þetta.
Ég ætla að fara á undan og opna Terminal glugga.
Og ég ætla að fara á undan og move-- raun, fyrst ég er
fara að sigla til minn skrifborð.
Ef ég LS, það er hello.html.
Og ég ætla að fara undan og byrja að nota
til nýja möppu sem við höfum ekki notað fyrr en í dag.
>> hello.html-- Ég ætla að fara að flytja til ../vhosts fyrir raunverulegur hosts--
meira um það í future-- og þá í möppu sem heitir localhost,
sem er gælunafn gefið næstum hvaða tölvu, hvort sem það er a Mac, PC,
eða Linux tölva, og þá sérstaklega í möppu sem við,
starfsfólk þegar búið til fyrir þig þegar þú sótt tæki heitir
opinber.
Og eins og nafn þess gefur til kynna, eitthvað Ég setti í þessari möppu, í orði,
er að fara til nú almenningi, að minnsta kosti að fólk
sem hafa bein tengingu í tölvuna mína.
>> Svo nú láta mig fara á undan og gera CD í sama skrá
svo ég geti séð hvað er gangi og gerð LS.
Og reyndar, það er eina þar.
Ég kröfu nú að því að ég hef sett þetta skrá hello.html inni möppu
kallast opinber inni möppu kallast localhost inni möppu
kallast vhosts, sem Þökk sé CS50 starfsfólk
hefur verið forstillt til að vera rót vefþjóninum þínum,
Ég get nú vonandi gert þetta.
>> Ég ætla að opna nýjan flipa.
Og ég ætla að fara að skrá: //.
Ég ætla að nota raunverulegt HTTP / localhost, sem
aftur, er gælunafn fyrir minn eigin miðlara.
Og þá er ég að fara að fara á það skrá nafn, bara til að vera skýr?
Hvar er þessi saga líklega fara?
hello.html.
>> Svo í öðrum orðum, ég vil nú þetta er eigin minn tölva, eigin tæki minn,
eins og það er í raun miðlara.
Gælunafnið hennar er localhost.
En hugsa um localhost og eins Facebook.com google.com, hvað sem er.
Það er bara staðbundin nafn mitt.
Og þá er það sem kemur síðas ég vil í rót á disknum, svo að segja,
eða rót vefþjóni, Ergo skástrik og svo
skrá nafn hello.html.
>> Leyfðu mér að súmma út og ýttu á Enter.
Og reyndar, það er nú vefur síðuna mína.
Svo það er aðeins öðruvísi.
Og það er bara eins og underwhelming.
Þetta er gamla útgáfan.
Leyfðu mér að minnka letur aftur.
Þetta er gamla.
Þetta er nýtt.
En hvað er í grundvallaratriðum að gerast nú er að HTTP er að nota.
>> Skulum gera þetta svolítið skýrari eða, ef þú vilt, svolítið flóknara.
Leyfðu mér að fara til the botn réttur hornið tækis míns.
Og taka eftir að allt þetta tími, það er verið að tala.
Það er einstakt netfang af CS50 Appliance þínum.
Það er einkarekinn heimilisfang, eins og fólst í 172,16,
sem bara þýðir aðeins að þú líkamlega hafa aðgang að þessum vefþjóni.
Allt er firewalled og fallega varið frá öðrum
af heiminum vegna þessa takast.
>> Og nú taka þó ef ég fer að Heimilisfangið, ekki í tækið mitt,
en í Mac OS-- ég ætla að fara aftur yfir hér.
Þetta er Mac minn núna.
Og núna er ég að fara að opna þessi útgáfa af Króm hér.
Og ég ætla að fara á http: //172.16.25 / Og ég gleymi rest-- 133.
>> Þannig að ég ætla að fara að skoða af Mac minn að IP heimilisfang /hello.html Enter.
Og nú sé ég frá Mac minn að CS50 Appliance minn, sem er
IP heimilisfang er að númer er örugglega hagar
eins og a vefur framreiðslumaður á internetinu.
Það þýðir ekki að hafa a ágætur auðvelt að muna nafn eins Facebook.com,
en það er með HTTP virðist, jafnvel þótt Chrome
er eins konar einfalda heiminn fyrir okkur en ekki að sýna okkur HTTP.
En þetta er örugglega einmitt það.
Chrome er bara að safna nokkrum mínútum þessa dagana.
Og það er það sem við sjáum núna.
>> Svo er það allt fínt og gott.
En það er ansi underwhelming síðu.
Leyfðu mér að fara inn og gera eitthvað svolítið öðruvísi núna.
Svo láta mig fara aftur til gedit.
Og í stað þess halló, heiminum, við skulum setja mynd.
Og ég hélt frá before-- láta mig fara í localhost skrá almennings minn.
Og láta mig fara á undan og afrita allt fullt af skrá frá dag
frá Dropbox möppu mína inn hér.
>> Nú ef ég tegund LS, líta á öllum þessum skrám
sem ég hef dreift um website Auðvitað er fyrirfram í dag,
einn sem er enn hello.html.
Svo er það að einn.
Og rifja upp þessa vitleysu einn frá síðasta time-- cat.jpg.
Svo láta mig að reyna að fella cat.jpg inni vefsíðu mína.
>> Ég ætla að fara á undan og gera cat.jpg, vista.
Leyfðu mér að fara aftur við Chrome.
Og láta mig súmma í leturgerð og nú endurhlaða.
Úbbs, þar sem ég setti þetta?
Standby-- ég hef enn gamla útgáfa af skjáborðinu opið út.
Svo láta mig fara í vhost minn, minn localhost, opinber minn og hello.html.
Svo nú láta mig fara á undan og segja cat.jpg inni í líkamanum
þar sem ég vil það að vera birtist og endurhlaða.
Auðvitað, þetta er ekki rétt.
>> Þannig að ég þarf að segja Vafrinn smá meira vísvitandi það sem ég vil að hún geri.
Einfaldlega að slá nafnið er augljóslega ekki nóg.
Svo muna að það var annar tag, mynd, IMG fyrir stuttu.
Það er bara vegna þess að menn líkar ekki gerð full orð.
Og þá getum við gert uppspretta = "cat.jpg".
>> Og nú ætla ég að gera eitt öðruvísi hér.
Jafnvel þótt öllum Tags okkar svona langt hafa
hafði þetta hugmyndinni um byrja tag og endir tag,
sem er í raun ekki að gera vit að mynd, ekki satt?
Mynd er annað hvort það eða ekki þar.
Og svo menn hafa komið upp með einfaldari samningur.
Hvenær þú hafa a merki sem geta bæði byrja og enda á sama time--
það getur verið tóm, svo að speak-- bara setja skástrik inni í merkinu
aftast.
Nú láta mig fara aftur til vafranum mínum.
Högg Reload Damn, eitthvað er rangt.
Þú hefur sennilega séð þetta stundum á vefnum,
jafnvel ef það er ekki verið að kenna.
Það er þér að kenna Vefþjónninn er.
Hvaða Odes þetta virðist benda til?
Það er brotinn.
Það er þar sem myndin tilheyrir.
Já?
>> Áhorfendur: En það virkar ekki hafa aðgang að myndinni.
>> DAVID J MALAN: Það er ekki hafa aðgang að myndinni.
Það, eða jafnvel verri, kannski það er ekki einu sinni til.
Við skulum sjá hvort við getum ekki greina það.
Muna frá síðasta sinn að ef í Chrome, í tækið,
eða jafnvel á Mac eða PC, þú ferð til framkvæmdaraðila valmyndinni
og fara í Developer Tools valkostur, sem sennilega þú hefur
ekki notuð mikið eða alltaf.
Og ef ég fer í Network og endurhlaða síðunni,
skulum líta í raun á HTTP beiðnir sem eru gerðar.
>> Það lítur út eins og hello.html er örugglega í lagi, þess vegna 200.
En cat.jpg er 403.
Svo það er ekki 404.
Skrá er sennilega.
403 þýðir bannað.
Þannig að þetta er svolítið ruglingslegt.
Ég ætla að fara aftur Til Terminal gluggann minn.
Leyfðu mér að súmma inn hér.
Og láta mig gera LS.
There er þessir sömu skrá.
>> Nú láta mig gera LS-l, sem þú hefur sennilega
notað áður til að líta á skrá stærðir kannski eða timestamps.
Og við sjáum í heild búnt af yfirþyrmandi upplýsingar.
En taka nokkrar upplýsingar.
Hér er hello.html í þessu róa hér og hér er cat.jpg.
Og það er bara tæki vera notendavænt með því að undirstrika JPEG er
í fjólublátt eins og þetta.
En hvað annað er öðruvísi hjá skráarstærð og skrá nafn?
>> Áhorfendur: [inaudible].
DAVID J MALAN: Já, það er tveimur fleiri R er hérna.
Taka eftir hvað hello.html hefur að fara á.
Svo kemur í ljós að nafn Þessi mappa almennings er mikilvægt.
Nokkuð í þessari möppu er ætlað að vera opinber.
En það er ekki nóg bara að sleppa skrám þar.
Þú þarft einnig að breyta háttur af the skrá,
breyta leyfisveitingum skrána stanslaust ekki
vera sjálfgefin stilling, sem er að aðeins ég get lesið
og skrifa það, ég að vera eigandi.
Ég vil að allur heimurinn alla til vera fær um að lesa skrána mína, svo að segja.
Las bara þýðir að skoða það.
>> Og reyndar, eins og þú munt sjá í vanda setja sjö, það er það meðaltal ÞESSIR R er.
Meina þessi tvö R er láta alla annars staðar í heiminum líka að lesa það,
sérstaklega núna þegar það er í þessari skrá.
Svo einfaldasta leiðin til að laga þetta er að fara að hvetja mína og gera chmod til breytinga
ham og þá gera a + r, að öllu leyti, allir, allir, auk r um les,
og þá cat.jpg Enter.
Ekkert virðist gerast, sem yfirleitt þýðir gott.
Svo LS-L again-- nú skulum líta á cat.jpg.
Og þetta leyfi virðast hafa breyst.
Sem innskot, ef þú gera a mistök og þú, til dæmis,
bara gert your-- ég know-- ekki ritgerð opinberlega aðgengilegt fyrir slysni,
þú getur gert hið gagnstæða, chmod a-r.
Þó hreinskilnislega, ætti það ekki vera í almenna símaskrá
samt ef það er áhyggjuefni.
>> Svo nú skulum við fara aftur til vafrinn minn og endurhlaða.
Og ég ætla að fara að smella litli Ghostbusters
tákn til að hreinsa þann hluta af skjár svo við getum séð nýjar beiðnir.
Og reyndar, hér er Grump Cat frá áður.
En meira um vert, tæknilega, það er
fjöldi 200, sem þýðir að við fengum það í lagi.
Allt í lagi, svo það er allt fínt og gott.
En við erum ekki að gera bestu vefsíður,
né við erum að fara að reyna of erfitt að gera fanciest vefsíður í dag.
En við skulum að minnsta kosti að gera eitthvað Super þekki áður rattling
burt nokkrum öðrum merkjum.
Svo ætla ég ekki bara kött hérna.
Segjum að ég vil í raun og veru þetta köttur að tengja við eitthvað.
>> Ég gæti til dæmis gera eitthvað eins og this.
a fyrir akkeri href fyrir há tilvísun equals--
og við skulum gera bara eitthvað eins www.google.com loka
vitna loka krappi.
Og nú leita fyrir ketti.
Loka akkeri tag.
Svo hefur þetta aðeins eins konar af grundvallaratriðum ný smáatriði.
The tag er að sjálfsögðu öðruvísi.
Það er nafnið a fyrir akkeri href eða há tilvísun.
>> En meira um vert, það er þetta syntactical lögun hér.
Þetta er það sem við munum byrja að hringja ekki tag heldur eiginleiki.
Og eiginleiki er eitthvað sem breytir hegðun merki.
Og þetta eiginleiki, href, þýðir breyta hegðun Þetta akkeri
þannig að þegar það er smellt það fer á þessa slóð hér.
Og auðvitað, það URL er Google.
>> Meðan, hvað er þetta texta hér að fara að vera?
Jæja, það er að fara til vera hvað mönnum raunverulega
sér sem undirstrikaði hlekkur, eins einfalt eins og þessi.
Svo skulum reyna þetta.
Leyfðu mér að spara hana.
Ég er enn í hello.html.
En í útgáfum á netinu, munt þú sjá the raunverulegur skrá nöfn við fyrirfram undirbúin.
Leyfðu mér að fara á undan og endurhlaða.
Og nú er það mjög underwhelming síðu enn.
En ef ég sveima yfir there-- og það er a lítill lítill,
but-- þú geta sjá í the botn vinstri hönd horn á skjánum þínum,
það er örugglega að fara á google.com.
Og ef ég smelli að það mun whisk mér leið til raunverulegur Google.
>> En taka hér tækifæri fyrir misnotkun, rétt eins til hliðar.
Og við munum koma aftur til annarra málefni öryggi áður en langur.
Vegna þess að það er þetta dichotomy milli þar sem þú ferð og hvað þú segir,
þú gætir gert eitthvað eins this-- http://www.google.com.
OK, og nú ef ég endurhlaða eftir vistun þá síðu,
það lítur út fyrir að ég ætla að fara á Google.
En það er engin ástæða sem ég þarft að fara á Google, ekki satt?
Ég gæti í raun farið að eitthvað eins badguy.com, endurhlaða síðunni hérna.
Og taka eftir, það virðist vera að Google.
Og aðeins ef ég er skarpur nóg að sveima hérna
get ég séð að það er jafnvel að fara að fara á annan stað.
>> Þannig að ef þú hefur einhvern tíma fengið tölvupóst, sérstaklega
einn frá Paypal, eða virðist frá Paypal
biðja þig um að skrá þig inn á á reikninginn þinn, þetta
er hvers vegna þú ættir aldrei alltaf smella á tengla í tölvupósti,
Frankly, tengla í tölvupósti.
Ef þú veist að þú ert raunveruleg peningar í Paypal eða banka
Ameríku eða Fidelity eða einhverju website, handvirkt slá það inn.
Vegna líta hversu auðvelt það er að bragð einhvern í að kynna hvað
lítur út eins og tengil.
En það gæti í raun fara algerlega hvar.
>> Og það er miklu meiri ógnir en þetta.
Í raun er þetta dálítið af snertir nú, en einn
af bestu sem ég sá alltaf sem hefur síðan verið lokað,
er einhver leiddi fólk to-- svo þetta gætu sagt,
smelltu hér til að skrá þig inn í þinn Reikningur, bankareikningsnúmer.
Og þetta var Bank á Vesturlöndum.
>> Svo einhver keypti þetta.
Og það er svolítið auðveldara að sjá það í mónó dreift leturgerð aðdregna
í á 30 feta skjávarpa.
En þegar það er smátt letur í tölvupóstinum sem þú ert að fá,
þetta lítur út eins bankofthewest.com, ekki bankofthevvest.com,
sem einhver hafði greitt $ 10 til að kaupa.
Og þá er þetta leiddi þá til jafnvirði slæmar website.
>> Og þú munt sjá too-- reyndar við getum gert this-- ef ég fer til the raunverulegur website,
bankofthewest.com, aftur, muna frá síðasta sinn
að ef þetta er vefsíðan þeirra og þú ert forvitinn um hvernig það virkar,
þú getur örugglega farið til Króm verktaki verkfæri.
Og þú getur séð allar HTML fallega sniðinn þar.
>> En meira til að benda, þú cam-- skulum loka
this-- þú getur farið að skoða Developer View Source.
Af hverju get ég ekki afrita bara allt af því og þá er ég
getur farið inn í litla gedit gluggann minn hér og gera eigin vefsíðu mína.
Vista þetta í hello.html.
Og sennilega er þetta að fara að brjóta, því það er ekki þetta auðvelt yfirleitt.
En nú ef ég endurhlaða eigin síðuna mína á búðu CS50 Appliance og högg Reload,
OK, smá dót braut.
En ég er nokkuð nálægt því að vera með eigin bankastarfsemi website minn, ekki satt?
Allt þetta HTML--
>> [Hlátur]
>> DAVID J MALAN: -I ekki actually-- og þú
veit að það er einhver þarna úti sem myndi í raun að smella þessa tengla líka.
Svo greinilega, smá dót braut.
En það er að fara að leiða okkur inn í umræðu,
óþörfu núna, eins og til hvaða CSS, Cascading Style Sheets, eru,
og hvernig þú í raun sækja aðrar HTML skrár
og JPEG skrár GIF skrár sem the website gæti verið að nota.
En allt sem er accomplishable.
En það snýst í raun um að þessar mjög einfaldar leitandi.
>> Svo nú skulum Lögð bara í gegnum a par af öðrum dæmum um HTML
bara til að gefa þér tilfinningu hvað annað sem þú getur gert.
Fyrir dæmi, þetta er list.html.
Segjum að ég vildi gera vefsíðu með lista yfir hús í quad.
Ég gæti notað ul tag fyrir Óraðaður lista og þá listi atriði barnið
og þá kunnugt over-- eða lista, rather-- húsin sem um ræðir.
>> Og ef ég opna þetta upp, við skulum gera þetta.
Skulum fara að hello.html, heldur til list.html.
Fjandinn það.
Hvernig laga ég þetta?
Það er sama málið og áður, ekki satt?
Svo láta mig gera chmod-- oops-- chmod a + r af list.html.
Og nú ef ég fer aftur í vafranum mínum og smelltu á Reload, þarna er hún.
Þannig að ef þú hefur alltaf langað til að gera a Punktalisti, getur þú gert það.
Ef þú vilt vera frábær ímynda sér og gera skipað lista, ekki óraðaðan lista,
breyta þeim í ol, endurhlaða síðuna og nú flettitæki vilja tala það fyrir þig.
>> Hvað annað getum við gert?
Jæja, a par af others-- ef þú hafir fengið lengi málsgreinum text--
til dæmis, sumir Latin texta eins this--
og þú vilt hafa það í aðskildum málsgreinum, opna p, nálægt p fyrir málsgreinarinnar merkinu.
Og gera það aftur og aftur.
Og ef ég opna nú upp þessa skrá, paragraphs.html vel, þetta
er að fá pirrandi.
Svo nú skulum fara bara aftur til mín hvetja, chmod a + r r stjörnu .html--
a ágætur lítill villtur nafnspjald svo að segja.
Það ætti að festa öll þessi vandamál fyrir mig.
Skulum endurhlaða.
There er þrjár málsgreinar.
>> Og nú skulum fara á undan og opna einn annar.
Hvernig um borð?
Þú munt taka eftir borð útlit svolítið flóknari.
En það er sama idea-- opinn tag, opið tag,
opinn, opinn, opna, loka tag, opinn tag.
Og þessa verður að standa fyrir borð, sem landamæri er greinilega
fara að vera þykkt 1-- hvað að means-- borð róður, borð
gögn, sem þýðir a klefi.
Og ef ég fer aftur í vafranum mínum hér og fara að table.html,
þú getur séð eitthvað eins og þetta, hideous.
En við munum komast að benda þar sem við getum í raun
gera hlutina fallegri en það.
>> Svo láta mig kveða í bili.
There er bunches af fleiri skipanir.
Og HTML er dásamlegt að taka upp vegna þess, hreinskilnislega, það eina sem þú þarft að gera
er að horfa á núverandi vefsíðum sem þú ert kunnug.
Og þú ert eins og, ó, það er hvernig þeir gerðu þetta fagurfræðilega.
>> Eða þú getur litið upp allir online úrræði um hvernig HTML virkar,
og þú munt sjá að það er a heild orðaforða annarra tags.
En með einföldu andlega líkan einn sem nánast allir tag þú opnar
þarf að vera lokað, það virkilega hjartarskinn nægja að kenna sig
HTML eftir skilja Þessar undirstöðu hugmyndir af tags
og eiginleikar og vel formedness að við höfum talað um,
lokun eitthvað sem við gætum opnað svo að við förum ekki rugla ekki vafra.
Svo skulum nú taka þetta að a fleiri áhugaverður stigi
með því að fara í raun.
Og við skulum fara til Mac minn hér, að google.com.
Og nú notice-- skulum gera þetta.
Ég ætla gong að fara til Stillingar, Leitarstillingar.
Ég vil að slökkva þetta pirrandi augnablik Niðurstöður hlutur þar sem það strax
byrjar að bregðast við vélritun.
Við skulum gera þetta eldri skóla svo sjáum í raun hvað er að gerast.
>> Þannig að ég ætla að spara minn Google stillingar hér.
Og nú notice-- ég ætla að leita að einhverju eins og kettir.
Og það er enn að gera farartæki Heill hér, en byggt á hlutum
fólk hefur slegið í fortíðinni.
En taka eftir hvað er að fara að gerast.
>> Í vefslóð í augnablikinu er þetta, bara google.com.
Og tæknilega er það slash.
Google er bara að safna persónu og ekki að sýna okkur það.
Þeir eru að sýna okkur https, bara að vera frábær hughreystandi að við erum
á öruggum eða örugg síða.
>> Svo láta mig fara á undan og leita fyrir ketti.
Nú þetta fékk mjög yfirþyrmandi fljótt.
Horfðu á lengd þessa vefslóð.
En það kemur í ljós að flestir af þessu efni í slóð er í raun frekar gagnslaus.
Ég ætla að byrja að eyða hlutir sem ég skil ekki.
Ég sé ketti.
Ég skil ketti.
Ég veit ekki af hverju kettir eru þar aftur.
Ég virkilega veit ekki hvað þetta bull er.
Þannig að ég ætla bara að fara að halda auðkenning og eyða efni
að ég skil ekki, eima vefslóðina í bara þetta.
>> Nú láta mig fá þátt aftur.
Það lítur út eins og Google virkar enn.
Svo af einhverjum ástæðum, þá eru þeir að bæta við mikið af efni til sjálfgefið url síns.
En það er ekki alveg nauðsynlegt.
Svo er það gott um þetta?
Jæja, láttu mig fara á undan og opna Eftirlitsmaður Króm.
There er a lítill mús flýtileið fyrir það.
>> Fara á flipann Network.
Og nú láta mig endurhlaða síðuna aftur.
Og ég ætla að halda Shift.
Sem innskot, vafra hafa tilhneigingu til að skyndiminni eða vista
upplýsingar bara fyrir sakir skilvirkni er.
En yfirleitt, halda Shift og Endurnýjun mun neyða allt
að byrja upp á frá byrjun.
Og það er það sem ég vil gera hér.
>> Og taka eftir öllum þessum raðir sem bara birtist.
Það kemur í ljós að í hverjum vef síðu, það gæti verið bara ein skrá
involved-- hello.html-- eða þar gæti verið 52, eins og í þessu tilfelli.
Þegar ég fer google.com, virðist, vafrinn minn
ánægja burt 52 sérstakar HTTP beiðnir.
Hvers vegna er það?
>> Jæja, líta á það sem er inni þessa vefsíðu áðan.
Það er ekki bara texti, en það er raunverulegt myndir
kettir yfir til hægri.
There er a litrík logo upp hér á vinstri.
There er öllum þessum táknum fyrir hljóðnema og svo framvegis.
There er a einhver fjöldi af stykki, byggja blokkir, klóra stykki, ef þú vilt,
á þessa vefsíðu.
Og hvað vafrinn er að gera við fá fyrstu skrána sem
er þetta röð hér, er það fyrst og fremst iterating yfir HTML efst
til botn, vinstri til hægri, leita hlutir eins tags mynd eða öðrum merkjum
sem eru að minnast aðrar skrár og þegar það sér þá, fer og ná í þá
gegnum HTTP, hagkvæmur heild umslag samlíking,
og þá birtir þau í viðeigandi stað á vefsíðu.
>> En taka hér ef ég áherslu á fyrstu kasta, leita kettir,
taka eftir því, örugglega það er með HTTP 1.1.
Og því miður, Google Chrome núna í útgáfu 39
er eins konar dumbing hluti niður og ekki sýna okkur raunverulegt haus.
En hvað var örugglega sendur er beiðni fyrir ekki rista, en / leit? q = kettir.
>> Nú, hvers vegna er það mikilvægt?
Jæja, ég ætla að álykta frá þessu að ef þú Google
styður fyrirspurnir þessu formi, hvers vegna get ég ekki innleiða eigin leit mína
vél fyrir CS50, en bara að framan endir, bara grafísku notendaviðmóti.
Og við munum útvista bak endir, raunverulegt leitarniðurstöður Google.
>> Svo hvernig get ég gert þetta?
Jæja, láttu mig fara inn gedit hérna.
Og láta mig fara á undan og opna upp, við skulum segja, nýja skrá.
Og ég ætla að fara að spara þetta tímabundið sem search 0.html.
Og svo að lokum, við munum hratt hlakka til það sem ég fyrirfram undirbúin.
>> Og ég ætla að fljótt svipa upp doc tegund
HTML opinn krappi HTML Loka krappi HTML.
Þá er ég að fara að gera höfuð Loka höfuð opinn titill CS50
Leita í stað Google leit.
Down hér ég ætla að hafa líkaminn, niður hér skammt líkami.
Og nú þarf ég CS50 Search.
Og í raun, við skulum byggja þetta smám.
Ég ætla að fara á undan og loka þessu og reyndar setja það í almenna símaskrá mínum.
Svo gefa mér bara eitt augnablik.
leit-0.html-- ég ætla að tímabundið kalla það search.html.
Ég ætla að chmod það + r search.html.
Og núna er ég að fara að opna hana.
Allt í lagi, svo það var fljótur.
En markmiðið var einfaldlega að fá okkur til að benda
af því að hafa þennan texta skrá sem heitir search.html.
Svo ekki mikið að horfa á enn.
Reyndar, ef ég fer til vafranum mínum, og fara til search.html, það er allt það er.
En þú veist hvað?
Ég get verið svolítið áhugamaður.
Ég las í bók að það er a fyrirsögn tag kallast H1.
Og ég ætla að fara á undan og nota þessi opinn H1 og loka H1.
Endurhlaða síðunni.
Og nú er það stærri og djarfari, ekki allt sem áhugavert,
en að minnsta kosti það byggingarlega meira áhugavert.
En nú láta mig kynna aðra tag.
Það kemur í ljós að það er mynd tag.
Og láta mig loka tagið.
Og það kemur í ljós að það er inntak merki sem
hefur eigindi sem heitir Type, sem eru gögnin gerð sviði,
ef þú vilt.
Og er að fara að vera af gerð texta.
Og gildi þess er að fara vera CS50 Search.
Loka tag.
Og það er að fara að vera nein hugmynd um opnun og lokun með aðskilja tags.
>> Leyfðu mér að fara aftur hingað og sjá hvað er að gerast, endurhlaða.
Getting áhugavert.
Það lítur út eins og það er textabox.
Og í raun, gerði ég ekki vilja að setja gildi þar enn.
Leyfðu mér að fara aftur hingað og í raun fá losna við þetta gildi til að halda það einfalt.
Í stað þess að verðmæti, það sem ég vildi að gefa þetta var nafn.
Og ég veit ekki hvað það er, svo ég kem aftur til að.
>> En undir það, ég vil að gera inntak type = leggja.
Og þetta gildi verður CS50 Search.
Og við munum sjá hvers vegna ég flutti gildi á þessu.
Þegar ég endurhlaða, virðist ég að nú hafa upphaf eigin leit minni
vél, frábær hideous, þó hreinskilnislega, það er
ekki langt innkast frá hvaða Google sjálfgefna síðu lítur út.
>> Ef ég fer hér núna, get ég tegund í kettir og vonandi smella á Leita.
En ég er ekki alveg búin enn, vegna þess að ég hef ekki til framkvæmda,
augljóslega, gagnagrunni.
Ég hef ekki skríða á vefur fyrir leitarniðurstöður.
Þannig að ég þarf að útvista það til Google.
Svo hvernig á ég að gera þetta?
>> Jæja, fyrst af öllu ég þarf að bæta við og aðgerð
eigindi til að mynda merki mínum sem er http://www.google.com/search.
Og ég veit að aðeins að hafa álykta því að horfa náið
á slóð þeirra.
Og nú taka giska.
Hvað ætti þessi texti sviði sennilega að kalla, út frá því hvar við komum
frá áður?
>> Áhorfendur:? Q.
>> DAVID J MALAN: q.
Og við gerum ekki raunverulega þörf spurning merkja það kemur í ljós, en q er örugglega það,
q fyrir fyrirspurn líklega með sjálfgefið, bara vegna þess að það er
hvað Larry og Sergey kom upp með árum.
Svo nú láta mig endurhlaða síðuna.
Það lítur ekki allt sem öðruvísi.
En nú horfa á það sem gerist.
>> Ef ég slæ inn í köttum og smell CS50 Leita og láta fara,
taka ég fá whisked burtu raunverulegum Google.
Nú, Google er að vera svolítið pirrandi í því sem þeir eru
auka við viðbótar breytu, ef þú vilt, á slóðina.
Það er allt að gerast sjálfkrafa á Google hlið.
>> The mikilvægur hluti er að ég virðist hafi skilað þessari beiðni hér.
Og reyndar, það er það sem gerist.
Þegar þú hefur HTML sem lítur svona, þetta
er tegund af vefur verktaki merki fyrir að segja, fara á undan og búa til mynd
að þegar það er lagt fram, það er að fara að fara á þessa slóð.
Og þegar URL hefur veitt gildi fyrir hluti eins Q,
ekki fara bara á þessa slóð.
Reyndar er farið í spurningu Mark og þá q = kettir.
Auka við the breytu, sem HTTP breytu svoleiðis.
>> Og bara til að vera frábær nákvæmur, hvað er verið að álykta here--
en ég ætla að vera meira explicit-- er að aðferðin sem ég vil nota
er að fá, í stað þess að eitthvað eins staða, sem við munum að lokum sjá.
Svo í stuttu máli, einfaldlega með því að skilja HTML og nota sumir nokkuð einfaldar merkingar,
við getum nú byrjað að búa eigin andlit okkar endir notandi
tengi með leit vél á bak við það.
>> En þetta er að sjálfsögðu ansi hideous.
Svo láta mig opna raunverulega upp örlítið betri útgáfa.
Þetta er sá sem ég er gerður í fyrirfram að hefur einhverja athugasemdir.
En þú munt sjá að ég ansi mikið endurskapa það.
Þannig að þetta er nú þegar í boði á netinu.
Og ég kom fyrir preemptively fara til https bara að halda það einfalt.
>> Og nú skulum opna næsta endurtekning af þessu.
Er útgáfa 1 í stað 0.
Hvað stekkur út á þig eins örlítið mismunandi í þessu dæmi?
>> Áhorfendur: [inaudible].
>> Já, það er þetta texti Miðjustilla.
Þetta er svolítið skrítið upp hér.
En þetta er örugglega ný.
Og kannski giska á hvað er að fara að gerast.
Ef ég fer í vafranum mínum núna og heimsækja leit-1.html,
það er nánast það sama.
En það er skref nær vera svolítið meira falleg.
Það er samt ljótur, en fallegri því amk allt er nú miðju.
>> Svo kemur í ljós að það sem ég ætla að nota er annað mál að öllu leyti kallað
CSS, Cascading Style Sheets.
Og CSS, hreinskilnislega, er góður af, í persónulegum mínu mati,
sem atrociously hannað tungumál.
Það er mjög pirrandi að muna allar hinar ýmsu upplýsingar.
En það er það sem stylizes sem allt um allan heim vefur dag.
Ég móðga einhvern.
Allt í lagi.
Svo skulum við fara aftur hingað og sjá hvernig við erum í raun að nota þetta.
Og það kemur í ljós, að minnsta kosti er það raun frekar einfalt mál.
Það er bara lykill gildi par, eiginleikar og gildi, eiginleikar og gildi.
Reyndar, hér er ein slík eign og verðmæti.
>> Einfaldlega með því að nota stíl eigindi á líkama tag minn
og gefa það a gildi af a orð ristill og annað orð,
eða eign og verðmæti, Ég get haft áhrif á fagurfræði
á vefsíðu, ekki endilega uppbygging enn,
en fagurfræði hennar.
Og bara með Googling kring, átta ég að CSS, Cascading Style Sheets,
styður eign heitir texta-align, ætíð er hægt
vera vinstri, hægri, eða miðju, til dæmis.
>> Svo núna þegar ég endurhlaða síðuna, það sem ég gerði að fá
var miðju síðu, en samt ansi ljót.
Skulum fara á undan og opna upp útgáfu 2 af leit.
Og nú eftir að ég hef gert svolítið meira.
Takið eftir að hér inni í höfðinu tag, þar er hægt að vera meira en titil.
Í staðreynd, there er a stíll tag.
Og þetta er þar sem það fær bara lítið sóðalegur sjón CSS stundum.
>> Takið eftir að ég virðist hafa eitthvað að byggingu lítur mjög öðruvísi.
En hér er nafn merkið sem ég vil stílfærð.
Hér eru gamlir vinir okkar hrokkið axlabönd og lokað hrokkið Brace.
Og þá er hér að eign og verðmæti þess.
>> Ef ég hlaða þessari skrá, search2.html, niðurstaðan er eins.
En það er skref í átt að betri hönnun.
Með þátta þessa CSS, hef ég ekki commingled það með HTML mínum.
Og reyndar, eins og við munum sjá, ég gat endurnýta þessa eiginleika og gildi.
Ef ég vildi gera bunches af hlutar vefsíðu mína miðju,
Ég þarf ekki að slá style = text-align Center um allt.
Ég get sett á einum stað kannski, eins og upp á toppinn.
>> En jafnvel er þetta ekki besta hönnun.
Í raun einn af þeim hlutum sem þú munt læra sem þú eyðir meiri og meiri tíma með
vefur forritun er að því meira sem þú getur modularize hluti og þáttur hlutum út
eins .h skrám láta okkur storkuþátt dót út, eins helpers.c láta okkur þáttur hlutum út
nokkrum psets síðan.
Álíka, gætum við vilja til að ná þessu.
>> Svo taka í útgáfu þrjú search.html ég hef
hreinsa upp höfuð á síðunni og bara setja
í þessu, tengill tag, sem bága við nafni,
ekki gefa þér tengil.
Hún tengist aðra skrá við vegur af sem er href ætíð er í þessu tilfelli,
er leitin-3.css
Svo ég átta sig að við erum að fara fljótlega.
En allt sem ég er að gera er góður að færa hlutina í kring.
Leyfðu mér að opna leit-3.css.
Þar er ekkert í raun til þess.
Ég afrita bara og líma það inn í nýjan skrá, mikið eins og við þáttur dót út
í öðrum skrám áður.
Og result-- alveg underwhelming--
er að fara að vera nákvæmlega sú sama.
En við erum að flytja toward-- nei, það er ekki.
Oh, ég veit af hverju.
>> Svo virðist vera galla.
Og það er í einhverjum skilningi.
En láta mig opna flipann Network mína.
Leyfðu mér að endurhlaða síðunni.
Æ, hvers vegna er CSS ekki verið beitt?
Vel, CSS skrá, álíka hefur að vera heimur læsileg, svo að segja.
Og það líka er nú bannað.
Svo láta mig gera chmod a + r Star punktur CSS-- whoops--
við erum punktur CSS er bara skrá eftirnafn fyrir CSS skrár.
Nú láta mig fara aftur til vafrinn minn og endurhlaða.
OK, smá betri.
>> Nú láta mig gera eitt síðasta hlutur.
Í leit-4.html.
Ég er með útgáfu sem ég hélt bara var vegur kaldari vísu vegur meira
flókið.
Við skulum líta á niðurstöðuna fyrst.
Loka þessu að gefa okkur meira pláss.
Breytt þessu til að leita-4, Enter.
>> Og nú fullt af hlutum eru brotin.
Ég ætla að fara aftur í skrá minn hér.
Og núna er ég bara að fara að gera a chmod af a + r á file--
vegna þess að ég veit að það exists-- kallað logo.gif, sem er mynd.
Og nú endurhlaða.
Og wow-- svo núna er ég frekar nálægt, hreinskilnislega,
til eins og 1999 útgáfa af Google, og Frankly, 2014 útgáfa af Google,
ekki satt?
>> Svo það er nú að fara til þeirra website, Á endanum, ef ég leita að ketti.
Og reyndar er það.
En hvað gerði ég öðruvísi í þessari útgáfu 4?
Þannig að við munum ekki búa of mikið á það hér.
Þú munt sjá þetta í vandamál setja sjö endanum.
En taka ég gerði nokkra hluti.
>> Ég kynnti div tag, sem er deildarstjóri,
svipuð í anda við efnisgreinaskipun.
En deild er bara eins, hér er rétthyrnd ósýnilega svæði
af skjánum.
Við skulum gefa það einstakt auðkenni, fótur, bara
svo að við getum talað um það í HTML okkar annars staðar.
Hér er annað div á síðunni Hvers ID er að fara að vera efni.
Það er efni á síðunni.
Og hér er haus á síðunni.
>> Með öðrum orðum, hef ég meginatriðum í HTML am andlega
skoða þessa vefsíðu sem þrír þættir, a haus
upp hér við þessa ósýnilega rétthyrningur, efni í miðjunni, og þá
síðufótinn niður neðan, jafnvel þó að við sjáum ekki þá hluti.
Vegna þess að ég vil í höfðinu mínu síðu hér, eða í .css skrá,
Ég get notað þetta setningafræði.
>> Header er ekki tag.
Það er ID svo það snýr út að með því að gera #header,
Ég get nú sótt eitt eða fleiri eiginleikar við hausinn.
Ég get gert það sama efni, sama fyrir efni sem hér er.
>> Svo til dæmis, í fót, fyrirvara allar þessar eignir sem ég ætla að bæta.
Og ég veit að þeir eru bara með því að lesa upp á heimildasöfnun fyrir CSS.
Leturstærð er að fara til vera smaller-- svo sumir font size.
Þyngd er að fara að vera djörf.
Margin-- hversu margir punktar kring er it-- 20 punktar.
Og það er að fara að vera fyrir miðju.
>> En núna, síðan lítur svona út.
Ef ég er ekki ánægð með mitt eintak rétt þar,
Ég gæti gert eitthvað eins rauða litinn.
Og þá get ég vistað þetta, endurhleður og nú er ég hef stílfærð footer.
Þannig að þetta er bara vísbending á vald um hvað þú getur gert í vefsíðu
að breyta gangi leiksins.
>> Og jafnvel kælir en þetta, ef þú vilt að pota í kring með raunverulegum vefsíður,
þú getur ekki varanlega breyta þeim.
En ef ég opna Inspector Króm aftur
og ég fer ekki til vinstri hönd hlið hér, sem sýnir HTML Facebook,
en sýnir á hægri hönd hlið öllum CSS þess,
þú getur annaðhvort og breyta hlutum á flugu.
Svo láta mig fara á undan og gera þetta.
>> Leyfðu mér að fara á undan og stjórn smelltu á þennan handahófi orð hér,
undirrita og smelltu Skoðið frumefni.
Chrome stökk mjög þægilegur til H1 tag sem Facebook er að nota.
Og taka eftir hér Facebook hefur konar lazily
harður dulmáli leturstærð sem eign hér.
>> Svo kaldur hlutur er þó að ef ég fer reyndar í hér
og segja, ó, Facebook, mér líkar ekki það 64. dílar, getum við nú að breyta Facebook.
Auðvitað erum við aðeins að breyta henni fyrir mig persónulega í augnablikinu.
En þetta er bara annar tól í verkfærasett okkar
það er að fara að leyfa okkur að fínstilla og reikna út og einnig greina
málefni í okkar eigin vefsíðum.
Og við gætum á sama hátt farið yfir hér, sem er það sama.
Ef þú vilt virkilega að fá ímynda sér, ég meina, nú að þú getur raunverulega stökkbreyst síðuna
og gera brjálaður hlutina.
>> Svo hvers vegna er þetta allt að gagni?
Jæja, að lokum, við erum fara til að vilja vera
fær um að búa til vefsíður sem eru knúin áfram af eigin baki okkar endar,
ekki bara með því að Google og útvistun bak endir þar.
Við viljum í raun og veru að gildi, til dæmis,
aðgerða leitarvélarinnar okkar eigindi til að fara ekki til einhvers annars,
en að eitthvað eins search.php, þar search.php er á eigin miðlara okkar,
ekki á einhver annars.
>> Og svo til að fá það, við í raun þarf að kynna nýtt tungumál.
Þannig að við höfum nú þegar litið á eitt nýtt tungumál hér, eða tveir í raun, HTML
og CSS.
En þeir eru í raun bara uppbyggingu og fagurfræðilegu tungumálum.
Þeir eru ekki að forritun tungumál í sjálfu sér.
Og það er um eins mikið formleg tíma sem við munum eyða þeim.
Þar sem við munum byrja núna að umskipti á PHP.
>> Svo er PHP raunverulegur forritunarmál.
Það er a forskriftarþarfir tungumál í þeim skilningi að það er
ætlað að vera léttari þyngd en eitthvað eins C.
Og það er túlkað tungumál, sem þýðir að það er ekki unnin.
Svo í hnotskurn, hvað gerði það þýtt þegar við notuðum tungumál eins og C
og við þurftum að taka saman það?
Hvað þýðir það að þýða C kóðann?
Áhorfendur: [inaudible].
DAVID J MALAN: Segja það aftur?
Áhorfendur: [inaudible].
DAVID J MALAN: Perfect.
Það kemur því í tvöfaldur.
Það kemur því í zeroes og sjálfur frá raunverulegum English-Source kóða.
Og þá getum við í raun keyra þær zeroes og sjálfur
því komið þeim í gegnum CPU með því að tvísmella tákn
eða keyra skipunina.
>> PHP og Python og Ruby og Perl og JavaScript
og bunches af öðrum tungumál eru túlkuð
tungumál, sem er að segja þú saman ekki.
Frekar, fæða þig þá sem innlegg forrit sem heitir túlk.
Og það túlkur, sem einhver annar skrifaði,
les fengið kóðann þinn toppur til botn, vinstri til hægri og aðeins túlkar
þeim línum og gerir það sem þú segir.
>> Svo ef þú lendir a lína sem segir prenta,
það er ekki endilega umbreyta prenta við samsvarandi núllum og sjálfur.
Það hefur bara þessa túlk eins stór ef ástand sem segir,
Ef kennsla forritari er prenta, gera þá eftirfarandi.
Svo það túlkar það bara með konar röksemdafærslu
gegnum það sem þú ert að segja það að gera.
>> Og PHP er einn af þessum tungumálum.
Og PHP árum var hannað einmitt fyrir forritun vefnum.
Og það var upphaflega mjög sloppy sóðalegur tungumál.
Og reyndar, það er a gríðarstór magn af slæmur PHP kóða þarna úti.
En tungumálið sjálft hefur þroskast í gegnum árin,
svo mikið svo að nú er það raun yndislegt næsta skref
pedagogically úr C því það er svo darned kunnugleg allt
þú hefur bara séð á undanförnum vikum.
>> Sá Upphafleg munur við munum sjá er að það er engin Helsta hlutverk lengur.
Þegar þú byrjar að skrifa kóðann, það er bara fara að fá fram sama hvað,
eins og við munum sjá í smá stund.
Meðan, hér er það a breytu lítur eins og í PHP.
Það er svolítið öðruvísi, en aðeins varla.
>> Í PHP, það er ekki sterkt vélritun.
There er viku Vélritun, sem bara þýðir að það
eru gögn tegundir eins strengi og tölur og annað.
En þú nennir ekki að tilgreina hvað þeir eru lengur.
PHP tölum út fyrir þig.
The dollari skilti er bara ákvörðun að PHP fólk með ára
síðan þannig að allir breytu í PHP bara byrjar með dollaramerki.
Það er í raun eins konar gagnleg í að það stekkur út á þig smá meira.
>> En eftir það, þetta er ástand í PHP.
Hvað er öðruvísi móti C?
Bragð question-- ekkert, sem er reyndar mjög gott.
Boolean tjáning í PHP-- sama.
Boolean tjáning með og móti eða, rofar, lykkjur, lykkjur, loops-- OK,
þetta er öðruvísi.
>> Svo kemur í ljós að það er a par af öðrum aðgerðum í PHP.
Einn af þeim er í raun þetta, sem er frábærlega þægilegur.
Ef $ tölur er array að þú hafir lýst áður í forriti,
þú hefur þetta ímynda fyrir hvert reisa að í stað þess að gera allt sem
pirrandi I er 0, ég er minna en þetta, [? Ég ++?]
fyrir hvert númer sem fjölda, þar sem hver af þeim skilti dollara gildi er bara
breytu, og seinni þú getur hugsað sem I.
Þú gætir kalla það hvað sem þú vilt.
Ég kallaði hana tala.
Þetta er að fara að iterate yfir array heitir númer.
Og á hverjum endurtekning, það er fara sjálfkrafa uppfæra
fyrir þig dollaramerki tala breytu svo að þú stöðugt
hafa aðgang að breytu sem þú vilt án þess að þurfa að gera allir hornklofi
Rithátturinn eða flokkun í fylkinu.
>> Umfram það, höfum við jafnvel hluti eins fylki, sem líta næstum því sama,
nema það er mjög algengt, sem við munum sjá, bæði í PHP og Javascript
til pre frumstilla fylki nota hornklofa.
C notar hrokkið axlabönd.
Svo það er örlítið öðruvísi, jafnvel þótt við vissum ekki raunverulega nota þessi bragð mikið.
>> En jafnvel meira kröftuglega, PHP hefur tengin fylki,
sem er fínt leið segja kjötkássa matskeið.
Í staðreynd, ef þú vilt að lýsa yfir kjötkássa borð í PHP, ólíkt í C-- hversu margir
línur af kóða var það tekið til raun innleiða kjötkássa borð í C?
Eða hversu margar línur af kóða er það taka að innleiða kjötkássa borð í C?
Svo það er líklega mikið, ekki satt?
Það er nokkrum tugum, kannski 100 eða 200.
Það er nontrivial.
Eða það er um að vera, eins og þú munt fljótlega sjá, nontrivial
að innleiða kjötkássa borð [Inaudible] og einnig að reyna.
En í PHP-- og hreinskilnislega, ég sennilega ætti ekki að segja þér þetta
þar Monday-- í PHP, ef þú vilt borð, gert.
Það er a kjötkássa table-- svo með einni línu af kóða.
Og
>> A einhver fjöldi af tungumálum gera það.
Hafa gaman með pset fimm.
Svo mikið af tungumálum gera þetta.
Þeir gefa þér þessar abstraktmyndir að annað fólk, önnur forritari,
hafa búið til fyrir þig svo að þú getur staðið á herðum þeirra
og byrja að nota hugmyndir sem eru frábær sannfærandi, eins kjötkássa matskeið og tré
og reynir.
En þú þarft ekki endilega að innleiða þá hluti sjálfur.
>> Og svo að lokum, hvað við erum að fara að nota PHP til að
er hugsanlega að skrifa forrit af svokölluðu stjórn lína.
Við gætum endurskapað hvert forrit við höfum skrifað þessa önn svona langt,
nema kannski Brot sem notar kerbrotum, sem er sérstaklega við C í augnablikinu.
En annan hvern Heimadæmi, vissulega Mario og Caesar
og Vigenere og [? Sprunga?] Og áfram, Við
gæti aftur innleiða í PHP, og líklega aðeins auðveldara.
>> En hvað við erum að lokum fara að nota PHP til að er vefur forritun.
Og við erum að fara að kynna næstu viku andlegt líkan, fyrirmynd sem kallast
MVC, líkan skoða stjórnandi, sem ef þú hefur gert forritun
áður í Python eða Ruby eða annars staðar, þú
gæti vita af þessu liði með Teinum og Django og þess háttar.
En ef þú ert nýr til þetta líka, sérðu
að þetta er í raun mjög eðlilegt framhald af þáttun
og tegund af hönnun af kóða sem við höfum
verið að gera í C. Við erum að fara til nú beita sumir af þeim lærdóm til PHP
svo að lokum, við erum framkvæmd eigin vefsíður okkar.
Og ef þú ert eins konar mesmerized eða undrandi
að við erum að fara að gera allt af svo fljótt,
átta sig á því nánast á hverjum önn, næstum 90%
nemenda CS50, þ.mt þær sem hafa aldrei forritað áður,
enda á því að gera lokaverkefni sem eru byggðar á vefnum forritun.
Og svo þú munt sjá að arðsemi eru hátt í næstu vikur.
Þannig að við munum sjá þig þá á mánudaginn.
>> Ræðumaður 1: Og nú, Deep Hugsun eftir Daven Farnham.
Kjötkássa matskeið.
>> [Hlátur]