[Muzikos grojimo] DAVID J Malan: Gerai, pasveikinti atgal. Tai CS50. Tai septynių savaitės pabaigoje. Ir tai tos gaudyklės pabaiga medžioklė iš problemos nustatyti keturi kad jūs tikriausiai pamenate. Atsigavusi po visus tie darbuotojai JPEG, jums buvo užginčytos, jei norite, fotografuoti save, nes daugelis tų žmonių, kaip jūs galite. Mes turime visa krūva pareiškimų Per pastaruosius keletą savaičių, Iš tiesų, nemažai teisę prieš vidurdienį šiandien, kai kurie iš jų yra tie, kurie čia, čia pagavo in-- atrodo like-- Annenberg Hall darbo valandomis, vienas čia į Lowell House Nick. Štai Ramon pakliūva į telefoną. Tai buvo ne CS50 pietūs. Tai buvo Jason Skyping su daugiau kūrybiškumo klasiokas, kas skambino jam šiuo būdu. Mes nežinome, kas tai buvo. 

[Juokas] 

DAVID J Malan: Bet kad verta gigabaitų. Čia yra Chang, kuris pažodžiui bėgo nuo scenos išvengti fotografuojamo vieną dieną, tačiau galiausiai buvo sugauti. Čia yra Nikas. Čia yra Nikas. Čia yra Nikas. Ir čia yra Alison nustatytų sričių. Ir Zamyla net buvo nustatyta ne pramoginiai konkurencijos. Taigi mes bus eiti per šios nuotraukos, išsiaiškinti kurie pateikė dauguma Seniausias ir atlygis vienas nuostabus prizas, kaip žadėta spec. Ir mes taip pat sekti apie Erdvę, kuri buvo įtraukta. 

Iš announcements-- todėl pietums pora yra, vėlgi, tai penktadienį 13:15. Jei norite prisijungti prie mūsų, RSVP tuo URL čia. Jason vėl pasirodo čia iš vieno Sekcijų porą metų atgal, kuris įvyko Medis turi nuvirsti ant Helovinas. Ir iš tiesų, jis apsirengęs kaip moliūgų, kad konkretiems metams. Jei žiūrėti šį skyrių jo nuo 2011 skyriuje aštuoni, jei esate smalsus, ne CS50.tv, manau, tai buvo metai, per kuriuos jo oro siurblys dirbo. 

Jei tada žiūrėti panašus skyrius 2012 pamatysite šį Jasoną daug išsileidus, kadangi kostiumas nebėra veikė, kuri yra tik pasakyti Šį penktadienį, jei norite patinka išskirti moliūgų Daven ir Gabe, o kiti, RSVP į vadovų ne cs50.harvard.edu adresą. Ji žada būti labai smagu. Daven, mes pasakė, raižyti Moliūgai visą savo gyvenimą. Gabriel iš Brazilijos niekada raižyti Helovinas moliūgų. Taigi ten su jais, kaip jis sužino,. 

Seminarai, meanwhile-- todėl jūs išmoksite greičiau apie tai, kas mūsų lūkesčiai yra už Galutinis projektas, kuris iš esmės bus skliautais rengiant ir įgyvendinant dauguma bet kokį interesų projektas Jūs, tačiau taikoma patvirtinimo ir nurodymai iš savo mokymo bendradarbiu. Link pabaigos semestrą, mes pristatome numerį Seminarų, kurios neprivalomos klasės vadovaujama mokymo bičiuliais ir Harvardo darbuotojai, draugai kurso visoje Campus, įvairiomis temomis, kad yra liestinė aikštyno pagrindinė programa bet vis dėlto reikia, įdomus, ir skiriasi galimiems galutiniams projektams. 

Pavyzdžiui, pirma, jei norite užsiregistruoti, galva į tą URL ten. Ir tai yra už seriją Vien šiemet seminarai. Bet realizuoti turime dešimtis seminarai iš metais anksčiau, kurie visi yra susiję meniu Seminarai galimybė aikštyno svetainėje. Taigi, jei jūs galvojate apie tai, peržengia savo komforto zonos arba įlaipinami keletą naujų įgūdžių, Pavyzdžiui, programavimo iPhone Apps su Swift, naują kalbą Apple arba objektyvaus C arba "Android" programos arba programų [? užuomina?] lemputės ar bet kurios temos čia ir daugiau, nes patikrinimas iš registracijos puslapyje. 

Taigi mes pradėjome ir padarė išvadą, Pirmadienis su ieško HTTP. Taip greitai refresher-- HTTP, Hiperteksto perdavimo protokolas. Bet ką tai iš tikrųjų reiškia? Ką tai iš tikrųjų reiškia? Yra tai, kad ranka? Aš žinau, jūs esate tik braižymo ant galvos. Bet jūs norite pasiūlyti ką HTTP? 

Auditorija: Kaip kompiuteriai bendrauti su [nesigirdi]. DAVID J Malan: Aš praleidau paskutinę dalį. Kaip kompiuteriai bendrauti with-- 

AUDITORIJA: Internet serveriai. DAVID J Malan: Good-- su interneto serveriai, būtent, interneto serverių. Nes pamenu, ten krūva paslaugos internete, kai kurie iš jų naudoti tikriausiai kasdien nuo čate ir pranešimą, pokalbiai, ir interneto, ir siųsti, ir pan. HTTP yra tik protokolas, interneto naršyklių kalbėti bendraujant su interneto serverių, ir atvirkščiai. Ir į analoginį Žmogaus pasaulis gali būti, Aš išplėsti savo ranką purtyti kai Kiti žmogiškieji "ir jis pripažįsta, išplečiant jo ar jos ranka taip pat. Taigi tai tik protokolas, Konvencijų rinkinys. 

Ir kas iš tiesų yra tas konvencijas? Na, tai tiesiog gali būti suvesta į pranešimų siuntimo ir atgal, kaip mes pavaizdavo čia. Ir ten yra būdų pora kurį galite nusiųsti šiuos pranešimus. Ir bene bendra yra žinomas kaip vakaronė. Ir mes pamatyti, kontrastas tai prieš ilgas. 

Bet GET užklausos iš naršyklės į serverį tiesiog atrodo taip. Tai teksto krūva, kad jis kelia viduje virtualios voką. Remdamasi šia voką išorėje eiti porą gabaliukų detales. Ką reikia eiti paketas, taip sakant, siekiant gauti panašų prašymą tai nuo manęs į interneto serverį? Taip. 

AUDITORIJA: Jūsų IP adresas. 

DAVID J Malan: Mano IP adresas From srityje, taip sakant, ir žinoma, Gavėjo IP adresas. Bet iš interneto paketo atveju mums reikia šiek tiek daugiau detalių Tai neužtenka tiesiog siųsti voką prie serverio, nes serveris gali būti klausytis įvairių tipų interneto srauto. Taigi, ką dar mums reikia be gavėjo IP? Taip? 

AUDITORIJA: Ar TCP? DAVID J Malan: Geras. TCP-- 

AUDITORIJA: Adresas. 

DAVID J Malan: Adresas, arba uostas, kaip ji vadinama. Arti, bet TCP prievado numerį. Ir ten jų krūva. Bet tikrai dauguma susipažinęs galiausiai turėtų būti 80, kuris yra numatytasis vienas naudojamas interneto srauto. Ir dar vienas pažįstamas vienas netrukus bus 443, kuri yra naudojama saugiam internete eismas, URL, kurie prasideda https. 

Taigi tai, kas vyksta viduje To paketo. Ir gauti / tiesiog reiškia, suteikti man default tinklalapis. Suteik sunku įsitvirtinti vairuoti tą serveryje. Ir tikiuosi, kad interneto serveris atsakyti, OK ir numeris 200, kuris yra tik konvencija sako, taip, visi iš tiesų gerai. Štai puslapis. Šiuo tinklalapiu tipas ketina būti tekstas, bet tiksliau, HTML, kurį mes ruošiamės nerti atgal į. Ir taškas taškas taškas tiesiog priemonė, štai HTML. Ir tai, kai mes pasiimti istorija šiandien iš tikrųjų HTML rašymo, Hiperteksto kalba, kuri yra kalba, kuria interneto puslapiai yra parašyta. Tai nėra programavimo kalba. Nėra jokių funkcijų arba kilpų ar sąlygos. Tai žymėjimo kalba, taip vėl matome šiandien, kad leidžia jums nurodyti kaip formuoti ir Stilizuoti estetiškai tinklalapis. 

Taigi tai buvo vienas ir tik puslapis, mes tikrai pažvelgė, jei trumpai, pirmadienį. Ir pastebėsite, nedaugelis įvykiai, apibūdinantys. Yra atviro kampu daug laikiklis ir arti kampu laikiklis. Tarp tų, kampiniai Skliausteliuose žodžiai. Ir mes ketiname pradėti paskambinus šių žodžių žymes. Toks atviras laikiklis vadovas ir uždarytas laikiklis vadovas yra atviri ir uždari žodžius, ar pradžios ir pabaigos žymes atitinkamai, HTML elementas, kaip mes jį vadiname, vadinama galva. Ir taikoma ta pati žargonas į kūną HTML ir kt. 

Ir kas malonu yra HTML-- ir iš tiesų, mes praleisti beprotiškai mažai laiko ant jo, nes jūs dažniausiai tiesiog išsiaiškinti kokios funkcijos jis turi kai jums iš tikrųjų turi konkrečią problemą į solve-- jūs pamatysite, kad naršyklė yra gana kvailas. Tai tik ketina do-- ne kitaip computer--, ką pasakyti, padaryti. Ir todėl, kai jūs turite atidaryti Laikiklis HTML pačiame viršuje ten, kad iš esmės tiesiog reiškia, ei, naršyklė, čia ateina tinklalapis parašyta HTML. 

Kai jis mato atvirą laikiklį galva, kad tik reiškia, hey, naršyklė, čia ateina į galvą, arba Viršutinis dalis mano puslapyje. Kai jis mato uždarą laikiklį vadovas, kuris tiesiog reiškia, ei, viskas už galvos. Budėjimo kažkas. Ir kad kažkas yra matyt bus kūnas. Ir kai jūs neturite žymą, pavyzdžiui turite tik Sveiki, kablelis pasaulį, kad tiesiog bus žalias tekstas, galiausiai rodomas ekrane. 

Dabar, jūs pastebėsite, per įdubimas čia. Tikriausiai galime numanyti kaip mes stylizing jį. Kiekvieną kartą, kai aš atidaryti žymą, taip sakant, aš įtrauka. Ir kiekvieną kartą, kai aš uždaryti tag, aš JT įtrauka, Panaši dvasia klamrami. Ir ne tik, kad aš geras naudojant mano sprendimą. Atkreipkite dėmesį, kad aš ne nerimauti pataikyti Įveskite viduje tos žymės pavadinimą. Kodėl? Na, aš tiesiog nusprendžiau, kad atrodė mažai švaresnis man žmogus, tiesiog nesivargina daryti. Taigi dar kartą, yra keletas sprendimas reikalauja tik kaip ten yra C arba bet kokia kalba. 

Bet per pastebėsite, kad išgaubimas pati savaime psichikos modelis, ne per komplikuoti. Bet medis, tiesa? Jei manote, kad apie interneto puslapis, matyt parašyta kaip tai, kaip gražiai įspaudžiami, kad taip, galite beveik galvoti apie atvirą laikiklio HTML uždara laikiklis žyma pasidalijimo iš mazgo šaknis, šeimos medis stilius mazgas medžių stiliaus mes pažvelgė praėjusį penktadienį. 

Ir iš tiesų, mes turime apie čia ką mes vadiname DOM, D-O-M, dokumentas Objektinis modelis, įmantrus būdas pasakyti medis, kuris atstovauja šią HTML. Ir pastebėsite, kad HTML yra, mes pasakyti, kaip šeimos medį, du vaikai. Kairėje yra galva. Dešinėje kūnas. 

Ir tik kaip lėkštas minties, vadovas, be abejo, turi, kiek vaikų Pagal šią struktūrą? Taigi tik vienas, title-- ir tai, kodėl mes turime rodyklė vyksta nuo galvos iki pavadinimu. Taigi, tai lyg to asmens šeimos medis turėjo tik vieną palikuonį. Ir tada pats pavadinimas gali galima sakyti, kad vaikas taip pat. 

Prisiminkite, kad HTML buvo hello, kablelis, pasaulis po juo. Ir aš tiesiog atkreipė jį per ovalus, o ne tiesiog iš stačiakampio perteikti semantiškai, kad nors tai į medį mazgas, taip sakant, Tai tarsi iš esmės skiriasi. Tai ne tag. Ar daugiau teisingai, tai ne elementas. Tai tiesiog tekstas mazgas, jei bus. Tačiau tai yra visiškai savavališkų žmogaus konvencijas. Tai tik dabar mano būdas ką aš atstovaujanti agregatų skambinti dokumentą. 

Ir kaip žemę, ką ne super viršutiniame kairiajame kampe, atviras laikiklis Šauktukas doc tipas HTML, tai atrodo žymeles, bet tai kvaila kampelis atveju, kai kad yra tik ten, kopijuoti ir įklijuoti nurodyti naršyklių tai HTML 5 versija. Pasaulis nuolat keičiasi, ką Pirmoje eilutėje kodo puslapyje turėtų būti. Tai tiesiog reiškia, versija 5. Taigi jis nėra pakankamai atrodo kitiems. 

Gerai, taigi su tuo sakė, jūs dabar vertiname tai gana tai kvaila tatuiruotė kažkas gavo. 

[Juokas] 

DAVID J Malan: Gerai, o dabar tegul tikrai neria ką nors padaryti su šiuo klausimu. Jūs priminti, jog paskutinį kartą Aš atvėrė CS50 Appliance ir aš kažką kaip paprastas kaip atsivėrimas gedit. Ir aš išsaugoti failą net mano desktop-- niekur special-- kaip hello.html. 

Taigi leiskite man padaryti, kad again-- hello.html Enter. Ir dabar šioje byloje, aš ruošiuosi eiti į priekį ir atkartoti tai, ką mes ką tik saw-- doc tipo html Tada aš ruošiuosi padaryti atviras laikiklis html uždarą laikiklį. Ir tada aš ruošiuosi Preemptively atidaryti ir uždaryti žyma. Kodėl? Tiesiog, kad aš ne pamiršti vėliau. Tai tiesiog gera praktika, kaip atidaryti ir uždarymo vingiuotus skliaustus visus iš karto. 

Ir kas tada atėjo kitas? Galite manyti, kad tatuiruotė. 

AUDITORIJA: vadovas. 

DAVID J Malan: vadovas. Ir tada čia aš turėjo pavadinimą, manau. Ir vadinosi savavališkai, hello, world arti pavadinimas. Ir tada žemyn čia, kūnas, iš course-- tada mes uždaryti body. Ir tada tiesiog šiek tiek nereikalingai, Turėjau tą patį žemyn čia. 

Taigi, aš teigti, kad tai yra tinklalapis. Tai yra kažkas, kad dabar gali gyventi internete, nors žinoma, tai tiesiog gyvena ant mano darbastalio dabar. Bet iš tiesų, jei aš sumažinti gedit, Žiūrėsiu ant mano darbastalio jo piktogramą. Nors tai prietaisas, galite tai padaryti, Mac OS be TextEdit arba Langai su Notepad net. 

O jei aš einu į priekį ir du kartus spustelėkite kad net ir select-- gerai, tegul ne pasirinkti, kad dėl to, "Chrome" negali atidaryti. Vykime į priekį ir atidaryti Chrome. Ir tada daryti Command-O už atviros Ir pereikite prie mano darbastalio ir atidaryti failą. Štai kaip naršyklė interpretuoja HTML, iš viršaus į apačią, iš kairės į dešinę. Ei, naršyklė čia HTML. Štai galva. Štai pavadinimas. Štai kūnas. Ir iš tiesų, tai, kaip jis teikia šį tinklalapį. 

Bet pastebėsite URL. Nė vienas iš jūsų gali atsigriebti šiuo konkrečiu puslapis jūsų nešiojamieji kompiuteriai dabar, net viduje jūsų prietaisas per tą URL, nes failas: // rodo tai tikrai mano failų sistema, mano kietajame diske, ne tavo. Taigi tai yra ne visi, kad naudinga. 

Leiskite dabar pereiti į naudojant faktinę serverį. Ir paaiškėja, kad CS50 Appliance yra daugiau nei tik aplinkoje, kurioje Jūs galite rašyti kodą C ir kaupia ir naudoti ją kaip jūs veikėte. Jis taip pat buvo sukonfigūruotas darbuotojai nėra tipinė internete Serveris tai internete, vienas, kad jums gali mokėti už arba vienas, kad į vadinamąją debesų. 

Ir tai veikia standartinis nemokama atviro kodo programinė įranga, pavyzdžiui, kažkas vadinamas Apache, kuris, ko gero, dar populiariausia interneto serverio programinė įranga pasaulyje kad tūkstančiai interneto svetainių, naudoti šiandien. Ir jis taip pat dar turi programinės įrangos, pavyzdžiui, MySQL, kuri yra duomenų bazės serverio kad mes galų gale gauti, kuri yra tik pasakyti Galiu pradėti gydyti mano prietaisas kaip pilnavertės serverį kad aš ne mokėti už kitur. Jis tiesiog gyvena savo paties nešiojamas plėtros ir patogios tikslais. 

Taigi eikime į priekį ir pasinaudoti šia. Aš ruošiuosi eiti į priekį ir atverti terminalo langą. Ir aš ruošiuosi eiti į priekį ir move-- tikrųjų, pirmasis esu ketina pereiti į mano darbastalio. Jei aš ls, ten hello.html. Ir aš ruošiuosi eiti į priekį ir pradėti naudoti Naujas katalogas, mes nenaudojamas prieš šiandien. 

hello.html-- aš ruošiuosi persikelti į ../vhosts virtualioje hosts-- daugiau apie tai iš future-- ir tada į aplanką, vadinamą localhost, kuri yra teikiama beveik slapyvardis bet kompiuteris, ar tai Mac, PC, "arba" Linux kompiuteris, ir tada specialiai į katalogą, kad mes, darbuotojai jau sukurta jums, kai atsisiuntėte prietaisą, vadinamą visuomenės. Ir kaip rodo jo pavadinimas, nieko Aš įdėti į šį aplanką, teoriškai, ketina dabar bus visuomenės, bent jau žmonių kurie tiesiogiai jungtis prie kompiuterio. 

Taigi dabar leiskite man eiti į priekį ir padaryti cd į tą patį katalogą todėl galiu pamatyti, kas vyksta ir tipas Lt. Ir iš tiesų, tai Vienintelis dalykas ten. Neabejoju, kad dabar, nes aš įdėti šią file hello.html viduje katalogą vadinama visuomenės viduje katalogą vadinamas localhost viduje katalogą vadinami vhosts, kuris ačiū CS50 darbuotojų buvo iš anksto sukonfigūruotas, kad būtų iš savo žiniatinklio serveryje šaknis, Dabar galiu tikiuosi tai padaryti. 

Aš ruošiuosi atidaryti naują skirtuką. Ir aš ruošiuosi eiti ne į file: //. Aš ruošiuosi naudoti faktinį http / localhost, kuris vėl yra slapyvardis už savo serverį. Ir tada aš ruošiuosi eiti į ką failo vardas, tiesiog, kad būtų aišku,? Kur yra ši istorija greičiausiai vyksta? hello.html. 

Taigi, kitaip tariant, aš noriu dabar tai yra mano paties kompiuterio, mano prietaisas, tarsi tai faktinis serverio. Jo slapyvardis localhost. Bet manau, localhost, kaip pavyzdžiui, Facebook.com google.com, nesvarbu. Tai tik mano vietinis pavadinimas. Ir tada galutinis Noriu yra šaknis iš kietojo disko, taip sakant, arba iš žiniatinklio serverio šaknis, ergo įstrižas brūkšnys ir tada failo pavadinimas hello.html. 

Leiskite nutolinti ir paspauskite Enter. Ir iš tiesų, dabar yra mano puslapyje. Taigi tai šiek tiek skiriasi. Ir tai tik kaip underwhelming. Tai sena versija. Leiskite trauktis šriftą atgal. Tai senas. Tai yra naujas. Bet kas iš esmės vyksta yra tai, kad dabar yra naudojamas HTTP. 

Padarykime tai šiek tiek daugiau aišku ar, jei bus, šiek tiek sudėtingiau. Leiskite man eiti į apatiniame dešiniajame kampe mano prietaiso. Ir pastebėsite, kad visa tai laikas, ten buvo numeris. Tai yra unikalus adresas Jūsų CS50 Appliance. Tai asmeninis adresas, kurį rodo 172,16, kuris tiesiog reiškia tik fiziškai gali prieiti prie šios interneto serverį. Viskas ugniasiene ir gražiai apsaugotas nuo likusios pasaulio, nes tai adresams. 

Ir dabar pastebėti, nors jei aš einu į šis adresas, ne mano prietaisas, bet Mac OS-- aš ruošiuosi grįžti čia. Čia yra mano Mac dabar. Ir dabar aš ruošiuosi atidaryti ši Chrome versija čia. Ir aš ruošiuosi eiti į http: //172.16.25 / Ir aš pamiršti rest-- 133. 

Taigi, aš ruošiuosi aplankyti mano Mac kad IP adresas /hello.html Enter. Ir dabar matau iš mano Mac kad mano CS50 Appliance, kas IP adresas, kad skaičius, iš tiesų elgiasi kaip interneto serverį internete. Ji neturi nice lengva prisiminti vardą kaip Facebook.com, bet tai naudojant HTTP matyt, nors Chrome rūšies supaprastinimui pasaulį tik mums, bet ne mums rodydavo HTTP. Bet tai iš tikrųjų būtent tai. Chromas yra tik sutaupyti šiek tiek klavišų šių dienų. Ir tai, ką mes dabar matome. 

Kad viskas gerai ir gerai. Bet tai gana underwhelming puslapis. Leiskite eiti ir padaryti ką nors dabar šiek tiek kitoks. Taigi leiskite man grįžti į gedit. Ir vietoj labas, pasaulis, galime įdėti paveikslėlį. Ir aš teigė iš before-- leiskite man eiti į mano localhost kataloge visuomenei. Ir leiskite man eiti į priekį ir kopijuoti visa krūva failus iš šiandien mano Dropbox aplanką į čia. 

Dabar, jei aš tipo ls, ieškoti visais šiais failais kad aš platinami Kursas tinklapyje likus šiandien viena iš kurių yra vis dar hello.html. Todėl ten, kad vienas. Ir prisiminti šį kvailą vieną nuo paskutinio LAIKĄ_ cat.jpg. Taigi leiskite man pabandyti įdėti cat.jpg viduje mano puslapyje. 

Aš ruošiuosi eiti į priekį ir padaryti cat.jpg, išsaugoti. Leiskite grįžti prie "Chrome". Ir leiskite man padidinti šrifto ir dabar perkrauti. Oi, kur aš įdėti čia? Standby-- dar turiu sena versija iš mano darbastalio atversta. Taigi leiskite man eiti į savo VHOST, mano localhost, mano visuomenė, o hello.html. Taigi dabar leiskite man eiti į priekį ir say cat.jpg kūno viduje kur aš noriu, kad ji būtų rodomas ir perkraukite puslapį. Žinoma, tai nėra teisinga. 

Taigi man reikia pasakyti, kad naršyklė mažai daugiau sąmoningai ką noriu daryti. Tiesiog rašyti vardas akivaizdžiai nepakanka. Taigi prisiminti, kad buvo dar vienas tag, vaizdas, img trumpam. Tai tik todėl, kad žmonės nepatinka tipas pilnas žodžius. Ir tada mes galime padaryti šaltinį = "cat.jpg". 

Ir dabar aš ruošiuosi daryti vienas dalykas skiriasi čia. Nors visi mūsų žodžius šiol turi turėjo šį sąvoka pradėti žyma žymeniu, kad tikrai ne jausmas vaizdui, tiesa? Vaizdą arba ten, arba ten nėra. Ir taip žmonės ateina su paprastesniu konvencijos. Jei turite žymeklį gali tiek pradėti ir baigti tuo pačiu LAIKĄ_ jis gali būti tuščias, taip speak-- tiesiog įdėti įstrižas brūkšnys viduje tegus pačioje pabaigoje. Dabar leiskite man grįžti prie savo naršyklėje. Rezultatas Perkrauti Velnias, kažkas yra negerai. Jūs tikriausiai matė šį kartais internete, net jei ji nebuvo tavo kaltė. Tai žiniatinklio serveris kaltės. Ką Odes tai, matyti? Tai neveikia. Štai kur vaizdas priklauso. Taip? 

AUDITORIJA: Bet tai nėra turėti prieigą prie vaizdo. 

DAVID J Malan: Ji nėra turėti prieigą prie vaizdo. Kad arba dar blogiau, galbūt ji net neegzistuoja. Leiskite pamatyti, jei mes negalime diagnozuoti, kad. Prisiminkite, nuo praėjusio laiko, jei Chrome, į prietaisą, ar net jūsų Mac arba PC, Jūs eikite į Kūrėjų meniu ir eiti į Developer Tools variantas, kuris tikriausiai jūs nenaudojama daug ar niekada. O jei aš einu į tinklo ir perkraukite puslapį, tegul realiai pažvelgti į HTTP prašo, kad būtų daroma. 

Atrodo, hello.html yra tikrai gerai, taigi 200. Bet cat.jpg yra 403. Taigi, tai ne 404. Failo tikriausiai egzistuoja. 403 tai draudžiama. Taigi tai šiek tiek klaidina. Aš ruošiuosi grįžti mano terminalo lange. Leiskite priartinti iki čia. Ir leiskite man padaryti an ls. Yra tie patys failai. 

Dabar leiskite man padaryti LS-l, kuris jūs tikriausiai naudojamas prieš pažvelgti failą dydžiai gal ir laiko žymes. Ir mes matome, visa krūva didžioji informacija. Bet pastebėti keletą smulkmenų. Štai hello.html šiame eilutė čia ir čia cat.jpg. Ir tai tik prietaisas yra patogi, pabrėžiant JPEG purpuru, kaip šis. Bet kas kita yra skirtingi šalia failo dydis ir failo pavadinimas? 

AUDITORIJA: [nesigirdi]. DAVID J Malan: Taip, ten dar du R čia. Stebėkite hello.html jau vyksta. Taigi paaiškėja, kad pavadinimo Šis katalogas visuomenė yra labai svarbi. Nors šiame kataloge yra skirtas būti vieša. Bet to nepakanka tiesiog sukelti failus ten. Taip pat reikia pakeisti Bylų režimas, pakeisti leidimus failas aktyviai ne nustatomas kaip numatytoji nuostata, kuris yra tai, kad tik galėčiau skaityti ir rašyti, aš būdamas savininkas. Noriu visą pasaulį visus apsilankyti galės skaityti mano bylą, taip sakant. Skaityti tiesiog reiškia kad matytumėte tai. 

Ir iš tiesų, kaip jūs pamatysite problemos nustatyti septyni, tai, ką šie R "vidutinė. Šie du R "vidutinis tegul visi kitur pasaulyje taip pat skaityti, ypač dabar, tai šiame kataloge. Taigi paprasčiausias būdas išspręsti šią problemą yra eikite į mano raginimą ir padaryti chmod pokyčių režimas ir tada atlikite + R, iš viso, visi, visi, plius r skaitymo, ir tada cat.jpg Enter. Niekas, atrodo, kad taip atsitiktų, kuris paprastai reiškia geras dalykas. Taigi ls-l again-- dabar pažvelkime cat.jpg. Ir šis leidimas atrodo, pasikeitė. Kaip panaikinti, jei jūs padarote klaida ir jūs, pavyzdžiui, tiesiog padarė your-- Nemanau know-- esė viešai prieinamos avarijos, galite daryti priešingai, chmod a-r. Nors tiesą sakant, tai neturėtų būti viešajame kataloge vistiek, jei tai kelia susirūpinimą. 

Taigi dabar grįžkime prie mano naršyklė ir perkraukite puslapį. Ir aš ruošiuosi spustelėkite mažai Ghostbusters simbolis išvalyti tą dalį ekranas, kad galėtume pamatyti naujus prašymus. Ir iš tiesų, čia yra Grump Kačių akivaizdoje. Bet dar svarbiau, techniškai yra numeris 200, kuris reiškia, kad mes turime tai OK. Gerai, kad viskas gerai ir gerai. Bet mes ne padaryti geriausias svetaines, nei mes ketiname stengtis per daug, padaryti svetainių žavingiausių šiandien. Bet tegul bent kažką super susipažinę prieš barškėjimas off keletą kitų žymių. Taigi tarkime, kad aš ne tik nori katė čia. Tarkime, aš iš tikrųjų noriu katė susieti kažką. 

Aš galėtų, pavyzdžiui padaryti kažką panašaus į tai. už bazinės href už Hyper nuoroda equals-- ir tegul tiesiog padaryti kažką kaip www.google.com close cituoti close laikiklį. O dabar suraskite katėms. Uždaryti inkaras tegus. Taigi tai yra tik vienos rūšies iš esmės naujos detalės. Žinoma žymeles, yra skirtingos. Tai vardas už inkaro href arba hiper nuorodą. 

Bet dar svarbiau, yra tai sintaksinis funkcija čia. Tai yra tai, ką mes pradėkite skambinti ne žymeniu, tačiau atributas. Ir atributas yra kažkas, kad keičia etiketes elgesį. Ir šio požymio href, priemonės iš dalies pakeistų šio inkaro elgesį kad kai jis paspaudžia, jis eina į šį URL čia. Ir, žinoma, kad URL yra "Google". 

Tuo tarpu, kas tai yra Šis tekstas bus? Na, kad tai bus ką žmogus iš tikrųjų mato, kaip pabrauktas ryšys, taip paprasta, kaip kad. Taigi pabandykime tai. Leiskite išsaugokite jį. Aš vis dar hello.html. Bet dabar diskusijoje versijų, pamatysite faktinės failų vardai mes iš anksto paruoštas. Leiskite man eiti į priekį ir perkraukite puslapį. Ir dabar tai labai underwhelming puslapis dar. Bet jei aš užveskite pelės žymeklį ant there-- ir tai šiek tiek mažas, but-- matote apačioje kairiajame kampe ekrano, tai iš tikrųjų vyksta į google.com. Ir jei aš spustelėkite, kad jis bus šluotelė man kelią į tikrąjį "Google". 

Bet pastebėsite čia už galimybę išnaudojimas, kaip panaikinti. Ir mes vėl atvyksta į kitą klausimai saugumą prieš ilgas. Nes ten tai dichotomija tarp, kur jūs einate ir ką jūs sakote, galima padaryti kažką panašaus this-- http://www.google.com. Gerai, o dabar, jei aš vėl įdėkite Išsaugojus šį puslapį, atrodo aš ruošiuosi eiti į "Google". Bet nėra jokios priežasties, aš eiti į "Google", ar ne? Aš iš tikrųjų galėtų eiti į kažką panašaus badguy.com, perkraukite puslapį čia. Ir pranešimas, jis vis dar atrodo kaip "Google". Ir tik tada, jei aš aštrus Pakanka užveskite pelės žymeklį čia aš pastebiu tai dar ketina eiti į kitą vietą. 

Taigi, jei jūs kada nors Dotarłeś laišką, ypač vienas iš Paypal, arba atrodytų iš Paypal prašau jūsų prisijungti į savo sąskaitą, tai Štai kodėl jūs niekada neturėtų kada spustelėkite laiškuose nuorodas į, tiesą sakant, bet kokie laiškų nuorodos. Jei žinote, kad turite faktinis pinigų PayPal arba banko Amerikos ar Fidelity arba bet svetainė, rankiniu būdu įvesti jį. Nes atrodo, kaip paprasta yra apgauti žmogų į pristatydamas ką atrodo nuorodą. Bet ji iš tikrųjų galėtų eiti absoliučiai visur. 

Ir ten daug didesnis grėsmės nei šis. Tiesą sakant, tai yra šiek tiek iš liestinės dabar, bet vienas iš geriausių aš kada nors matė, kuris nuo to laiko buvo uždarytas, yra kas nors vadovauja žmonės to-- todėl tai gali pasakyti, spustelėkite čia prisijungti prie savo sąskaita, banko sąskaitos. Ir tai buvo bankas Vakarus. 

Taigi kažkas nupirko tai. Ir tai šiek tiek lengviau pamatyti jis iš mono išdėstyti šriftu Mastelis į dėl 30 pėdų projektorių. Bet kai atėjo mažas šriftas laišką, kad jūs gaunate, tai atrodo bankofthewest.com, ne bankofthevvest.com, kuris nors sumokėjo $ 10 pirkti. Ir tada tai paskatino juos ekvivalentas blogų svetainėje. 

Ir pamatysite too-- tikrųjų galime padaryti this-- jei aš einu į faktinę svetainėje, bankofthewest.com, vėlgi, atšaukė iš paskutinio kad jei tai yra jų tinklalapyje ir Tau smalsu, kaip ji veikia, žinoma, galima eiti į Chrome kūrėjo įrankiai. Ir jūs galite pamatyti visas HTML gražiai suformatuotas ten. 

Bet daugiau iki taško, Jūs cam-- tegul uždaryti this-- galite eiti Peržiūrėti Kūrėjas Žiūrėti šaltinį. Kodėl ne aš tiesiog nukopijuokite visa tai ir tada aš gali eiti į mano mažą gedit langą čia ir padaryti savo tinklalapį. Išsaugoti tai hello.html. Ir tikriausiai tai bus pertrauka, nes tai nėra taip lengva paprastai. Bet dabar, jei aš iš naujo įkelti savo paties puslapius mano CS50 Appliance ir paspauskite Perkrauti, Gerai, kai medžiaga sumušė. Bet aš esu gana arti turinti mano paties banko interneto svetainėje, ar ne? Visa tai HTML-- 

[Juokas] 

DAVID J Malan: --I nebuvo actually-- ir jūs žinau, ten yra kas nors ten, kuris būtų iš tikrųjų paspaudžia šias nuorodas per. Taigi aišku, kai kurių dalykų sumušė. Bet tai vyksta vadovauti mums į diskusiją, be reikalo dabar, kaip į tai, kas CSS CSS yra, ir kaip jūs iš tikrųjų atsisiųsti kitų HTML failus ir JPEG GIF failus, svetainė gali būti naudoti. Bet visa tai yra įvykdomas. Bet tai tikrai suvesta šie labai paprasti euristika. 

Taigi, dabar galime tik perversti pora kitų pavyzdžių HTML tiesiog suteikti jums jausmą ką dar galite padaryti. Pavyzdžiui, tai yra list.html. Tarkime aš norėjau padaryti tinklalapį su namų Quad sąrašą. Galiu naudoti ul tegus netvarkingai sąrašas ir tada sąrašo elementas vaikas ir tada pakartoti over-- arba sąrašas, rather-- namus tas. 

Ir jei aš atidarau tai aukštyn, tegul tai daro. Vykime ne hello.html, bet list.html. Velnias. Kaip man išspręsti šią problemą? Tai tas pats klausimas, kaip ir anksčiau, tiesa? Taigi leiskite man padaryti chmod-- oops-- chmod + r list.html. Ir dabar, jei aš einu atgal į savo naršyklę ir spustelėkite "Įkelti iš naujo, ten jis yra. Taigi, jei jūs kada nors norėjo padaryti sąrašą su ženkleliais, galite tai padaryti. Jei norite, kad būtų super išgalvotas ir padaryti įsakė sąrašas nėra netvarkingai sąrašą, pakeisti tuos, ol, perkraukite puslapį ir Dabar naršyklė numeruoti tai už jus. 

Ką dar galime padaryti? Na, tarnauja kitiems pora jei jūs turite ilgus paragrafus text-- pavyzdžiui, kai kurie Lotynų tekstas kaip this-- ir norite jį atskiromis pastraipomis, atvira p netoli p pastraipoje nurodyti žyma. Ir padaryti jį dar kartą ir dar kartą. O jei aš dabar atverti šį failą, paragraphs.html, gerai, tai vis erzina. Taigi, dabar galime tik grįžti į savo greitai, chmod a + r r žvaigždė .html-- gražus afera taip sakant. Ji turėtų nustatyti visus šios problemos man. Leiskite perkraukite puslapį. Yra trys punktai. 

O dabar einam į priekį ir atverti vieną kitą. Kaip apie stalo? Jūs pastebėsite, stalo išvaizda šiek tiek sudėtingesnis. Bet tai tas pats idea-- atviras žymeklį, atidarykite žymą, atviras, atvira, atidaryti, uždaryti žymeklį, atidarykite žymą. Ir tai atsitiks pastovėti stalo, kurios sienos yra akivaizdžiai bus storis 1-- kokia kad means-- lentelės eilutė, stalas duomenys, o tai reiškia ląstelę. O jei aš einu atgal į savo naršyklę čia ir pereikite prie table.html, jūs galite pamatyti kažką kaip tai, šlykštus. Bet mes gauti iki taško, kur mes galime iš tikrųjų kad viskas gražiau nei tai. 

Taigi leiskite man nustatyta, jau dabar. Yra kekių daugiau žymės. Ir HTML yra puikus pasiimti nes, tiesą sakant, viskas, ką jums reikia padaryti, yra pažvelgti esamas interneto puslapius su kuria jūs esate susipažinę. Ir jūs, kaip, oh, tai kaip jie tai padarė estetiškai. 

Arba jūs galite ieškoti bet kokią internetu išteklių, kaip HTML veikia, ir pamatysite, kad ten Visa žodynas kitų žymių. Bet su paprasta psichikos modelį Vien kad beveik bet tegus atidarote turi būti uždarytas, tai tikrai nėra pakanka mokyti save HTML po suprasti šie pagrindiniai idėjos žymės ir atributai ir gerai formedness kad mes kalbėjome apie, uždaryti nieko, kad mes galėtume atidaryti kad mes nepainiokite naršyklę. Taigi leiskite dabar priimsime tai, kad įdomiau lygis eikite į faktinį. Ir eikime į mano Mac čia į google.com. Ir dabar notice-- tegul tai padaryti. Aš gong eiti Nustatymai, paieškos parametrai. Noriu išjungti šią erzina akimirksniu Rezultatai dalykas, kur jis iš karto pradės atsakinėti į rašyti. Darom senesnę mokyklą taip mes iš tikrųjų matyti, kas vyksta. 

Taigi, aš ketina išsaugoti savo Google nustatymus. Ir dabar notice-- aš ruošiuosi ieškoti kažką panašaus katėms. Ir ji vis dar daro auto pilnas čia, tačiau remiantis dalykų žmonės įvedėte anksčiau. Bet pastebėsite, kas nutiks. 

Atsižvelgiant į tuo metu, URL tai tik google.com. Ir techniškai, tai velniop. Google tiesiog taupyti simbolį ir ne mums rodydavo, kad. Jie rodo mums https, tiesiog būti super ramina, kad mes ne saugiame arba saugiame puslapyje. 

Taigi leiskite man eiti į priekį ir ieškoti kačių. Dabar tai turiu tikrai didžioji greitai. Pažvelkite į šį URL ilgio. Tačiau paaiškėja, kad dauguma šių dalykų URL iš tikrųjų yra gana nenaudingas. Aš ruošiuosi pradėti trinti dalykų aš nesuprantu. Matau kates. Suprantu kates. Aš nežinau, kodėl katės ten vėl. Aš tikrai nežinau, kas tai nesąmonė yra. Taigi aš tik ketina išlaikyti pabrėžiant ir išbraukiant stuff kad nesuprantu, distiliuojant URL į tiesiog tai. 

Dabar leiskite man get įvesti dar kartą. Atrodo, Google vis dar veikia. Taigi kažkodėl jie pridėti daug stuff savo URL pagal nutylėjimą. Bet tai nėra griežtai reikalaujama. Taigi, kas yra malonu apie tai? Na, leiskite man eiti į priekį ir atverti Chrome "inspektorius. Yra mažai pelė spartusis jį. 

Eiti į skirtuką Network. O dabar leiskite man perkraukite šiuo puslapiu dar kartą. Ir aš, turintis Shift. Kaip panaikinti, naršyklių linkę į talpyklą arba išsaugoti informacija tik efektyvumas labui. Tačiau paprastai, laikydami Shift ir perkrovimo privers viską pradėti iš naujo nuo pradžių. Ir tai, ką aš noriu padaryti čia. 

Ir visi šie pranešimas eilutės, kad tik pasirodė. Pasirodo, kad bet kuriuo web puslapis, ten gali būti tik vienas failas involved-- hello.html-- ar ten gali būti 52, kaip šioje byloje. Kai grįžtu google.com, matyt, mano naršyklė prasideda 52 atskirus HTTP užklausas. Kodėl taip yra? 

Na, pažiūrėkite, kas viduje Šio tinklalapio iki viršaus. Yra ne tik tekstas, bet ten tikri vaizdai Kačių nei į dešinę. Yra spalvingas logotipas čia ne kairėje. Yra visi šių piktogramų dėl mikrofono ir kt. Yra gabalų daug, statybos blokai, įbrėžimams gabalai, jei bus, su šiuo tinklalapiu. Ir ką naršyklė daro ant gauti pačią pirmą failą, kuris tai eilutė čia, tai yra iš esmės Iteracja per viršu į apačią, iš kairės į dešinę, ieško tokie dalykai kaip image Komentarai ar kitų žymių kurie paminėti kitus failus ir kai ji mato juos, eina ir ima juos Http, perspektyvus visa vokas metafora, ir tada rodo juos tinkama vieta pačiame puslapyje. 

Bet pastebėsite čia, jei aš dėmesio pirmieji metimas, paieškos katės, pastebėti, kad iš tikrųjų jis naudoja HTTP 1,1. Ir, deja, "Google" Chrome dabar versija 39 rūšies dumbing dalykų žemyn ir nerodo mums realius antraštes. Bet kas iš tikrųjų buvo perduota yra prašymas ne velniop, bet / paieška? q = katės. 

Dabar, kodėl tai svarbu? Na, aš ruošiuosi daryti išvadą iš to, kad, jei "Google" palaiko užklausų šios formos, kodėl ne aš įgyvendinti savo paties paiešką variklis CS50, bet tik priekyje pabaigos, tiesiog grafinė vartotojo sąsaja. Ir mes užsako atgal pabaigoje, Tikrasis paieškos rezultatus "Google". 

Taigi, kaip aš galiu tai padaryti? Na, leiskite man eiti į gedit čia. Ir leiskite man eiti į priekį ir atidaryti iki, tarkim, naują failą. Ir aš ruošiuosi išsaugoti tai laikinai, kaip vykdyti paiešką 0.html. O galiausiai, mes greitai laukiu vieno man paruoštus. 

Ir aš ruošiuosi greitai pakelti doc tipo html atviras laikiklis html arti laikiklis html. Tada aš ruošiuosi padaryti galvą arti galva atviras pavadinimas CS50 Paieška vietoj "Google" paieškos. Žemyn čia aš ruošiuosi kūno, žemyn čia arti kūno. Ir dabar man reikia CS50 Ieškoti. Ir iš tikrųjų, tegul statyti jas didinti. Aš ruošiuosi eiti į priekį ir uždarykite šį ir iš tikrųjų įdėti jį į mano viešame. Taigi man tik vieną akimirką. paieškos 0.html-- aš ruošiuosi laikinai jį vadiname search.html. Aš ruošiuosi chmod it + R search.html. Ir dabar aš ruošiuosi jį atidaryti. Gerai, kad buvo greitai. Tačiau tikslas buvo tiesiog gauti iki taško, mums turintys šį tekstą failas, vadinamas search.html. Taigi ne daug pažvelgti dar. Iš tiesų, jei aš einu į mano vardas ir eiti į search.html, kad viskas yra. Bet žinote ką? Aš galiu būti šiek tiek mėgėjas. Skaitau knygą, kad yra antraštė tegus vadinamas h1. Ir aš ruošiuosi eiti į priekį ir naudoti šią atvirą H1 ir glaudų h1. Perkrauti puslapį. Ir dabar tai daugiau ir drąsiau, ne visi, kad įdomus, bet bent jau struktūriniu įdomesnis. Bet dabar leiskite man pristatyti dar vieną gairę. Pasirodo ten forma tegus. Ir leiskite man baigti gairę. Ir paaiškėja, ten įvesties tag kad turi atributą "tipo, kuris yra duomenų tipas srityje, jei bus. Ir tai bus tipo tekstą. Ir jos vertė eina būti CS50 Paieška. Uždaryti tag. Ir tai bus ne sąvoka atidarymo ir uždarymo su atskirtumėte žymes. 

Leiskite grįžti čia ir pamatyti, kas vyksta, iš naujo įkelti. Kelionė įdomi. Atrodo, kad tai tekstinis laukas. Ir iš tikrųjų, aš nenorėjau įdėti vertę ten dar. Leiskite grįžti čia ir iš tikrųjų gauti atsikratyti šios vertės išlaikyti ją paprasta. Vietoj vertės ką norėjau duoti tai, ką buvo vardas. Ir aš nežinau, kas tai yra, todėl aš sugrįšiu prie to. 

Bet toliau, kad aš noriu daryti input type = pateikti. Ir ši vertė bus CS50 Paieška. Ir mes pamatyti, kodėl aš persikėlė į šią vertę. Kai aš iš naujo įkelti, man atrodo, kad dabar turime Iš mano paties paieškoje pradžia variklis, super šlykštus, nors tiesą sakant, tai ne toli mesti iš ko Numatytasis "Google" puslapis atrodo. 

Jei aš einu čia dabar, aš galiu įvesti katės ir tikiuosi spustelėkite Ieškoti. Bet aš ne visai padaryta dar, nes aš neįgyvendino, akivaizdu, duomenų bazė. Aš netikrinome interneto paieškos rezultatus. Taigi man reikia perduoti, kad "Google". Taigi, kaip man tai padaryti? 

Na, visų pirma aš reikia pridėti ir veiksmai priskiria savo formą tegus kad yra http://www.google.com/search. Ir aš žinau, kad tik nuo to, numanomas, žiūrėdamas glaudžiai ne jų URL. Ir dabar atspėti. Ką turėtų tai tekstinis laukas tikriausiai vadinamas, remiantis kur atėjome iš anksčiau? 

AUDITORIJA:? Q. 

DAVID J Malan:? Q. Ir mes ne iš tikrųjų reikia, be pažymėti it turns out, o q yra iš tiesų, q užklausai tikriausiai iki Numatyta, kad tik todėl, kad tai ką Laris ir Sergėjus atėjo su prieš metus. Taigi dabar leiskite man iš naujo įkelkite šį puslapį. Tai neatrodo, kad skirtingi. Bet dabar žiūrėti, kas atsitiks. 

Jei aš tipo kates ir spustelėkite CS50 Paieška paleiskit, pastebėti gaunu žaibišką toli faktinį Google. Dabar, "Google" yra mažai erzina, kad jie pridedant papildomą parametrą, jei bus, prie URL. Tai viskas vyksta automatiškai Google pusėje. 

Svarbu yra tai, kad aš, atrodo, į davę šį prašymą čia. Ir iš tiesų, tai, kas vyksta. Kai turite HTML, kad atrodo taip, tai yra tarsi interneto svetainių kūrėjai notacijos už žodžius, eiti į priekį ir sukurti formą kad kai jis pateikiamas, jis ketina eiti į šį URL. Ir kai URL suteikė vertės dalykų, pavyzdžiui, q, neina tiesiog į šį URL. Tiesą sakant, pereikite prie klausimo ženklas ir tada q = katės. Pridėti parametrą, HTTP parametras panašaus. 

Ir tiesiog būti super tikslūs, tai, kas buvo daroma išvada here-- bet aš būsiu daugiau explicit-- yra kad metodas aš noriu naudoti yra gauti, o ne kažką panašaus paštu, kurį mes galiausiai pamatyti. Taigi, trumpai tariant, tiesiog suprasti HTML ir naudojant kai gana paprastus žodžius, Dabar mes galime pradėti kurti mūsų priekinės vartotojas Sąsaja su paieškos variklis už ją. 

Bet tai, žinoma, yra gana šlykštus. Taigi leiskite man iš tikrųjų atverti šiek tiek geresni versija. Tai vienas aš parengta anksto, kad turi keletą pastabų. Bet pamatysite, kad aš beveik atkūrė jį. Taigi tai jau galima rasti internete. Ir aš atsitikti Preemptively eiti į https tiesiog laikyti jį paprasta. 

O dabar tegul atverti Kitas pasikartojančių tai. Ar 1 0 versija vietoj. Ką šuoliai į tave kaip šiek tiek skiriasi šiame pavyzdyje? 

AUDITORIJA: [nesigirdi]. 

Taip, ten yra šis tekstas Lygiuoti. Tai šiek tiek keista čia. Bet tai iš tikrųjų naujas. O gal atspėti, kas nutiks. Jei aš einu į savo naršyklės dabar ir aplankyti paieškos-1.html, tai beveik tas pats. Bet tai žingsnis yra šiek tiek daugiau gana. Jis vis dar negraži, bet gražesnė kad bent viskas dabar sutelkta. 

Taigi paaiškėja, kad tai, ką aš naudoju yra kita kalba apskritai vadinamas CSS CSS. Ir CSS, tiesą sakant, yra natūra iš, mano asmenine nuomone, atrociously sukurta kalba. Tai labai erzina prisiminti visi įvairių detalių. Bet tai, ką stylizes Visas pasaulinis žiniatinklis šiandien. Aš įžeidė žmogų. Gerai. Taigi grįžkime čia ir pamatyti kaip mes iš tikrųjų naudoti šią. Ir it turns out, bent tai iš tikrųjų gana paprasta kalba. Tai tiesiog rakto poros, savybės ir vertybės, savybės ir vertybės. Iš tiesų, čia yra vienas iš toks turtas ir vertybė. 

Tiesiog naudojant stilius atributas mano body ir suteikiant jai reikšmė yra Žodis dvitaškis ir kitas žodis, ar turtas ir vertybė, Galiu įtakos estetikai šiuo tinklalapiu, o ne nebūtinai struktūra dar, bet apie jį estetika. Ir tik "Google" paiešką visame, aš suprantu, kad CSS CSS, palaiko turtą, pavadintą text-align, kurio vertė gali būti į kairę, dešinę ar centrą, pavyzdžiui. 

Taigi dabar, kai aš iš naujo įkelti šiuo puslapiu, kas aš gauti buvo sutelkta puslapis, bet vis dar gana negraži. Vykime į priekį ir atidaryti iki Paieškos 2 versija. Ir dabar pastebėti, aš padariau šiek tiek daugiau. Atkreipkite dėmesį, kad čia viduje galvos tag, gali būti daugiau nei pavadinimas. Tiesą sakant, ten stilius tegus. Ir tai, kai ji tiesiog gauna tiek nepatogus matymas CSS kartais. 

Atkreipkite dėmesį, kad man atrodo, kad turite kažką kad struktūriškai atrodo labai skirtingi. Bet čia yra vardas tag Noriu stilizuotas. Čia yra mūsų seni draugai garbanotas petnešos ir uždara garbanotas petnešomis. Ir tada čia yra tai, kad nuosavybė ir jos vertė. 

Jei aš įkelti šį failą, search2.html, Galutinis rezultatas yra identiški. Bet tai į geresnį projektavimą žingsnis. Faktoringo šią CSS, aš ne susimaišė su mano HTML. Ir iš tiesų, kaip matysime, galėjau pakartotinai šias savybes ir vertybes. Jei aš norėjau, kad kekių dalys mano tinklalapio centre, Aš neturiu įvesti style = text-align centras visame vietą. Aš galiu įdėti į vieną vietą galbūt, norėtų iki viršuje. 

Bet net ir tai nėra geriausia dizainas. Iš tiesų, vienas iš dalykų, jūs išmoksite kaip jums praleisti daugiau laiko su web programavimas, kad daugiau jūs galite iš modulių dalykų ir veiksnių dalykus kaip .h failus leiskite mums faktoriaus stuff, patinka helpers.c Būkime veiksnių dalykus keletas psets prieš. Panašiai galėtų mums norite pasiekti šį tikslą. 

Taigi pranešimas versija trys search.html aš išvalyti vadovė puslapis ir tiesiog šioje, Gairė nuorodos, kuri prieštarauja pavadinimo, nesuteikia jums nuorodą. Jis jungia į kitą failą būdu href, kurio vertė šiuo atveju, yra paieškos 3.css Taigi aš suprantu, mes ketiname greitai. Bet viskas, ką aš darau yra natūra pereiti dalykų aplink. Leiskite man atidaryti paieškos-3.css. Ten ji yra, niekas tikrai į jį. Aš tiesiog nukopijuoti ir įdėti jį į naują file, panašiai kaip mes atsižvelgti stuff į kitus failus prieš. Ir result-- visiškai underwhelming-- bus lygiai tas pats. Bet mes juda toward-- ne, tai ne. Ak, aš žinau, kodėl. 

Taigi atrodo, kad klaida. Ir tai yra tam tikra prasme. Bet leiskite man atverti savo skirtuką Network. Leiskite perkraukite puslapį. Ak, kodėl CSS nėra taikomos? Na, CSS failą, panašiai, turi būti pasaulyje skaitoma, taip sakant. Ir tai taip pat šiuo metu draudžiamas. Taigi leiskite man padaryti chmod a + r žvaigždės dot CSS-- whoops-- mes dot CSS yra tik failo plėtinys CSS failus. Dabar leiskite man grįžti prie mano naršyklė ir perkraukite puslapį. Gerai, šiek tiek geriau. 

Dabar leiskite man padaryti vieną dalyką. Paieškos-4.html. Turiu versiją, kad aš maniau, buvo būdas aušintuvas, nors taip daugiau sudėtingas. Pažvelkime todėl pirmiausia. Uždaryti šį duoti mums daugiau vietos. Tai pakeisti paieškos-4, "Enter". 

O dabar keletas dalykų krūva sulaužyta. Aš ruošiuosi grįžti į mano katalogą čia. Ir dabar aš tik ketina tai padaryti A + r chmod ant file-- nes aš žinau, tai exists-- vadinamas logo.gif, kuris yra vaizdas. O dabar iš naujo įkelti. Ir wow-- todėl dabar aš visai arti, tiesą sakant, patikti 1999 versiją "Google", ir atvirai kalbant, 2014 versija "Google", tiesa? 

Taigi dabar jis ketina savo interneto svetainėje, galiausiai, jei aš ieškoti kačių. Ir iš tiesų jis yra. Bet ką aš daryti kitaip Šioje versijoje 4? Taigi mes ne gyventi per daug apie jį čia. Pamatysite tai problema septynis ilgainiui. Bet pastebėsite aš keletą dalykų. 

Aš pristatė div žymę, kuri padalinys Panaši dvasia į dalį žyma. Bet kvadratas yra kaip, čia stačiakampis nematomas regionas ekrano. Leiskite suteikti unikalią identifikatorius, apačia, tiesiog kad mes galime kalbėti apie tai mūsų HTML kitur. Štai dar vienas puslapio skyrius kurio ID bus turinys. Tai puslapio turinio. Ir čia yra puslapio antraštė. 

Kitaip tariant, aš iš esmės HTML esu psichiškai žiūri šią tinklalapį kaip trys komponentai, surenkamosios čia su šio nematomo stačiakampio, viduryje turinys, o tada apačia žemyn toliau, net nors mes nematome tų dalykų. Nes aš noriu, mano galva puslapis čia arba .CSS failą, Galiu naudoti šį sintaksė. 

Header nėra tag. Tai ID, todėl tampa , kad atlikdami #header, Dabar galiu taikyti vieną ar daugiau NT į antraštę. Galiu padaryti tą patį turinį, tas pats turinio čia. 

Taigi, pavyzdžiui, į apačią,, įspėjimo visi šių savybių aš pridedant. Ir aš žinau, kad jie egzistuoja, tiesiog skaityti ant CSS dokumentus. Šrifto dydis bus smaller-- todėl kai santykinis šrifto dydį. Svoris bus paryškintas. Margin-- Kiek taškų aplink it-- yra 20 taškų. Ir tai bus sutelkta. 

Bet dabar, puslapis atrodo taip. Jei aš nesu patenkintas mano kopija tiesiai ten, Galėčiau padaryti kažką panašaus raudoną spalvą. Ir tada aš galiu išsaugoti tai, perkrauti, ir dabar aš stilizuotas apačią. Taigi tai yra tik užuomina į valdžią ką jūs galite padaryti interneto puslapį keisti dalykų aplink. 

Ir net geriau nei tai, jei norite, kišti aplink su faktiniais svetainių, Jūs negalite nuolat juos keisti. Bet jei aš atverti "Chrome" Inspektorius vėl ir aš einu ne į dešinėje pusėje čia, o tai rodo Facebook "HTML, bet rodo į dešinę pusėje visą savo CSS, galite arba ir keisti dalykų skristi. Taigi leiskite man eiti į priekį ir tai padaryti. 

Leiskite man eiti į priekį ir kontrolė spustelėkite šią atsitiktinis žodis čia pasirašyti, ir spustelėkite Tikrinti elementą. Chromas labai patogiai šokteli h1 žyma, kad "Facebook" naudoja. Ir pastebėsite, čia Facebook turi rūšies tingiai sunku koduojamų šrifto dydį kaip turto čia. 

Taigi kietas dalykas, nors tai, kad jei aš iš tikrųjų eiti į čia ir pasakyti, oi, "Facebook", man nepatinka, kad 64 taškų, dabar mes galime pakeisti "Facebook". Žinoma, mes tik jį pakeisti man asmeniškai šiuo metu. Bet tai tik dar vienas įrankis mūsų įrankių rinkinys kad ketina leisti mums įgnybti ir išsiaiškinti, taip pat diagnozuoti klausimai mūsų tinklalapiuose. Ir mes taip pat galėtų eiti per čia, kuris yra tas pats dalykas. Jei tikrai nori gauti išgalvotas, aš reiškia, dabar galite tikrai mutuoti puslapį ir daryti beprotiškus dalykus. 

Tad kodėl visa tai naudinga? Na, galiausiai, mes norės būti sugebėti kurti internetinius puslapius, lemia mūsų pačių užpakalinių galų, ne tik "Google" ir užsakomųjų atgal pabaigoje ten. Mes iš tikrųjų nori vertė, pavyzdžiui, iš mūsų paieškos programą veiksmų priskirti eiti ne kitam asmeniui, bet kažkas panašaus search.php, kur search.php yra mūsų pačių serverį, ne kažkieno. 

Ir taip, kad ten, mes iš tikrųjų reikia įvesti naują kalbą. Taigi mes jau pažvelgė vienas naujas kalba čia arba du tikrai, HTML ir CSS. Bet jie tikrai yra tik struktūriniai ir estetinės kalbos. Jie nėra programavimo kalbos per se. Ir tai maždaug tiek, kiek formalus laikas kaip mes praleisti ant jų. Nes pradėsime dabar pereiti prie PHP. 

Taigi PHP yra tikrasis programavimo kalba. Tai skriptų kalba ta prasme, kad tai skirtas būti lengvesnis svoris nei kažkas panašaus C. Ir tai aiškinama kalba, o tai reiškia, jis nėra sudarytas. Taigi trumpai tariant, kas ji reiškia kai mes naudojamas kaip C kalbos ir mes turėjome surinkti jį? Ką tai reiškia, kad kaupia C šaltinio kodą? AUDITORIJA: [nesigirdi]. DAVID J Malan: sakyt? AUDITORIJA: [nesigirdi]. DAVID J Malan: Perfect. Tai paverčia jį į dvejetainę. Tai paverčia jį nulių ir tuos nuo faktinio anglų kaip šaltinio kodą. Ir tada mes galime iš tikrųjų paleisti tuos nuliais ir tuos, perduodant juos per CPU dukart paspaudę piktogramą ar veikia komandą. 

PHP ir Python ir Ruby Perl ir JavaScript ir kekių kita kalbos interpretuojami kalbos, kuri yra pasakyti Jūs neturite kaupia juos. Vadinasi, turite maitinti juos kaip į Programa vadinama vertėją. Ir kad vertėjas, kuris kažkas ją parašė, skaito savo kodą viršaus į apačią, į kairę į dešinę ir tik interpretuoja tie linijas ir daro tai, ką sakote. 

Taigi, jei jūs susidūrėte linija, kuri sako spauda, tai nebūtinai konvertuoti spausdinti su atitinkamais nulių ir. Jis tiesiog turi šį interpretatorių, pavyzdžiui didelis, jei sąlyga, kad sako, jei programuotojas nurodymas spausdinti, tada atlikite šiuos veiksmus. Todėl jį interpretuoja tiesiog iki rūšies samprotavimo per ką sakai tai daryti. 

Ir PHP yra viena iš šių kalbų. Ir prieš PHP metų buvo sukurta Būtent dėl ​​interneto programavimo. Ir tai buvo iš pradžių labai jausmingas nepatogus kalba. Ir iš tiesų, ten didžiulis suma blogų PHP kodo ten. Bet pati kalba subrendo per metus, tiek daug, kad dabar tai tikrai nuostabus Kitas žingsnis pedagogiškai iš C, nes jis taip darned pažįstamas viską jūs ką tik matė per pastaruosius keletą savaičių. 

Vienas pradinis skirtumas matysime yra ten ne pagrindinė funkcija nebėra. Kai pradedate rašyti kodą, tai tik ketina gauti įvykdyta nesvarbu ką, kaip pamatysite iškart. Tuo tarpu štai ką kintamasis atrodo PHP. Tai šiek tiek skiriasi, bet tik vos. 

PHP, ten ne stiprus rašyti. Yra savaitę rašyti, kuris tiesiog reiškia, kad Yra duomenų tipai, pavyzdžiui, stygų ir numerius ir kitus dalykus. Bet jums nereikia nerimauti nurodant ką jie nebėra. PHP skaičiai jį jums. Doleris ženklas yra tik sprendimas kad PHP žmonės padarė metų prieš, kad kiekvienas PHP kintamasis tiesiog prasideda dolerio ženklas. Tai tikrai rūšies naudinga tuo, kad jis šokinėja į tave šiek tiek daugiau. 

Bet po to, tai yra PHP būklė. Koks skirtumas, palyginti su C? Apgauti question-- nieko, kuris iš tikrųjų tikrai gražus. Būlio išraiškos PHP-- pačiu. Būlio išraiškos su ir palyginti arba, jungikliai, kilpos, kilpos, loops-- Gerai, tai vienas yra skirtingos. 

Taigi paaiškėja, ten pora kitų funkcijų PHP. Vienas iš jų yra iš tikrųjų tai, kuri yra nuostabiai patogi. Jei $ skaičiais yra masyvas, kad jūs paskelbė anksčiau programoje, turite šią fantaziją kiekvieną konstruktą kad, užuot visa tai erzina aš lygus 0, I yra mažiau nei tai, [? I ++?] už kiekvieną numerių skaičius kaip, kur kiekvieno tų dolerio ženklas vertybių yra tik kintamasis, o pastarosios jūs galite galvoti, kaip I. Galima tai vadinti viską, ką nori. Aš pašaukiau jį numerį. Tai va pakartoti per masyvas vadinamas numerius. Ir kiekvienos iteracijos, tai vyksta automatiškai atnaujinti Jums doleris ženklas skaičių kintamasis, kad jūs nuolat turėti prieigą prie kintamojo norite be daryti bet kokį kvadratinių laikiklis notacija arba indeksavimo į masyvą. 

Be to, mes dar tokie dalykai kaip matricas, kurios atrodo beveik tą patį, išskyrus tai labai paplitęs, nes mes pamatyti, tiek PHP ir JavaScript iš anksto inicijuoti masyvą naudojant skliaustus,. C naudoja vingiuotus skliaustus. Taigi tai šiek tiek skiriasi, nors mes ne tikrai naudoti šį triuką daug. 

Bet netgi dar daugiau, PHP Association masyvai, , kuris yra išgalvotas būdas sakydamas maišos lenteles. Iš tiesų, jei jūs norite nustatyti maišos stalo PHP, skirtingai C-- kiek eilučių kodo dar reikia, kad realiai įgyvendinti maišos lentelę C? Arba kiek eilučių kodo yra ją atsižvelgiant įgyvendinti maišos lentelę C? Taigi, tai tikriausiai daug, ar ne? Tai keliasdešimt, gal 100 ar 200. Tai nontrivial. Ar tai apie būti, kaip jūs netrukus pamatysite, nontrivial įgyvendinti maišos lentelę [Nesigirdi] ir taip pat pabandyti. Bet PHP-- ir atvirai, aš tikriausiai neturėtų pasakyti tai kol Monday-- PHP, jei norite lentelę, padaryta. Štai maišos table-- taip skiriama viena eilutė kodo. Ir 

Kalbų daug padaryti. Smagiai su pset penkių. Taigi kalbų daug padaryti. Jie suteiks jums šias abstrakcijas kad kitų žmonių, kitų programuotojų, sukūrėme jums taip, kad jūs galite stovėti ant savo pečių ir pradėti naudoti idėjas, kurios itin įtikinamas, kaip maišos lentelėmis ir medžiai ir bando. Bet jūs nebūtinai turite įgyvendinti tuos dalykus sau. 

Ir taip galiausiai kas mes ketiname naudoti PHP yra potencialiai raštu programas iš vadinamosios komandinės eilutės. Galėtume atkurti kiekvieną programą mes parašiau šį semestrą iki šiol, išskyrus gal Breakout kuri naudoja SPL, kuris yra specifinis C šiuo metu. Bet kas antrą problema nustatyti, tikrai Mario ir Cezaris ir Vigenere ir [? Plyšių?] Ir toliau, mes gali vėl įgyvendinti PHP programavimo kalba, tikriausiai šiek tiek daugiau lengvai. 

Bet ką mes galiausiai vyksta naudoti PHP yra interneto programavimo. Ir mes ketiname pristatyti naujos savaitę psichikos modelis, paradigma vadinama MVC, modelis vaizdas reguliatorius, kuris, jei jūs padaryti programavimo prieš Python arba Ruby ar kitur, galite Galbūt žinote šios komandos su Bėgiai ir Django ir panašiai. Bet jei esate naujokas tai irgi pamatysite kad iš tikrųjų tai yra labai natūralus išplėtimas Faktorizavimas ir dizaino rūšiuoti kodo, kad mes darome C Mes ketiname dabar taikyti kai kurias iš šių pamokų PHP kad galiausiai mes įgyvendinant savo svetainėse. Ir jei jūs tarsi abstulbusi ar nustebinti kad mes ketiname daryti visi taip greitai, suvokti, kad beveik kiekvienas semestrą, beveik 90% studijuojančiųjų CS50, įskaitant tuos, kurie niekada užprogramuotas anksčiau, galų gale padaryti galutinius projektus, yra pagrįsti žiniatinklio programavimo. Ir tokiu būdu jūs pamatysite, kad grįžta yra daug ateinančias savaites. Taigi mes matome, jums tada pirmadienį. 

SPEAKER 1: O dabar, Deep Mintys pagal Daven Farnham. Hash lentelės. 

[Juokas]