>> [MUZIKO Ludante]
DAVID J Malan: Bone, bonvenigas reen.
Tio estas CS50.
Jen la fino de semajno sep.
Kaj ĝi estas la fino de tiu kadavromanĝanto ĉaso de problemo starigis kvar
ke vi eble memoras.
Post rekuperi ĉiuj tiuj JPEGs de personaro,
vi defiita, se vi ŝatus, foti vin per tiom da
de tiuj homoj kiel vi povas.
Ni havas ĉiu faskon de formularoj dum la lastaj semajnoj,
ja sufiĉe da tuj antaŭ tagmezo hodiaŭ, iuj de kiuj estas tiuj tie,
kaptita tie in-- aspektas like-- Annenberg Salono en oficejo horoj, oni tie
en Lowell House kun Nick.
Jen Ramon esti kaptita en la telefono.
Tiu estis en CS50 lunĉo.
Ĉi estis Jason Skyping kun pli creativos samklasano,
kiuj telefonis al li tiamaniere.
Ni ne scias kio tio estis.
>> [Ridado]
>> DAVID J Malan: Sed ke valoras gigabajto.
Jen Chang, kiu laŭvorte kuris de la scenejo
eviti esti fotita unu tago, sed estis finfine kaptita.
Jen estas Nick.
Kaj tie ĉi estas Alison malsupren por la kampoj.
Kaj Zamyla eĉ troviĝis en dancejo konkurado.
Do ni iru tra tiuj fotoj, elŝeligi
kiu prezentis la plej la plej fruaj kaj rekompenco
unu fabela premio, kiel promesita en la spec.
Kaj ni ankaŭ sekvi supren proksimume la spaco kiu estis implikita.
>> Paro de announcements-- tiel tagmanĝi estas, denove, ĉi vendredo je 1:15 ptm.
Se vi ŝatus aliĝi nin RSVP en tiu URL tie.
Jason aperas denove tien el unu el la sekcioj de paro de jaroj
dorso, kio okazis fali sur Halloween.
Kaj efektive, li vestis kiel kukurbo tiu aparta jaro.
Se vi rigardas tiun sekcion el lia de 2011 sekcio
ok, se vi estas scivolema, ĉe CS50.tv, furaĝo
tio estis la jaro en kiu lia aerumo laboris.
>> Se vi do rigardas la simila sekcio en 2012,
vi vidos ĉi Jason multe desinflado, ekde la kostumo ne plu funkciis,
kio estas nur por diri tiu vendredo, se vi volas
plaĉas skulpti kukurbo kun Daven kaj Gabe kaj aliaj, RSVP al la kapoj
ĉe cs50.harvard.edu adreso.
Ĝi promesas esti granda amuzo.
Daven, ni diris, ĝi skulptita Kukurboj ĉiuj de lia vivo.
Gabriel el Brazilo havas neniam skulptita kukurbo por Halloween.
Do vi kun ili, kiel Li lernas.
>> Seminarioj, meanwhile-- tiel vi lernos frue
pri kio nia atendoj estas por la fina projekto, kiu esence
Mi bolas malsupren al desegni kaj efektivigi
plej ajna projekto de intereso al vin, kvankam temo por la aprobo
kaj gvido de via instruado ulo.
Al la fino de la semestro, ni enkondukas nombro
de seminarioj, kiuj estas laŭvolaj klasoj gvidata de la instruado uloj kaj Harvard
bastono, amikoj de la kurso trans campus, pri diversaj temoj kiuj
estas tuŝaj al la Certe la suba Syllabus
sed tamen aplikebla, amuza, kaj malsama por potenciala fina projektoj.
>> Ekzemple, la unua, se vi volus registri, kapo al tiu URL tie.
Kaj jen estas la formado de ĉijara seminarioj sola.
Sed rimarkas ke ni havas dekojn da seminarioj de jaroj pasintaj, ĉiuj el kiuj
estas ligitaj en la Seminarioj menuo eblo de la kurso de afiŝinto.
Do, se vi pensas pri iri preter vian komforto zono
aŭ repreni iujn novajn kapablecojn, ekzemple programado iPhone
apps kun Swift, nova lingvo de Apple aŭ Objective-C
aŭ Android apps aŭ programado [? Cue?] ampoloj, aŭ ĉiu de la temoj
tie supre kaj pli, pro ĉeko la enskribo paĝo.
>> Do ni komencis kaj finis la Lundo per rigardante HTTP.
Tiel rapide refresher-- HTTP, Hiperteksto-Transiga Protokolo.
Sed kion signifas tiu vere signifas?
Kion tio vere signifas?
Ĉu tio estas la mano?
Mi scias ke vi simple skrapante via kapo.
Sed vi volas proponi kion HTTP estas?
>> Publiko: Kiel komputiloj komuniki kun [inaudible].
DAVID J Malan: Mi perdis la lastan parton.
Kiel komputiloj komuniki with--
>> Publiko: Interreto serviloj.
DAVID J Malan: Good-- kun interreto serviloj, kaj specife, ttt-serviloj.
Pro memoro, estas aro da servoj sur la interreto, el kiuj
vi uzas verŝajne ĉiutage inter babilejo kaj mesaĝo, babilejo kaj retejo, retpoŝtilo,
kaj similaj.
Kaj HTTP estas nur la protokolo kiu foliumiloj
paroli kiam komuniki kun retserviloj, kaj inverse.
Kaj la analoga en la homa mondo povus esti,
Mi etendos Mian manon skui iuj aliaj homaj aj kaj li aŭ ŝi
agnoskas etendante sian manon tiel.
Do tio estas nur protokolon, aro de konvencioj.
>> Kaj kio ja estas tiuj konvencioj?
Nu, ĝuste bolas malsupren al sendante mesaĝojn tien kaj reen,
kiel ni priskribis tie.
Kaj tie estas kelkaj manieroj kiun vi povas sendi tiujn mesaĝojn.
Kaj eble la plej komuna estas konata kiel get.
Kaj ni vidos kontraston al tiu antaŭ longe.
>> Sed get peto de navegador al servilo simple aspektas kiel ĉi.
Estas aro da teksto kiu metas ene de virtuala koverton.
Ekster tiu koverto iri paro pecoj de detaloj.
Kion bezonas iri en la koverto, por tiel diri,
por akiri peton kiel tiu de mi al reta servilo?
Yeah.
>> Publiko: Via IP-adreso.
>> DAVID J Malan: Mia IP-adreso en la De kampo, tiel diri,
kaj kompreneble la ricevanto IP adreso.
Sed en la kazo de TTT pakoj, ni bezonas iom pli detale
Ne estas sufiĉa nur por sendu koverton al servanto,
ĉar tiu servilo eble aŭskultante por malsamaj tipoj
de interreto trafiko.
Do kion ajn ni bezonas krom la ricevanto IP?
Yeah?
>> Publiko: CXu TCP?
DAVID J Malan: Bone.
TCP--
>> Publiko: Adreso.
>> DAVID J Malan: Adreso: aŭ haveno, kiel ĝi nomiĝas.
Apude, sed TCP haveno nombro.
Kaj estas faskon de tiuj.
Sed verŝajne la plej familiara devus eventuale
esti 80, kiu estas la defaŭlta oni uzas por reta trafiko.
Kaj alia familiara oni baldaŭ estos 443,
kiu estas uzita por sekura retejo trafiko, URLoj kiuj komenciĝas per https.
>> Do jen kion sekvinbero ene de tiu koverto.
Kaj instigi / simple signifas, doni mi la defaŭlta retpaĝo.
Donu al mi la radiko de la malmola stiras sur tiu TTT-servilo.
Kaj espereble, la retejo servilo respondos kun, OK
kaj la numero 200, kiu estas ĝuste konvencio dirante, jes, ĉiuj
Estas ja bone.
Jen la paĝo.
La tipo de la retpaĝo tuj esti teksto, sed pli specife, HTML,
kiun ni pri plonĝi reen en.
Kaj la skalara dot ŝprucas simple pere, jen HTML.
Kaj tio estas kie ni Repreni la rakonton hodiaŭ,
efektive skribi HTML, Hiperteksto Markup Language, kiu
estas la lingvo en kiu retpaĝojn skribitajn.
Tio ne estas programlingvo.
Mankas funkcioj aŭ bantoj aŭ kondiĉojn.
Estas markado lingvon, tiel denove vidi hodiaŭ,
kiu permesas entajpi kiel strukturi kaj stylize
estetike retpaĝo.
>> Do tio estis la kaj nur paĝaro ni vere
rigardis, se mallonge, lunde.
Kaj rimarkis kelkajn elstaraĵo karakterizaĵoj.
Ekzistas amaso de malferma angled krampo kaj proksima angled krampo.
Inter tiuj angled krampoj estas vortoj.
Kaj ni tuj komencas nomante tiujn vortojn etikedojn.
Tiel malferma krampo kapo kaj fermita krampo kapo
estas la malfermitaj kaj fermitaj etikedoj, aŭ la komenco kaj fino etikedoj
respektive, de HTML elemento, kiel ni nomas ĝin, nomita kapo.
Kaj la sama ĵargono validas al korpo en HTML ktp.
>> Kaj kio estas agrabla estas HTML-- kaj ja, ni
elspezi terure malmulte tempo sur ĝi, ĉar vi plejparte nur elkompreni
kio montras ke ĝi havas kiam fakte havas konkretan problemon
al solve-- vi trovos ke navegador estas bela muta.
Estas nur tuj do-- ne kontraste oni computer-- kion vi diros al fari.
Do kiam vi havas malfermita krampo HTML ĉe la plejsupro
tie, ke esence simple signifas, hej, retumilo,
tien venas retpaĝo skribitaj en HTML.
>> Kiam vidas malferma krampo kapo, tio signifas nur,
hey, retumilo, tie venas la kapo, aŭ la plejsupra parto de mia retpaĝo.
Kiam vidas fermita krampo kapo, tio nur signifas, he,
tio estas por la kapo.
Standby por io alia.
Kaj ke io estas ŝajne tuj estos la korpo.
Kaj vi ne havas etikedon, kiel Vi havas nur saluton, komo, mondo,
Tio estas nur tuj estos krudan tekston kiu fine montriĝas sur la ekrano.
>> Nun, vi rimarkos tro la deŝovon tie.
Vi povas probable konkludi kiel ni stylizing ĝin.
Ĉiufoje mi malfermos etikedo, tiel diri, mi Krommarĝenon.
Kaj ĉiufoje kiam mi fermas tag: Mi mal-skripton,
simila en spirito al krispa krampoj.
Kaj preter tio, mi estas afabla uzi mian juĝon.
Rimarki ke mi ne ĝenas bati Eniri ene de tiu titolo etikedo.
Kial?
Nu, mi simple decidis ke atendinte iom purigisto al mi la homo,
por simple ne tedis fari tion.
Do denove, ekzistas iuj juĝo nomas simple
kiel ekzistas en C aŭ ajna lingvo.
>> Sed rimarkas ankaŭ, ke ĉi deŝovon pruntas al mensa modelo,
Ne over kompliki ĝin.
Sed arbo, ĉu ne?
Se vi pensas pri retejo paĝo, ŝajne skribita
tiel, kiel estante bele dentado aliflanken,
vi povas preskaŭ pensas pri la malferma krampo HTML fermita krampo etikedo estas Marki
la radiko de nodo, familio arbo stilo nodo en la stilo de la arboj
ni rigardis pasintan vendredon.
>> Kaj efektive ni havos en la dekstra tie kion ni nomas DOM, D-O-M, dokumento
objekto modelo, fantazio maniero diri arbo kiu reprezentas tiun HTML.
Kaj rimarki ke HTML havas, ni diras, kiel familio arbo, du infanoj.
Maldekstre estas kapo.
Dekstre estas korpo.
>> Kaj same kiel senhonta penso ekzercon, kapon, kompreneble, havas kiom da infanoj
laŭ tiu strukturo?
Do nur unu, title-- kaj tial ni havas
La sago iranta de kapo al la titolo.
Do estas kvazaŭ tiu persono en la genealogia arbo havis nur unu ido.
Kaj tiam titolo mem povas diri havi infanon ankaŭ.
>> Memoru ke la HTML havis saluton, komo, mondo sub ĝi.
Kaj mi simple desegnita ŝin ene ovala anstataŭ ortangulo simple
transdoni semantike ke kvankam ĝi estas nodo en la arbo, tiel diri,
ĝi estas ia fundamente malsama.
Ne estas tag.
Aŭ pli ĝuste, ĝi estas ne ero.
Estas nur tekston nodo, se vi volas.
Sed tio estas tute ajnaj homaj konvencioj.
Tiu estas ĝuste nun mia formo de reprezenti kion Mi timige kiel aldonita
vokas la dokumenton.
>> Kaj kiel flanken, la afero la super supra maldekstra angulo,
malferma krampo ekkrion punkto doc tipo de HTML, tio aspektas kiel etikedo,
sed estas la stulta angulo kazo kie ke estas ĝuste tie, kopiis nuda
indiki la retumiloj tio estas HTML versio 5.
La mondo daŭre ŝanĝanta kion la unua linio de kodo en paĝo devus esti.
Tiu nur signifas versio 5.
Do ĝi ne tute aspektas kiel la aliaj.
>> Bone, do kun tiu diris, ke vi nun estimi
tiu sufiĉe sensenca tatuaje iu havas.
>> [Ridado]
>> DAVID J Malan: Bone, kaj nun ni efektive dive
en faranta ion per tio.
Vi memoras ke la lasta tempo Mi malfermis la CS50 Appliance
kaj mi faris ion kiel simpla malfermado gedit.
Kaj Mi savis la dosieron eĉ miaj desktop-- nenie special--
kiel hello.html.
>> Do lasu min fari tion again-- hello.html eniri.
Kaj nun en tiu ĉi dosiero, mi tuj bonvolu repliki kion ni ĵus
saw-- doc tipo html Do mi tuj fari malferma krampo html fermita krampo.
Kaj poste mi iros al preventa formo malfermi kaj fermi la tag.
Kial?
Nur por ke mi ne forgesu poste.
Estas nur bona praktiko, kiel malfermo kaj fermante frizita krampoj ĉiuj samtempe.
>> Kaj tiam kia venis poste?
Vi povas pensi pri la tatuaje.
>> Publiko: La kapon.
>> DAVID J Malan: La kapon.
Kaj tiam ĉi tie, mi havis la titolon, mi pensas.
Kaj la titolo estis arbitre, saluton, mondo proksima titolo.
Kaj poste malsupren tie, la korpo de course-- tiam ni fermas la korpo etikedo.
Kaj tiam simple iom redunde, Mi havis la saman aferon ĉi tie.
>> Do mi asertas ke tiu estas retpaĝo.
Tiu estas iu kiu nun povis vivi en la reto,
kvankam kompreneble, estas laŭvorte vivanta sur mia labortablo nun.
Sed ja, se mi minimumigi gedit, Mi vidos sur mia labortablo lia ikono.
Kvankam ĉi tiu estas la aparato, Vi povus fari tion en Mac OS
sen TextEdit aŭ Fenestroj kun Notepad vespero.
>> Kaj se mi iros antaŭen kaj duobla klako ke eĉ, kaj select-- bone, ni
Ne elektu ke pro Chrome ne estas malfermi.
Ni iru antaŭen kaj malfermi Chrome.
Kaj tiam fari Comando-O por malfermi Kaj navigi al mia labortablo
kaj malfermi la dosieron.
Tio estas kiel navegador interpretas HTML, supre sube, maldekstre dekstren.
Hej, retumilo jen HTML.
Jen la kapo.
Jen la titolo.
Jen la korpo.
Kaj efektive, jen kiel Ĝi bildigas tiu retpaĝo.
>> Sed rimarki la URL.
Neniu povis tiri tiun specifan paĝo en via tekkomputiloj nun,
eĉ ene de via aparaton tra tiu URL
ĉar dosiero: // indikas estas reale sur mia dosiersistemo, mia malmola disko,
ne via.
Do tio ne estas ĉio, kion utila.
>> Ni nun movi al uzante reala retservilo.
Kaj ĝi rezultas la CS50 Appliance estas pli ol nur medion kie
Vi povas skribi C kodon kaj kompili kaj ruli ĝin kiel vi estis faranta.
Ĝi ankaŭ estis agordita por bastono reprezenti tipa retejo
servilo kiu estas sur la interreto, Kiu vi povus pagi
aŭ kiu estas en la tn nubo.
>> Kaj ĝin kurante norma libera fonto malfermita
programaro, ekzemple, iu nomata Apache, kiu estas eble
ankoraŭ la plej populara retejo servilo programaro en la mondo
ke miloj da retejoj uzas hodiaŭ.
Kaj ĝi ankaŭ havas eĉ programaro kiel MySQL,
kio estas datumbazo servilo ke ni eventuale atingi,
kio estas nur por diri Mi povas komenci trakti
mia aparato kiel plena disvolviĝinta servilo ke mi ne pagis por aliloke.
Ĝi apenaŭ vivas en mia propra tekkomputilo por disvolviĝo kaj oportuneco celoj.
>> Do ni iru antaŭen kaj utiligas ĉi.
Mi tuj iros antaŭen kaj malfermi fina fenestro.
Kaj mi tuj iros antaŭen kaj move-- reale, unue mi estas
tuj navigi al mia labortablo.
Se mi faras ls, ekzistas hello.html.
Kaj mi tuj iros antaŭeniras kaj ekuzi
nova dosierujo ni ne uzata antaŭ hodiaŭ.
>> hello.html-- Mi tuj movas al ../vhosts por virtualaj hosts--
pli sur tiu en la future-- kaj tiam en dosierujo nomita localhost,
kiu estas la kromnomo donita al preskaŭ ajna komputilo, ĉu ĝi estas Mac, PC,
aŭ Linuksa komputilo, kaj poste specife en dosierujo kiun ni,
la bastono jam kreita por vi, kiam vi elŝutis la aparato nomita
publikaj.
Kaj kiel lia nomo lin indikas, io Mi metis en tiu leterujo, teorie,
tuj nun publikon, almenaŭ al homoj
kiu havas rektan konektiĝi al mia komputilo.
>> Do lasu min antaŭeniri kaj fari kd por tiu sama dosierujo
tial mi povas vidi kio estas irante kaj tipon ls.
Kaj efektive, jen la nur afero en tie.
Mi asertas nun ke ĉar mi metis en ĉi file hello.html ene de dosierujo
nomitaj publikaj ene de dosierujo nomita localhost ene de dosierujo
nomita vhosts, kiu danke al CS50 bastonon
estis pre-agordita por esti la radiko de via TTT-servilo,
Mi povas nun espereble faros.
>> Mi tuj malfermos novan folion.
Kaj mi tuj iros ne al file: //.
Mi tuj uzos fakta http / localhost, kiu
denove estas la alnomo mian propran servilon.
Kaj poste mi iros al kio Dosiera nomo, nur por esti klara?
Kie estas tiu rakonto verŝajne iras?
hello.html.
>> Do alivorte, mi volas nun ĉi Estas mia propra komputilo, mian propran aparaton,
kvazaŭ ĝi estas reala servilo.
Lia kromnomo estas localhost.
Sed pensu pri localhost kiel ŝatas Facebook.com google.com ajn.
Estas nur mia loka nomo.
Kaj tiam la fino mi volas estas en la radiko de la malmola disko, tiel diri,
aŭ la radiko de la TTT-servilo, Ergo la antaŭen oblikvo kaj tiam
la dosiernomo hello.html.
>> Lasu min malzomi kaj batis eniri.
Kaj efektive, estas nun mia retpaĝo.
Do ĝi estas iomete malsamaj.
Kaj estas same underwhelming.
Tiu estas la malnova versio.
Lasu min ŝrumpi la tiparo dorso.
Tiu estas la malnova.
Ĉi tiu estas la nova.
Sed kio okazas fundamente nun estas ke HTTP uzas.
>> Ni faras ĉi iom pli klara aŭ, se vi volas, iom pli komplika.
Permesu al mi iri al la fundo dekstre mano angulo de mia aparato.
Kaj rimarki ke ĉiuj ĉi Iam pasis nombro.
Tio estas la sola adreso de via CS50 Appliance.
Estas privata adreso, kiel implicita de la 172,16,
kio ĝuste signifas nur vin fizike povas aliri ĉi ttt-servilo.
Ĉiu firewalled kaj bele protektitaj de la cetero
de la mondo pro tio parolante.
>> Kaj nun rimarkis kvankam se mi iru al tiu adreso ne mian aparaton,
sed en Mac OS-- Mi iras reiri tien.
Tiu estas mia Mac nun.
Kaj nun mi iras al malfermi tiu versio de Chrome tie.
Kaj mi tuj iru al http: //172.16.25 / Kaj mi forgesas la rest-- 133.
>> Do mi tuj vizitos mian Mac ke IP adreso /hello.html eniri.
Kaj nun mi vidas el mia Mac ke mia CS50 Appliance, kiuj estas
IP adreso estas ke nombro, oni ja kondutas
kiel servanto retejo sur la interreto.
Ĝi ne havas belan facile memoru nomo kiel Facebook.com,
sed ĝi uzante HTTP ŝajne, kvankam Chrome
Estas speco de simpligante la mondo por ni sed ne montras al ni HTTP.
Sed tio estas ja ĝuste tio.
Chrome nur ŝparas iom pulsbatoj tiujn tagojn.
Kaj tio estas kion ni nun vidas.
>> Do jen ĉio fajnan kaj bonan.
Sed gxi estas bela underwhelming paĝo.
Lasu min iri en kaj fari ion iom malsama nun.
Do lasu min reiri al gedit.
Kaj anstataŭ saluton, mondon, ni metis bildon.
Kaj mi asertas el before-- lasu min iri En miajn localhost dosierujo publiko.
Kaj lasu min iri antaŭen kaj kopii tutajn faskon de dosieroj de hodiaŭ
el mia Dropbox dosierujo en ĉi tie.
>> Nun, se mi tajpas ls rigardu tute tiujn dosierojn
kiun mi disdonis por la Certe la paĝaro anticipe de hodiaŭ,
unu el kiuj estas ankoraŭ hello.html.
Do ekzistas tiu.
Kaj memori tion stulta unu el lastaj time-- cat.jpg.
Do lasu min provi enkorpigi cat.jpg interne de mia retpaĝo.
>> Mi tuj iros antaŭen kaj fari cat.jpg savu.
Lasu min reiri al Chrome.
Kaj lasu min zomi la tiparo kaj nun reŝarĝi.
Oops, kie mi metis ĉi?
Standby-- mi ankoraŭ havas la malnova versio de mia labortabla malferma.
Do lasu min iri al mia vhost, mia localhost mia publiko, kaj hello.html.
Do lasu min antaŭeniri kaj diru cat.jpg ene de la korpo
kie mi volas ke ĝi estu montrataj kaj reŝarĝi.
Kompreneble, tio ne estas ĝusta.
>> Do mi bezonas diri al la retumilo iom pli intence kion mi volas ĝin fari.
Simple tajpi la nomon evidente ne sufiĉa.
Do memoru, ke estis alia etikedo, bildo, img mallonge.
Tio estas nur ĉar homoj ne ŝatas la tipo plenajn vortojn.
Kaj tiam ni povas fari fonto = "cat.jpg".
>> Nun mi intencas fari ion malsaman tie.
Kvankam ĉiuj nia tags tiel malproksime havi
havis tiun nocion de komenci etikedo kaj finon etikedo,
kiu ne vere fari senson por bildo, ĉu ne?
Bildo estas ĉu ekzistas aŭ ne ekzistas.
Kaj tiel la homoj venis supre kun simpla konvencio.
Kiam vi havas etikedon kiu povas ambaŭ komenci kaj fini en la sama time--
ĝi povas esti malplena, por tiel speak-- simple metis la antaŭen oblikvo ene de la etikedo
ĉe la fino mem.
Nun mi iros al mia retumilo.
Hit Reŝarĝi Damn, io malĝustas.
Vi verŝajne vidis tiun foje en la retejo,
eĉ se ĝi ne estis via kulpo.
Ĝi estas la ret-servilo kulpo.
Kio odoj ĉi ŝajnas indiki?
Ĝi estas rompita.
Tio estas kie la bildo apartenas.
Yeah?
>> Publiko: Sed tio ne havas aliron al la bildo.
>> DAVID J Malan: ne havas aliron al la bildo.
Tio, aŭ eĉ pli malbone, eble ĝi eĉ ne ekzistas.
Vidu se ni ne povas diagnozi tio.
Rememoran de lasta tempo ke se en Chrome, en la aparato,
aŭ eĉ sur via Mac aŭ PC, Vi iras al la Developer menuo
kaj iru al la Developer Tools eblo, kiun verŝajne vi jam
ne uzata multe aŭ neniam.
Kaj se mi iros al Reto kaj reŝarĝi la paĝon,
ni fakte rigardas la HTTP petoj kiuj estas faritaj.
>> Ĝi aspektas kiel hello.html estas ja bone, ĉi tie la 200.
Sed cat.jpg estas 403.
Do ĝi ne estas 404.
Dosiero probable ekzistas.
403 signifas malpermesita.
Do tio estas iom konfuza.
Mi tuj iros reen al mia fina fenestro.
Lasu min zomi tien.
Kaj lasu min fari ls.
Ekzistas tiuj samaj arkivoj.
>> Nun lasu min fari ls-l, kiuj vi probable
uzata antaŭ rigardi dosieron grandecoj eble aŭ timestamps.
Kaj ni vidos tutan faskon da abrumadora informo.
Sed rimarki kelkajn detalojn.
Jen hello.html en ĉi remi tie kaj jen cat.jpg.
Kaj estas simple la aparato estas uzanto amika per reliefigante JPEG La
purpura ŝatas ĉi.
Sed kio alia estas malsama flanko La grandeco de dosiero kaj la dosiernomo?
>> Publiko: [inaudible].
DAVID J Malan: Jes, ekzistas du R super tie.
Rimarku kion hello.html jam okazas.
Do rezultas ke la nomo de ĉi dosierujo publiko estas grava.
Ion en tiu ĉi dosierujo estas intencita esti publikaj.
Sed ĝi ne estas sufiĉa nur faligi dosierojn tie.
Vi ankaŭ bezonos ŝanĝi la modo de la dosieroj,
ŝanĝi la permesojn de la dosieron proactivamente ne
la defaŭlta opcio, kio estas ke mi nur povas legi
kaj ni skribas, mi estas la mastro.
Mi volas ke la tuta mondo ĉiuj al povos legi mian dosieron, por tiel diri.
Legi simple signifas vidi.
>> Kaj efektive, kiel vi vidos en problemo starigis sep, tion tiuj R meznombra.
Tiuj du R meznombra lasu ĉiuj alia en la mondo ankaŭ legis ĝin,
speciale nun ke ĝi estas en tiu ĉi dosierujo.
Do la plej simpla maniero por ripari ĉi estas iru al mia prompto kaj fari chmod por ŝanĝo
Modo kaj tiam fari + r, en aro, ĉiuj, ĉiuj, plus r por legado,
kaj tiam cat.jpg eniri.
Nenio ŝajnas okazi, kiu kutime signifas bonon.
Do ls-l again-- nun ni rigardu cat.jpg.
Kaj tiu permeso ŝajnas esti ŝanĝita.
Kiel flanken, se vi faras eraron kaj vi, ekzemple,
ĵus faris your-- Ne know-- eseo publike alirebla per akcidento,
Vi povas fari la malon: chmod a-r.
Kvankam sincere, ĝi ne devus esti en la publika dosierujo
ĉiukaze se tio estas la maltrankvilo.
>> Do nun ni revenu al mia retumilo freŝigi.
Kaj mi tuj klaku la eta Cazafantasmas
simbolo por liberigi tiun parton de la ekrano tiel ni povas vidi novajn petojn.
Kaj efektive, jen Grump Kato de antaŭe.
Sed pli grave, teknike, estas
la numeron 200, kiu signifas ke ni havas ĝin OK.
Bone, do jen ĉio fajnan kaj bonan.
Sed ni ne farante La bona de retejoj,
nek ni provos tro malfacile fari la fanciest de retejoj hodiaŭ.
Sed ni almenaŭ ion fari súper familiara antaŭ klakas
ekstere kelkaj aliaj etikedoj.
Do supozu mi ne volas nur kato tie.
Supozi mi efektive volas ĉi kato ligi al io.
>> Mi povus, ekzemple fari ion kiel tiu.
a por ankron href por hiper referenco equals--
kaj ni nur faru ion kiel www.google.com Fermi
citi Fermi krampo.
Kaj nun serĉu por katoj.
Fermi ankron etikedo.
Do tiu havas nur unu speco de fundamente nova detalo.
La etikedo kompreneble diferencas.
Ĝi estas la nomo por ankron Eksteraj aŭ hiper referenco.
>> Sed pli grave, ekzistas tiu sintaksa trajto tie.
Jen kion ni komencu nomi Ne etikedo, sed atributo.
Kaj atributo estas iu kiu modifas la konduton de etikedo.
Kaj tiu atributo href, pere modifi la konduton de ĉi ankron
tial, kiam ĝi klakis, iras al tiu URL tie.
Kaj kompreneble, ke URL estas Google.
>> Dume, kian Teksto ĉi tie tuj estos?
Nu, tiu tuj estos kion la homa reale
iru kiel la substrekita ligilo, tiel simpla kiel tio.
Do ni provu tion.
Lasu min savos.
Mi ankoraŭ en hello.html.
Sed en la versioj en linio, vi vidos la fakta dosiero nomoj ni antaŭ-preparita.
Lasu min kaj reŝarĝi.
Kaj nun estas tre underwhelming paĝo ankoraŭ.
Sed se mi ŝvebi super there-- kaj estas iom malgranda,
but-- vi povas vidi en la fundo maldekstra angulo de via ekrano,
ĝi estas ja tuj google.com.
Kaj se mi klakas tion, ĝi volas whisk mi vojon al la efektiva Google.
>> Sed rimarki tie ŝancon por ekspluato, ĝuste kiel flanken.
Kaj ni revenos al alia temoj de sekureco antaŭ longe.
Ĉar ekzistas tiu dicotomía inter kien vi iros, kaj kion vi diras,
Vi povus fari ion kiel this-- http://www.google.com.
OK, kaj nun se mi reŝarĝi post savi tiu paĝo,
ĝi similas Min tuj iri al Google.
Sed estas nenia kialo min iri al Google, dekstra?
Mi povus efektive iros al iu kiel badguy.com, reŝarĝi la paĝon sur tie.
Kaj rimarki, ĝi ankoraŭ aspektas kiel Google.
Kaj nur se mi estas akra sufiĉas por ŝvebi super tie
Mi vidas ĝi estas eĉ tuj iri al malsama loko.
>> Do se vi iam alveninta email, speciale
unu el Paypal aux kvazaŭe de Paypal
demandante vin ensaluti al via konto, tiu
Tial vi devus neniam iam alklaki ligilojn en retpoŝtoj,
sincere, ligojn en retmesaĝoj.
Se vi scias, ke vi havas realan mono en Paypal aŭ Banko
de Ameriko aŭ Fidelity aŭ ajna retejo, permane tajpi ĝin.
Ĉar aspektas kiel facile estas trompi iun en prezentante, ke
aspektas kiel ligilo.
Sed fakte povis iri absolute ie.
>> Kaj estas multe pli granda minacoj ol tio.
Fakte, ĉi tiu estas iom de tangenta nun, sed unu
el la pli bonaj mi iam vidis kiu tiam estis fermita,
Estas iu gvidis homoj to-- tiel ĉi povus diri,
Klaku ĉi tie por ensaluti en via konto, bankokonto.
Kaj tio estis por Banko de la Okcidenta.
>> Do iu aĉetis ĉi.
Kaj estas iom pli facile vidi ĝin en simio interspacigitaj tiparo zomita
en la 30-piedo projekciilo.
Sed kiam gxi estas malgranda tiparo en retpoŝto ke vi ricevas,
tio aspektas bankofthewest.com, Ne bankofthevvest.com,
kiu iu estis pagita $ 10 por aĉeti.
Kaj poste tio kondukis ilin al la ekvivalento de iuj malbonaj retejo.
>> Kaj vi vidos too-- reale ni povas fari this-- se mi iru al la efektiva retejo,
bankofthewest.com, denove, recall de lasta horo
ke se tiu estas ilia retpaĝo kaj vi estas scivolema pri kiel ĝi funkcias,
vi certe povas iri Chrome la desarrollador iloj.
Kaj vi povas vidi ĉiujn HTML bele formatitan tie.
>> Sed pli al la punkto, vi cam-- ni fermi
this-- vi povas iri por rigardi Desarrollador Vidi Fonto.
Kial ne simple kopiu ĉiuj kiuj Kaj tiam mi
povas eniri en mia eta gedit fenestro tie kaj fari mian propran retpaĝon.
Konservu tio en hello.html.
Kaj verŝajne tiu tuj rompos, ĉar ne tiu facila kutime.
Sed nun se mi freŝigi mian propran paĝon sur mian propran CS50 Appliance kaj reŝuti,
OK, aliaj stuff rompis.
Sed mi sufiĉe proksime al devi mian propran banka retejo, ĉu ne?
Ĉio ĉi HTML--
>> [Ridado]
>> DAVID J Malan: --I ne actually-- kaj vi
scias ke ekzistas iu tie ekstere, kiu estus reale klaku tiujn ligojn ankaŭ.
Do klare, iuj aĵoj rompis.
Sed tio okazas konduki nin en diskuto,
nenecese nun, kiel al kio CSS CSS, estas,
kaj kiel vi reale elŝuti la alia HTML dosierojn
kaj JPEG fajlilo GIF dosieroj la retpaĝaro povus uzi.
Sed ĉio tio estas accomplishable.
Sed vere abscesoj malsupren al tiuj tre simplaj heurísticas.
>> Do nun ni nur skim tra kelkaj aliaj ekzemploj de HTML
nur doni vin sento kion ajn vi povas fari.
Ekzemple, jen list.html.
Supozi Mi volis fari retpaĝo kun listo de domoj en la quad.
Mi povus uzi la ul etikedo por neordigitaj lerta kaj tiam la listeron infano
kaj tiam persisti over-- aŭ lerta, rather-- la domoj en demando.
>> Kaj se mi malfermos ĉi supre, ni faros.
Ni ne transiru hello.html, sed list.html.
Damn ĝin.
Kjel mi ripari tion?
Estas la sama afero kiel antaŭe, ĉu ne?
Do lasu min fari chmod-- oops-- chmod a + r de list.html.
Kaj nun se mi reiros al mia retumilo kaj alklaku Reŝarĝi tie ĝi estas.
Do se vi iam volis fari oni bula listo, vi povas fari tion.
Se vi volas esti súper fantazio kaj fari ordigita listo, ne neordigitan liston,
ŝanĝi tiujn al maljunan, reŝarĝi la paĝon, kaj nun la navegador kalkuli ĝin por vi.
>> Kion alian ni povas fari?
Nu, kelkaj others-- se vi havas longajn alineojn de text--
Ekzemple, iuj Latina teksto kiel this--
kaj vi volas ke en apartaj paragrafoj, malfermita p, proksima p por la alineo etikedo.
Kaj fari ĝin denove kaj denove.
Kaj se mi nun malfermas tiun dosieron: paragraphs.html, nu, tiu
fariĝas ĝena.
Do nun ni nur reiri al mia prompt, chmod a + r r stelo .html--
belan sovaĝa karto tiel diri.
Ĝi devus ripari ĉiujn tiujn problemojn por mi.
Ni reŝarĝi.
Ekzistas tri alineoj.
>> Kaj nun ni iru antaŭen kaj malfermu unu alia.
Kion pri tablo?
Vi rimarkos tablo rigardoj iom pli kompleksa.
Sed estas la sama idea-- malfermita etikedo malfermitaj etikedo,
malfermita, malferma, malfermita, proksime etikedo malfermitaj etikedo.
Kaj tiuj okazas por defendi tablo, kies limo estas ŝajne
tuj estos dikeco 1-- ajn ke means-- tablo vico, tablo
datumo, kiu signifas ĉelo.
Kaj se mi iros al mia retumilo tie kaj iri al table.html,
vi povas vidi ion kiel tiu, malbelega.
Sed ni atingos la punkton kie ni povas reale
fari aferojn pli belaj ol tio.
>> Do lasu min kondiĉas nun.
Ekzistas aroj de pli etikedoj.
Kaj HTML estas mirinda repreni ĉar, sincere, ĉiuj vi devas fari
estas rigardi ekzistantaj retpaĝoj kun kiu vi konas.
Kaj vi estas kiel, ho, tiel estas kiel Ili faris tion estetike.
>> Aŭ vi povas serĉi ajnan linio rimedo pri kiel HTML laboras,
kaj vi vidos, ke estas tuta vortprovizo de aliaj etikedoj.
Sed kun la simpla mensa modelo sole ke preskaŭ neniu etikedo malferminte
ĝi devas esti fermita, ĝi vere ne sufiĉas por instrui sin
HTML post kompreni tiuj bazaj ideoj de etikedoj
kaj atributojn kaj la bonstato formedness ke ni raportis,
fermi ion ke ni povu malfermi por ke ni ne konfuzu navegador.
Do ni nun prenu tion pli interesan nivelo
irante al la efektiva.
Kaj ni iru al mia Mac tie, al google.com.
Kaj nun notice-- ni faros.
Mi gong iri Agordojn, Serĉo Settings.
Mi volas malŝalti ĉi ĝena momenteto rezultoj afero kie tuj
komencas respondi vian tajpadon.
Ni faru ĉi malnova lernejo por ni fakte vidi kio okazas.
>> Do mi tuj savos Mian Google agordojn tie.
Kaj nun notice-- Mi tuj serĉi iun kiel katoj.
Kaj ĝi estas ankoraŭ faranta auto kompleta tie, sed bazita sur aferoj
homoj tajpis en la pasinteco.
Sed rimarki kio okazos.
>> En la URL la momento estas tio, ĝuste google.com.
Kaj teknike, estas oblikvo.
Google estas nur ŝparas gravulo kaj ne montras al ni tion.
Ili montras al ni https, simple esti súper trankviliga ke ni estas
je sekura aŭ ĉifrita paĝo.
>> Do lasu min iri antaŭen kaj elsercxu por katoj.
Nun ĉi tio alvenis vere abrumadora rapide.
Rigardu la longo de tiu URL.
Sed rezultu ke la plimulto de ĉi stuff en la URL-o estas vere bela senutila.
Mi tuj komencos viŝi Tion mi ne komprenas.
Mi vidas katojn.
Mi komprenas katojn.
Mi ne scias, kial katoj estas tie.
Mi vere ne scias kia sensencaĵo estas.
Do mi simple tuj subteni reliefigante kaj viŝante stuff
ke mi ne komprenas, distili la URL en ĝuste ĉi.
>> Nun mi get eniri denove.
Ĝi aspektas kiel Google ankoraŭ funkcias.
Do por iu kialo, ili estas aldonante multajn aĵojn al lia retadreso estas defaŭlte.
Sed ĝi ne estas strikte necesa.
Do kio estas agrabla pri tio?
Nu, lasu min iri antaŭen kaj malfermi Chrome La Inspektisto.
Estas iom muso ŝparvojo por ĝi.
>> Iru al la Reto langeto.
Kaj nun mi volas reŝarĝi ĉi paĝo ankoraŭfoje.
Kaj mi tenas Maj.
Kiel flanken, retumiloj inklinas caché aŭ savi
informojn nur por efikeco gajno.
Sed ĝenerale, tenante Shift kaj reŝargi devigos ĉio
por komenci de la komenco.
Kaj tio estas kion mi volas fari ĉi tie.
>> Kaj rimarki ĉiuj tiuj vicoj kiuj ĵus aperis.
Ĝi rezultas ke en ajna donita retejo paĝo, eble estas nur unu dosieron
involved-- hello.html-- aŭ tien povus esti 52, kiel en ĉi tiu kazo.
Kiam mi vizitas google.com, Ŝajne, mia retumilo
iniciatas 52 apartajn HTTP petojn.
Kial estas tio?
>> Nu, rigardu kio estas interne de tiu retpaĝo ĝis supro.
Ekzistas ne nur teksto, sed estas realaj bildoj
de katoj super dekstre.
Ekzistas bunta logo tien maldekstre.
Jen ĉiuj tiuj ikonoj por mikrofono ks.
Ekzistas multaj pecoj, konstruante blokoj, nulo pecoj, se vi volas,
al ĉi tiu retpaĝo.
Kaj kio estas la retumilo faras sur akirante la unuan dosieron, kiu
Estas ĉi vico tien, ĝi estas esence ripetanta super la HTML supro
sube, maldekstre dekstren, serĉi aĵoj kiel bildo etikedoj aŭ aliaj etikedoj
kiuj mencii aliajn dosierojn kaj kiam vidas ilin, iras kaj akiras ilin
tra HTTP, farebla tutaj koverto metaforo,
kaj montras ilin en la taŭga loko en la retpaĝo.
>> Sed rimarki tie, se mi enfokusigi la unua detronigo, serĉo katoj,
rimarki ke ja ĝi estas uzanta HTTP 1.1.
Kaj bedaŭrinde, Google Chrome nun en versio 39
Estas speco de dumbing tion malsupren kaj ne montras al ni la realan titolaj.
Sed kio vere sendis estas peto por ne slash, sed / serĉo? q = katoj.
>> Nun, kial estas tiel grava?
Nu, mi tuj konkludi el tio, ke se vi Google
Elportas pridemandojn de tiu formo, kial Ne implemento mia propra serĉo
motoro por CS50, sed ĝuste la antaŭa Fine, nur la grafika uzulinterfaco.
Kaj ni subcontratar la dorso fino, la reala Serĉrezultoj por Google.
>> Do kiel mi povas tion fari?
Nu, mi iros en gedit super tie.
Kaj lasu min iri antaŭen kaj malfermi ĝis, ni diru, nova dosiero.
Kaj mi tuj savos ĉi temporalmente kiel serĉo-0.html.
Kaj tiam fine, ni fastas antaŭen al la mi pre-preparita.
>> Kaj mi tuj rapide vipo supren doc tipo
html malferma krampo html Fermi krampo html.
Tiam Mi faros kapo Fermi kapo malfermita titolo CS50
Serĉi anstataŭ Google serĉo.
Cxi tie mi tuj devos la korpo, ĉi tie proksime korpo.
Kaj nun mi bezonas CS50 Search.
Kaj efektive, ni konstruu ĉi incrementally.
Mi tuj iros antaŭen kaj fermu kaj efektive metis ĝin en mia publika dosierujo.
Do donu al mi nur unu momenton.
serĉo-0.html-- Mi tuj portempe nomas search.html.
Mi iras al chmod ĝin + r search.html.
Kaj nun mi iras por malfermi.
Bone, tiel ke estis rapida.
Sed la celo simple estis akiri al ni la punkto
havi ĉi tiun tekston dosiero nomata search.html.
Do ne multe rigardi ankoraŭ.
Ja, se mi iros al mia retumilo, kaj iru search.html, jen ĉio estas.
Sed vi scias kion?
Mi povas esti iom amatoro.
Mi legis en libro, ke ne estas kapan etikedo nomita h1.
Kaj mi tuj iros antaŭen kaj uzas tiun malfermita h1 kaj proksima h1.
Reŝarĝi la paĝon.
Kaj nun ĝi estas pli granda kaj revenante pli aŭdacaj, Ne ĉiuj kiuj interesaj,
sed almenaŭ strukture pli interesa.
Sed nun mi volas enkonduki alian etikedon.
Ĝi rezultas tie estas formo etikedo.
Kaj mi fermas la etikedo.
Kaj ĝi rezultas ke estas enigaĵoj etikedo ke
havas atributon nomita tipo, kiu Estas la datumtipon de la kampo,
se vi volas.
Kaj tuj estos de tipo teksto.
Kaj lia valoro tuj esti CS50 Search.
Fermi etikedo.
Kaj tie tuj estos neniu nocio malfermante kaj fermante kun apartaj etikedojn.
>> Lasu min reiri tien kaj vidi kio okazas, reŝarĝi.
Ricevi interesa.
Ĝi aspektas kiel ĝi estas teksta kampo.
Kaj fakte mi ne volas meti valoron tie ankoraŭ.
Lasu min reiri tien kaj reale preni senigi de tiu valoro teni ĝin simpla.
Anstataŭ valoron, kion mi volis doni tion estis nomo.
Kaj mi ne scias kion estas, tial mi revenos al tio.
>> Sed sub tiu, mi volas fari input type = submit.
Kaj ĉi tiu valoro estos CS50 Search.
Kaj ni vidos kial mi movis la valoron al tio.
Kiam mi reŝarĝi, mi ŝajne nun la komencoj de mia propra serĉo
motoro, súper malbelega, kvankam sincere, estas
Ne malproksima detronigo de kio Defaŭlte Google paĝo aspektas.
>> Se mi iros tien, mi povas tajpi katoj kaj espereble klaku Search.
Sed mi ne tute farita ankoraŭ, ĉar mi ne plenumiĝis,
evidente, datumbazo.
Mi ne rampis la retejo por serĉrezultoj.
Do mi bezonas subcontratar ke Google.
Do kiel mi faru tion?
>> Nu, unue mi bezonas adicii kaj agadon
atribui al mia formo etikedo ke Estas http://www.google.com/search.
Kaj mi scias, ke nur de havanta konkludita per rigardado apude
iliaj URL aj jaroj.
Kaj nun prenu divenon.
Kio devas ĉi teksto kampo verŝajne nomi, bazita sur kie ni venis
antaux?
>> Publiko:? Q.
>> DAVID J Malan:? Q.
Kaj ni ne vere bezonas demando markas rezultas, sed q estas ja tio,
q por konsulto probable por Defaŭlte, nur ĉar tio estas
kio Larry kaj Sergey venadis kun jarojn.
Do lasu min reŝarĝi la paĝon.
Ĝi ne aspektas tiom malsimila.
Sed nun rigardas kio okazas.
>> Se mi tajpas en katoj kaj klako CS50 Serĉo kaj forliberigu,
Rimarku ke mi get whisked for de realaj Google.
Nun Google estante iom ĝena ke ili estas
almuntanta plia parametro, se vi volas, al la retadreso.
Jen ĉio okazante aŭtomate en Google flanko.
>> La grava parto estas ke mi ŝajnas esti generinta tiun peton tie.
Kaj efektive, jen kio okazas.
Kiam vi havas HTML kiu aspektas kiel tio ĉi
Estas speco de ttt programistoj skribmaniero por diri, bonvolu krei formon
ke kiam ĝi estos prezentita, ĝi tuj iros al tiu retadreso.
Kaj kiam la URL havigis valorojn por aĵoj kiel q,
ne iras nur al tiu retadreso.
Efektive, iru pridubi markon kaj tiam q = katoj.
Aldoni la parametron, La HTTP parametron tiel.
>> Kaj simple esti súper preciza, kio esti konkludita here--
sed mi estos pli explicit-- estas ke la metodo mi volas uzi
estas akiri, anstataŭ ion kiel post, kion ni fine vidas.
Do resume, simple per kompreno HTML kaj uzante iuj sufiĉe simplaj etikedoj,
Ni nun povas komenci krei nian propran interfacon uzanto
Interfaco kun serĉo motoro malantaŭ ĝi.
>> Sed tio kompreneble estas sufiĉe malbelaj.
Do lasu min reale malfermi iomete pli bonan version.
Tiu estas mi preparita en antaŭi kiuj havas iujn komentojn.
Sed vi vidos, ke mi sufiĉe tre amuzis lin.
Do ĉi tiu estas jam havebla rete.
Kaj mi hazarde preventa formo iru https ĝuste teni ĝin simpla.
>> Kaj nun ni malfermi sekva iteración de tiu.
Estas versio 1 anstataŭ 0.
Kio elsaltas cxe vi kiel iomete malsama en tiu ekzemplo?
>> Publiko: [inaudible].
>> Jes, tie estas tio tekston centrigi.
Tio estas iom stranga tien.
Sed cxi tiu estas vere nova.
Kaj eble diveni kio okazos.
Se mi iras al mia retumilo nun kaj vizitu serĉo-1.html,
ĝi estas preskaŭ la sama afero.
Sed ĝi estas iom pli al esti iom pli bela.
Estas ankoraŭ malbela, sed belaj en tiu almenaŭ ĉio nun centrita.
>> Do rezultas ke kio mi uzas Estas alia lingvo tute nomitaj
CSS CSS.
Kaj CSS, sincere, estas speco de, en mia persona opinio,
oni atrociously desegnis lingvon.
Ĝi estas tre ĝena por memori ĉiuj diversaj detaloj.
Sed estas kio stylizes la tuta mondo retejo hodiaŭ.
Mi ofendis iun.
Bone.
Do ni revenu ĉi tien kaj vidu kiel ni fakte uzas tiun.
Kaj ĝi rezultas, almenaŭ estas fakte sufiĉe simpla lingvo.
Estas nur ŝlosila valoro paroj, proprietoj kaj valoroj, bienoj kaj valoroj.
Ja, tie estas tiaj proprieto kaj valoro.
>> Simple uzante la stilon atribui sur mia korpo etikedo
kaj donante al ĝi valoron de vorto dupunkto kaj alian vorton,
aŭ econ kaj valoro, Mi povas tuŝi la estetiko
de la retpaĝo, ne nepre la strukturo tamen,
sed la estetiko de ĝi.
Kaj ĝuste per Googling ĉirkaŭe, mi rimarkas ke CSS CSS,
Elportas propraĵo nomata teksto-Ĝisrandigi, kies valoro povas
resti, dekstra, aŭ centro, ekzemple.
>> Do nun, kiam mi reŝarĝi La paĝo, kion mi akiras
estis centrita paĝo sed ankoraŭ bela malbela.
Ni iru antaŭen kaj malfermi ĝis la versio 2 de Search.
Kaj nun rimarkos mi faris iom pli.
Rimarku ke ĝis tie ene de la kapo etikedo, ne povas esti pli ol titolo.
Fakte, estas stilo etikedo.
Kaj ĉi tiu estas kie nur ricevas iom senorda vidantaj CSS kelkfoje.
>> Rimarki ke mi ŝajnas havi ion ke strukture aspektas tre malsama.
Sed ĉi tie estas la nomo de la etikedon mi volas stiligita.
Jen niaj malnovaj amikoj krispa streĉaj kaj fermita frizita krampoj.
Kaj tiam ĉi tie estas ke proprieto kaj ĝia valoro.
>> Se mi ŝarĝas ĉi dosiero, search2.html, La fina rezulto estas identaj.
Sed estas pasxo al pli bona dezajno.
Per faktoranta ekster tiu CSS, mi Ne commingled per mia HTML.
Kaj efektive, kiel ni vidos, mi povis reutilizar tiuj propraĵoj kaj valoroj.
Se mi volis fari kuketojn partoj de mia retpaĝo centrita,
Mi ne devas tajpi style = text-Ĝisrandigi centro ĉie en la loko.
Mi povas meti en unu loko eble ŝatas ĉe la supro.
>> Sed eĉ tio ne estas la pli bona dezajno.
Fakte, unu el la aĵoj vi lernos kiel vi pasigas pli kaj pli da tempo kun
ttt programado estas ke ju pli vi povas modularize aferojn kaj faktoro aferoj ekstere
kiel .h dosierojn ni faktoro stuff ekstere, plaĉas helpers.c ni faktoro aferoj ekstere
kelkaj psets malantaŭen.
Simile, multobligita ni deziras atingi tiun.
>> Do rimarki en versio tri de search.html Mi havas
purigis la kapo de la paĝo kaj simple meti
en tiu, ligilon etikedo, kiun Male al la nomo,
Ne donu vin al hiperligilo.
Ĝi ligas al alia dosiero kun vojo de oni href kies valoro tiukaze
Estas serĉo-3.css
Do mi rimarkas ke ni iras rapide.
Sed ĉiuj mi faras bonfaras movi aferojn ĉirkaŭe.
Lasu min malfermi serĉo-3.css.
Tie estas nenio vere al ĝi.
Mi simple kopiis nuda ĝin en novan dosiero, multe kiel ni faktorita stuff el
en aliajn dosierojn antaŭe.
Kaj la result-- tute underwhelming--
tuj estos ĝuste la sama.
Sed ni movas toward-- ne, tio ne.
Ho, mi scias kial.
>> Do ŝajnas esti eraro.
Kaj ĝi estas en iu senco.
Sed lasu min malfermi mian Reto langeto.
Lasu min reŝarĝi la paĝon.
Ah, kial la CSS ne aplikas?
Nu, la CSS-dosiero, simile, havas esti mondon legebla, por tiel diri.
Kaj ĝi ankaŭ estas aktuale malpermesita.
Do lasu min fari chmod a + r stela ŝprucas CSS-- whoops--
ni estas skalara CSS estas nur la dosiersufikso por CSS dosierojn.
Nun lasu min reiri al mia retumilo freŝigi.
OK, iom pli bona.
>> Nun lasu min fari unu lasta afero.
Serĉante-4.html.
Mi havas version, kiun mi ĵus pensis Estis vojo malvarmaj, kvankam vojon pli
komplika.
Ni rigardu la rezulton unue.
Fermu doni al ni pli da ĉambro.
Ŝanĝi ĉi sercxi-4, Enter.
>> Kaj nun faskon da aĵoj disfalas.
Mi tuj iros reen en mia dosierujo tie.
Nun mi nur volas fari oni chmod de a + r sur file--
ĉar mi scias exists-- vokis logo.gif, kiu estas bildo.
Kaj nun reŝarĝi.
Kaj wow-- tiel nun mi estas bela apude, sincere,
ŝati la 1999 versio de Google, kaj sincere, la 2014 versio de Google,
dekstra?
>> Do ĝi estas nun tuj ilian retejon, fine, se mi serĉos katojn.
Kaj ja estas.
Sed kion mi faru alimaniere en tiu versio 4?
Do ni ne logxas tro multe pri tio ĉi tie.
Vi vidos tion en problemo starigis sep eventuale.
Sed rimarki Mi faris kelkajn aferojn.
>> Mi enkondukis div etikedo, kiu estas divido,
simila en spirito al paragrafo etikedo.
Sed malkonsento estas ĝuste kiel, jen rektangula nevidebla regiono
de la ekrano.
Ni donu gxin unika ensalutilo, oni footer, simple
tiel ke ni povos paroli pri en nia HTML aliloke.
Jen alia div de la paĝo kies ID tuj estos kontenta.
Ĝi estas la enhavo de la paĝo.
Kaj ĝis tie la kaplinio de la paĝo.
>> Alivorte, mi havas esence en HTML estas mense
vidas ĉi tiun retpaĝon kiel tri komponantoj, kaploko
supren tie kun tiu nevidebla rektangulo, la enhavo en la mezo, kaj tiam
la footer malsupre, ecx kvankam ni ne vidas tion.
Ĉar mi volis en mia kapo de paĝo ĉi tie, aŭ en .css dosieron:
Mi povas uzi tiun sintakson.
>> Header estas ne tag.
Ĝi estas ID tiel rezultas ke farante #header,
Mi povas nun apliki unu aŭ pli proprietojn al la ĉapon.
Mi povas fari la saman enhavon, la sama enhavo tie.
>> Do ekzemple, en la footer, avizo ĉiuj tiuj propraĵoj Mi aldono.
Kaj mi scias, ke ekzistas nur legado supren sur la dokumentaron por CSS.
Tipara grandeco tuj estos smaller-- tial iuj relativa tiparograndeco.
La pezo tuj estos grasaj.
Margin-- kiom rastrumeroj ĉirkaŭ it-- estas 20 rastrumeroj.
Kaj tuj estos centrita.
>> Sed nun, la paĝo aspektas kiel ĉi.
Se mi ne placxis mia kopio pravas,
Mi povus fari ion kiel ruĝa koloro.
Kaj tiam mi povas savi tiun, reŝarĝi, kaj nun mi stiligita la footer.
Do tio estas nur aludas la potenco kion vi povas fari en la retpaĝo
ŝanĝi aferojn ĉirkaŭe.
>> Kaj eĉ pli malvarmaj ol tio, se vi deziras al poke ĉirkaŭe kun realaj retejoj,
vi ne povas konstante ŝanĝi ilin.
Sed se mi malfermas Chrome La Inspektisto denove
kaj mi iros ne al la maldekstra flanko tie, kiuj montras Facebook HTML,
sed montras dekstre flanko ĉiuj ties CSS
Vi povas ĉu kaj ŝanĝi aferojn sur la muŝo.
Do lasu min antaŭeniri kaj fari tion.
>> Lasu min kaj kontrolo klaku ĉi hazarda vorton ĉi tie,
subskribi, kaj klaku Inspekti Elemento.
Chrome tre oportune saltas al la h1 etikedo ke Facebook estas uzanta.
Kaj rimarki tie Facebook havas specon de pigre
malfacile kodita tiparon kiel proprieto tie.
>> Do la malvarmeta afero tamen estas ke se mi vere iras tien
kaj diru: Ho, Facebook, mi ne ŝatas ke 64 rastrumeroj, ni nun povas ŝanĝi Facebook.
Kompreneble, ni nur ŝanĝante ĝin por mi persone nuntempe.
Sed tio estas nur alia ilo en nia ilo kit
ke tuj permesos nin tweak kaj elkompreni kaj ankaŭ diagnozi
temoj en niaj propraj retpaĝoj.
Kaj ni povus simile transiru tie, kio estas la samo.
Se vi vere volas ricevi imago, mi signifas, nun vi povas vere mutate la paĝo
kaj fari frenezaj aĵoj.
>> Do kial estas tiu tuta utila?
Nu, finfine, ni estas tuj volas esti
povi krei retpaĝojn ke estas pelita per propra reen randoj,
ne per nur Google outsourcing la malantaŭa fino tie.
Ni vere volas la valoro, ekzemple,
de nia serĉilo agadon atribui iri ne al iu alia,
sed al iu kiel search.php, kie search.php estas sur nia propra servilo,
ne sur aliulaj.
>> Kaj tiel atingi tien, ni reale bezonas enkonduki novan lingvon.
Do ni jam rigardis unu nova lingvo ĉi tie, aŭ du vere, HTML
kaj CSS.
Sed vere estas nur strukturaj kaj estetikaj lingvoj.
Ili ne programado lingvojn per.
Kaj tio estas proksimume tiel formala tempo ni devos elspezi ilin.
Ĉar ni komencu nun transiri al PHP.
>> Do PHP estas aktuala programlingvo.
Ĝi estas skripta lingvo en la senco, ke ĝi estas
signifis esti malpeza pezo ol iu kiel C.
Kaj ĝi estas interpretita lingvo, kio signifas, ke ĝi ne estas kompilitaj.
Do en malmultaj vortoj, kion tio signifas Kiam ni uzas lingvon kiel c
kaj ni devis kompili ĝin?
Kion ĝi signifas por kompili C fontkodon?
Publiko: [inaudible].
DAVID J Malan: Diru ĝin denove?
Publiko: [inaudible].
DAVID J Malan: Perfekta.
Ĝi rezultas ke en duuma.
Ĝi igas al nuloj kaj aĵoj el reala angla-kiel fontkodo.
Kaj tiam ni povas reale kuri tiuj nuloj kaj aĵoj
pasante ilin tra la CPU de duobla musklako ikono
aŭ kuri komando.
>> PHP kaj Python kaj Ruby kaj Perl kaj JavaScript
kaj aroj da aliaj lingvoj interpretas
lingvoj, kiuj estas Ne kompili ilin.
Prefere vi nutros ilin kiel enigo al programo nomita interpretisto.
Kaj ke interpretisto, kiun iu alia skribis,
legas vian fontkodon supre sube, maldekstre dekstren kaj ĝuste interpretas
tiuj linioj kaj faras, kion vi diras.
>> Do se vi spertas linio kiu diras print,
ne nepre konverti print al la respondaj nuloj kaj.
Ĝi nur havas tiu interpretisto ŝatas granda se kondiĉo kiu diras,
se programisto instrukcioj estas print, tiam jeno.
Do ĝi interpretas ĝin ĝuste per speco de rezonado
per kio vi rakontis ĝin al fari.
>> Kaj PHP estas unu el tiuj lingvoj.
Kaj PHP jaroj desegnis ĝuste por ttt programado.
Kaj ĝi estis komence tre fuŝa senorda lingvo.
Kaj efektive, tie estas grandega kvanton de malbona PHP kodo tie.
Sed la lingvo mem maturigis dum la jaroj,
tiel ke nun estas vere mirinda venonta paŝo
pedagogie de C, ĉar ĝi estas tiel darned familiara al ĉio
vi ĵus vidis en la lastaj semajnoj.
>> La komenca diferenco vidos estas ne estas la ĉefa funkcio anymore.
Kiam vi komencas skribi kodon, estas nur tuj get ekzekutita negrave kio,
kiel ni vidos en momento.
Dume, jen kia variablo aspektas kiel en PHP.
Ĝi estas iom malsama, sed nur apenaŭ.
>> En PHP, ne estas fortaj tajpadon.
Ekzistas semajno tajpadon, kio ĝuste signifas tie
Estas datumtipoj kiel kordoj kaj nombroj kaj aliaj aĵoj.
Sed vi ne ĝenu preciziganta kio estas anymore.
PHP figuroj ĝin por vi.
La dolaro signo estas nur decido ke PHP homo faris jaroj
antaŭ tia ke ajna variablo en PHP nur komenciĝas per unu dolaro signo.
Ĝi estas fakte speco de utila en tiu ĝi elsaltas vin iom pli.
>> Sed post tio, tiu estas kondiĉo en PHP.
Kio estas malsama kontre C?
Trick question-- nenion, kio estas fakte vere bela.
Buleaj esprimoj en PHP-- la sama.
Buleaj esprimoj kun kaj kontraŭ aŭ, ŝaltiloj, loops, bukloj, loops-- OK,
ĉi tiu estas malsama.
>> Do rezultas tie estas kelkaj aliaj trajtoj en PHP.
Unu el ili estas vere tio, kiu estas mirinde oportuna.
Se $ nombroj estas tabelo kiu vin fagoj deklaris antaŭe en programo,
vi havas ĉi fantazio por ĉiu konstruo ke anstataŭ faranta ĉiuj kiuj
ĝena mi egalas 0, mi estas malpli ol tio, [? Mi ++?],
por ĉiu nombroj kiel nombro, kie ĉiu de tiuj dolaro signo valoroj estas ĝuste
variablo, kaj la lasta vi povas pensi pri kiel I.
Vi povus nomi ŝin ajn vi volas.
Mi nomis ĝin nombro.
Tiu tuj persisti super la tabelo nomis nombroj.
Kaj en ĉiu ripeto, estas tuj aŭtomate ĝisdatigi
por vi la dolaro signo nombro variablo tia ke vi konstante
havas aliron al la variablo vi volas sen devi fari ajnan kvadrata krampo
skribmaniero aŭ indeksado en tabelo.
>> Preter tio, ni ankoraŭ havas aĵojn kiel arrays, kiuj aspektas samaj,
se gxi ne estas tre komuna, kiel ni vidu, ambaŭ en PHP kaj Javascript
al antaŭ pravalorizi tabelo rektaj krampoj.
C uzas frizita krampoj.
Do ĝi estas iomete malsama, kvankam Ni ne vere uzi tiun lertaĵon multe.
>> Sed eĉ pli potence, PHP havas asociaj tabeloj,
kio estas ornama metodo diri hash tabloj.
Fakte, se vi volas deklari hash tablo en PHP, malkiel en C-- kiom
linioj de kodo ne estas bezonata por efektive implementar hash tablo en C?
Aŭ kiom linioj de kodo estas prenante implementar hash tablo en C?
Do estas probable multe, ĉu ne?
Estas kelkaj dekduo, eble 100 aŭ 200.
Ĝi estas netriviala.
Aŭ temas pri esti, kiel vi baldaŭ vidos, netriviala
implementar hash tablo [Inaudible] kaj ankaŭ provi.
Sed en PHP-- kaj sincere, mi probable ne devus diri al vi tiun
ĝis Monday-- en PHP, se vi deziras tablon faris.
Tio estas hash table-- tiel kun unu linio de kodo.
Kaj
>> Multaj lingvoj fari tion.
Amuziĝi kun pset kvin.
Do multaj lingvoj faros.
Ili donos al vi tiujn abstraktaĵoj ke aliaj homoj, aliaj programistoj,
kreis por vi tiel ke vi povas stari sur siajn ŝultrojn
kaj ekuzi ideoj kiuj estas súper konvinka, kiel hash tabloj kaj arboj
kaj provas.
Sed vi ne nepre devas implementar tiuj aferoj mem.
>> Do fine, kio Ni tuj uzi PHP por
estas potenciale skribi programojn de la tn komandlinio.
Ni povis amuzi cxiun programo ni skribas ĉi semestro tiel multe,
escepte eble Breakout kiuj uzas SPL, kiu estas specifa al C nuntempe.
Sed ĉiu alia problemo enkadrigeblajn certe Mario kaj Cezaro
kaj Vigenère kaj [? Fendi?] Kaj plue, ni
povus re-apliki en PHP, kaj probable iom pli facile.
>> Sed kion ni fine irante uzi PHP por estas ttt programado.
Kaj ni tuj enkonduki apud semajno mensan modelon, paradigma vokis
MVC, modelo vido controlador, kaj se vi jam faris programado
antaŭe en Python aŭ Ruby aŭ aliloke, vi
sciu de tiu teamo kun Reloj kaj Django kaj similaj.
Sed se vi estas nova al tio tro, vi vidos
ke tio estas vere tre natura pligrandigo de la faktorigo
kaj la speco de dezajno de kodo kiun ni
estis faranta en C. Ni tuj nun apliki iun el tiuj lecionoj por PHP
tiel ke finfine ni estas efektivigo niaj propraj retejoj.
Kaj se vi estas ia mirigitaj aŭ mirigitaj
ke ni tuj faros ĉiuj tiom rapide,
rimarkas ke preskaŭ ĉiu semestro, preskaŭ 90%
de studentoj CS50, inkluzive tiujn kiuj neniam planita antaŭ,
finas farante fina projektoj baziĝas sur ttt programado.
Do vi vidas, ke la revenoj estas altaj en la semajnoj por veni.
Do, ni vidos vin do lunde.
>> SPEAKER 1: Kaj nun, Deep Pensoj de Daven Farnham.
Hash tabloj.
>> [Ridado]