[Mūzikas atskaņošanai] DAVID J Malan: Labi, welcome atpakaļ. Tas ir CS50. Tas ir beigas nedēļas septiņi. Un tas ir beigas šī aizvācēju medības no problēmas noteikti četri ka jūs varētu atcerēties. Pēc atgūšanās visu šie JPEG personāla, Jums bija apstrīdēti, ja vēlaties, nofotografēt sevi ar tik daudz no tiem ļaudīm, kā jūs varat. Mēs saņēmām veselu ķekars iesniegumus pēdējo nedēļu laikā, tiešām, diezgan maz tieši pirms pusdienlaika šodien, no kuriem daži ir tie šeit, nozvejoti šeit in-- izskatās like-- Annenberg Hall darba laika, vienu šeit Lowell namā ar Nick. Lūk Ramon pieķeršanas pa tālruni. Tas bija pie CS50 pusdienām. Tas bija Jason skyping ar radošāku klasesbiedrs, kurš piezvanīja viņam šādā veidā. Mēs nezinām, kas tas bija. [Smiekli] DAVID Malan J: Bet ka ir vērts gigabaitu. Te ir Chang, kurš burtiski skrēja off stadijā lai izvairītos no fotografēja vienu diena, bet galu galā tika noķerti. Šeit ir Nick. Šeit ir Nick. Šeit ir Nick. Un šeit ir Alison pa laukiem. Un Zamyla pat netika atrasts pie balles konkursā. Tātad mums būs jāiet cauri šīs fotogrāfijas, izdomāt kurš iesniegts visvairāk agrākais, un atlīdzība viens pasakains balvu, kā solīts spec. Un mēs arī sekot par telpa, kas bija iesaistīta. Pāris announcements-- tāpēc pusdienas ir, atkal, šo piektdien pie 13:15. Ja vēlaties mums pievienoties, RSVP tajā URL šeit. Jason atkal parādās šeit no viena no sadaļām pāris gadiem atpakaļ, kas notika krist uz Halloween. Un tiešām, viņš ģērbušies kā ķirbju, ka īpaša gadā. Ja jūs skatīties šo sadaļu Viņa no 2011. nodaļā astoņas, ja jums ir interese, pie CS50.tv, es domāju, ka tas bija gads, kad viņa gaisa sūknis strādā. Ja pēc tam skatīties Līdzīga sadaļā 2012. gadā, jūs redzat šo Jason daudz deflāciju, jo uzvalks vairs darbojās, kas ir tikai teikt šo piektdien, ja jūs vēlaties patīk grebt ķirbju ar Daven un Gabe un citi, RSVP uz galvām pie cs50.harvard.edu adresi. Tas solās būt ļoti jautri. Daven, mēs teicis, ir cirsts Ķirbji visu savu dzīvi. Gabriel no Brazīlijas nekad cirsts ķirbju par Halloween. Tāpēc esiet tur ar viņiem, kā viņš mācās. Semināri, meanwhile-- tāpēc jūs uzzināsiet drīz par to, ko mūsu cerības ir par galīgais projekts, kas būtībā būs vārīties uz leju, lai Izstrādājot un īstenojot lielākā daļa jebkuru projektu, kas interesē Jūs, kaut arī jāapstiprina un norādījumus no sava mācību puisis. Nogalē semestris, mēs ieviest vairākus Semināru, kas ir izvēles nodarbības ar mācību stipendiātu un Harvard vadīja darbinieki, draugi Kursa pāri Campus, par dažādām tēmām, kas ir tangenciāla Protams, ir pamatā mācību programma bet tomēr gadījumā, jautri, un atšķirīgs potenciālajiem tiešajiem projektiem. Piemēram, pirmkārt, ja vēlaties reģistrēties, galvu uz šo URL tur. Un tas ir lineup šogad semināri vien. Bet saproti, mums ir desmitiem semināri no gadu iepriekš, kas visi ir saistīti ar Semināri izvēlnē iespēja kursa mājas lapā. Tātad, ja jūs domājat par pārsniedzot savu komforta zonu vai pacelt dažas jaunas prasmes, piemēram, programmēšanas iPhone progr ar Swift, jaunu valodu no Apple vai mērķa-C vai Android apps vai plānošanas [? cue?] spuldzes, vai kādu no tēmām šeit un vairāk, jo pārbaude out reģistrācijas lapā. Tā mēs sākām un noslēdzās Pirmdiena ar meklē HTTP. Tik ātri refresher-- HTTP, Hiperteksta pārsūtīšanas protokols. Bet ko tas īsti nozīmē? Ko tas īsti nozīmē? Ir tas, ka roku? Es zinu, ka tu esi tikai nesaskrāpē galvu. Bet jūs vēlaties ierosināt kāda HTTP ir? Mērķauditorija: Kā datori sazināties ar [nedzirdama]. DAVID Malan J: Es nokavēju pēdējo daļu. Kā datoriem sazināties with-- Mērķauditorija: Interneta serveri. DAVID J Malan: Good-- ar internetu serveri, un konkrēti, web serveri. Jo atsaukšanu, tur ķekars pakalpojumi internetā, no kuriem daži jūs izmantojat, iespējams katru dienu no tērzēšana un ziņa, čats, un interneta un e-pasts, un tamlīdzīgi. Un HTTP ir tikai protokols, kas interneta pārlūkprogrammas runā, sazinoties ar web serveri, un otrādi. Un analogs Cilvēka pasaule varētu būt, Es paplašināt manu roku, lai krata dažas citu cilvēku s, un viņš vai viņa atzīst, attiecinot viņa vai viņas roku, kā arī. Tātad tas ir tikai protokols, kopums konvencijām. Un kādi tiešām ir šie konvencijas? Nu, tā vienkārši vārīties uz leju, lai nosūtot ziņojumus uz priekšu un atpakaļ, kā mēs attēlots šeit. Un tur ir pāris veidos kuru jūs varat sūtīt šos ziņojumus. Un, iespējams, visvairāk bieži ir pazīstams kā saņemt. Un mēs redzam kontrastu tam pirms ilgi. Bet get pieprasījums no pārlūka serverī tāpat izskatās šādi. Tas ir ķekars teksta, ka tas liek iekšpusē virtuālo aploksnē. No ārpuses šīs aploksnes iet pāris gabalus detaļām. Kas nepieciešams, lai dotos uz aploksne, tā sakot, lai saņemtu, piemēram, pieprasījumu tas no manis uz web serveri? Yeah. Mērķauditorija: Jūsu IP adrese. DAVID Malan J: Mana IP adrese From laukā, tā sakot, un, protams, saņēmēja IP adresi. Bet gadījumā, ja web paketes, mums ir nepieciešams nedaudz sīkāk Tas nav pietiekami, tikai Uzrakstīt aploksni ar serveri, jo tas serveris varētu būt klausoties dažādu veidu interneta satiksmes. Tātad, ko vēl mums vajag bez saņēmēja IP? Yeah? Mērķauditorija: Vai tas ir TCP? DAVID J Malan: Labi. TCP-- AUDITORIJA: adrese. DAVID J Malan: adrese, vai osta, kā to sauc. Tuvu, bet TCP porta numuru. Un tur ir ķekars no tiem. Bet, protams, visvairāk pazīstami vajadzētu beidzot 80, kas ir noklusējuma viens izmanto interneta satiksmes. Un vēl viens pazīstams viens drīz būs 443, kas tiek izmantots Secure Web satiksme, URL, kas sākas ar https. Tātad, tas ir tas, kas notiek iekšpusē šī aploksnē. Un saņemt / tikai nozīmē, dot mani noklusējuma mājas lapā. Dodiet man saknes cieto braukt uz šo web serveri. Un, cerams, web serveris atbildēt ar, OK un numurs 200, kas ir tikai konvencija sakot, jā, visi patiešām OK. Lūk lapā. No mājas lapas tips ir gatavojas būt teksts, bet precīzāk, HTML, kas mēs esam par to, lai nirt atpakaļ. Un dot dot dot tikai līdzeklis, šeit ir HTML. Un tas ir, ja mēs uzņemt stāstu šodien, faktiski rakstot HTML, Hiperteksta iezīmēšanas valoda, kas ir valoda, kurā Web lapas tiek rakstīts. Tas nav programmēšanas valoda. Nav funkcijas vai cilpu vai apstākļiem. Tas ir iezīmēšanas valoda, kā arī atkal redzam šodien, kas ļauj norādīt kā strukturēt un stylize estētiski mājas lapa. Tātad tas bija viens un tikai lapas mēs patiešām paskatījās, ja īsi, pirmdien. Un paziņojums daži spilgta īpašības. Tur ir daudz atvērtas leņķveida kronšteinu un cieša leņķiekava. Starp tiem, leņķveida iekavās ir vārdi. Un mēs ejam, lai sāktu aicinot šos vārdus tagus. Tik atvērta kronšteins galvu un slēgta kronšteins galvu ir atvērtas un slēgtas tagus, vai sākuma un beigu tags attiecīgi, HTML elements, kā mēs to saucam, ko sauc par galvu. Un tas pats attiecas žargons ķermenim HTML un tā tālāk. Un, kas ir jauki, ir HTML-- un, protams, mēs tērēt šausmīgi maz laika par to, jo jūs pārsvarā tikai izdomāt kādas funkcijas tas ir tad, kad tevi faktiski ir konkrēta problēma lai solve-- jūs atradīsiet, ka pārlūks ir diezgan muļķīgi. Tas ir tikai gatavojas do-- nav atšķirībā computer-- ko jūs liekat darīt. Un tad, kad jums ir atvērts kronšteins HTML pašā augšā tur, ka būtībā tikai nozīmē, hey, pārlūku, šeit nāk mājas lapā rakstīts HTML. Kad tas redz atvērtu skavu galvu, tas tikai nozīmē, hey, pārlūku, šeit nāk galvu, vai augšējais daļa manu mājas lapā. Kad redz, slēgtu kronšteinu galvu, tas tikai nozīmē, hey, kas ir to galvu. Gaidstāves kaut ko citu. Un ka kaut kas cits ir acīmredzot būs ķermenis. Un, ja jums nav tagu, piemēram, Jums ir tikai Sveiki, komats, pasaule, kas ir tikai būs neapstrādāta teksts, kas galu galā tiek parādīts ekrānā. Tagad, jūs pamanīsiet arī atkāpes šeit. Jūs varat droši secināt kā mēs esam stylizing to. Katru reizi, kad es atvērt tagu, tā sakot, es atkāpi. Un katru reizi, kad es aizvērtu tag, es ANO ievilkumu, līdzīgs garā uz cirtaini lencēm. Un tālāk, es esmu veida izmantojot manu spriedumu. Ievērojiet, ka man nav apnikt hitting Ievadiet iekšpusē šo nosaukumu tag. Kāpēc? Nu, es vienkārši nolēmu tas izskatījās nedaudz tīrāku man, cilvēkam, vienkārši nav apnikt darām. Tātad vēlreiz, tur ir daži spriedums aicina vienkārši piemēram, tur ir C vai jebkurā valodā. Bet paziņo arī, ka šis iegriezums pakļauj sevi garīgās modeli, ne vairāk sarežģīt to. Bet koks, labi? Ja jūs domājat par web lapa, acīmredzot rakstīts piemēram, tas, kā labi izrobota, ka veids, Jūs varat gandrīz iedomāties atklātā kronšteinu HTML slēgta kronšteins tag norobežošanu saknes mezglu, ciltskoku stils mezglu stilā koku mēs paskatījās pagājušajā piektdienā. Un tiešām, mums ir uz tieši šeit tas, ko mēs saucam DOM, D-O-M, dokumentu objekta modelis, iedomātā veids, kā pateikt koks, kas pārstāv šo HTML. Un paziņo, ka HTML ir, mēs sakām, kā ģimenes koks, diviem bērniem. Pa kreisi ir galva. Pa labi ir ķermeņa. Un tāpat kā neprātīgs domas izmantošanu, vadītājs, protams, ir, cik daudz bērnu Saskaņā ar šo struktūru? Tātad tikai viens, title-- un tas ir iemesls, kāpēc mēs esam bulta iet no galvas uz titulu. Tātad, tas ir, it kā šīs personas ciltskoks bija tikai viena pēcnācējus. Un tad pats nosaukums var var teikt, ka bērns ir pārāk. Atgādināt, ka HTML bija sveiki, komats, pasaule zem tā. Un es esmu vienkārši izdarīt to laikā ovāls vietā ir taisnstūris tikai nodot semantiski ka, lai gan tas mezglu koku, tā sakot, tas ir sava veida būtiski atšķiras. Tas nav tag. Vai vairāk, pareizi, tas nav elements. Tas ir tikai teksts mezglā, ja Jums gribas. Bet tie ir pilnīgi patvaļīgi cilvēka konvencijas. Tas ir tikai tagad mans veids pārstāv, ko es ņemšu kā kopsummā zvaniet dokumentu. Un kā malā, lieta at super augšējā kreisajā stūrī, atklāts kronšteins izsaukuma zīme doc tipa HTML, tas izskatās tag, bet tas ir stulbi stūra gadījumu, kad tas ir tikai tur, kopēt un ielīmēt norādīt pārlūkiem tas ir HTML versija 5. Pasaule nepārtraukti mainās, kāda Pirmajā rindā kodu lapā vajadzētu būt. Tas tikai nozīmē versiju 5. Tātad tas nav gluži izskatās citi. Visas tiesības, lai ar to teica, jūs tagad appreciate tas diezgan šo stulba tetovējums kāds dabūja. [Smiekli] DAVID J Malan: Labi, un tagad pieņemsim faktiski dive darot kaut ko ar to. Jums atgādināt, ka pēdējo reizi Es atvēra CS50 Appliance un es tomēr kaut kā vienkārši, kā atverot gedit. Un es saglabāts fails pat mans desktop-- nekur special-- kā hello.html. Tāpēc ļaujiet man darīt again-- hello.html Enter. Un tagad šo failu, es esmu gatavojas iet uz priekšu un atkārtot to, ko mēs tikko saw-- doc tipa html Tad es esmu gatavojas do atvērta kronšteins html slēgtā kronšteinu. Un tad es esmu gatavojas preemptively atvērt un aizvērt tagu. Kāpēc? Tieši tāpēc es neaizmirstiet vēlāk. Tas ir tikai laba prakse, piemēram, atverot un aizvēršanas cirtaini bikšturi visu uzreiz. Un tad nāca nākamais? Jūs varat domāt par tetovējums. Mērķauditorija: galva. DAVID J Malan: galva. Un pēc tam, kas šeit, es bija nosaukums, es domāju. Un nosaukums bija patvaļīgi, hello, pasaule tuvu virsraksts. Un tad uz leju šeit, ķermenis, no course-- tad mēs aizveriet ķermeņa tag. Un tad tikai nedaudz lieki, Man bija tas pats uz leju šeit. Tāpēc es apgalvo, ka tas ir mājas lapa. Tas ir kaut kas tagad varētu dzīvot tīmeklī, kaut gan, protams, tas ir burtiski dzīvo uz mana galda tieši tagad. Bet, protams, ja es samazināt gedit, Tiksimies uz mana galda tās ikonas. Pat ja tas ir ierīce, jūs varētu darīt uz Mac OS bez TextEdit vai Logi ar Notepad pat. Un, ja man iet uz priekšu un divreiz noklikšķiniet ka pat, un select-- labi, pieņemsim neizvēlēties, ka tāpēc Chrome nevar atvērt. Iesim uz priekšu un atvērt Chrome. Un pēc tam darīt Komandu-o atvērts Un virzītos uz mana galda un atvērt šo failu. Tas ir veids, kā pārlūkprogramma interpretē HTML, no augšas uz leju, no kreisās uz labo. Hey, pārlūkprogramma šeit ir HTML. Lūk galvu. Lūk titulu. Lūk ķermenis. Un tiešām, tas ir, kā tas padara šo mājas lapu. Bet paziņojums URL. Neviens no jums varētu uzvilkt šo specifisko lapa jūsu klēpjdatorus tieši tagad, pat iekšpusē jūsu Ierīce ar šo URL, jo failu: // norāda, ka tā ir faktiski par manu failu sistēmā, mans cietais disks, nav jūsu. Tātad tas nav viss, kas noderīgs. Pieņemsim tagad pāriet uz izmantojot faktisko web serveri. Un izrādās, ka CS50 Appliance ir vairāk nekā tikai tādā vidē, kur Jūs varat rakstīt C kodu un apkopot un palaist to, kā jūs esat darījis. Tas arī ir uzstādīta darbinieki pārstāvēt tipisku web serveri, kas ir internetā, viens, ka jūs varētu maksāt par vai viens, kas ir ar tā saukto mākoni. Un tas darbojas standarts bezmaksas atvērtā koda programmatūru, piemēram, kaut kas sauc Apache, kas ir iespējams, joprojām populārākais interneta servera programmatūras pasaulē ka tūkstošiem tīmekļa vietnes izmanto šodien. Un tas arī vēl ir programmatūru, piemēram, MySQL, kas ir datu bāzes serveri ka mēs beidzot nokļūt, kas ir tikai teikt Es varu sākt ārstēt mans iekārtu kā pilnvērtīga serveri ka es neesmu maksājot par citur. Tā vienkārši dzīvo uz mana klēpjdators attīstības un ērtības nolūkos. Tāpēc iesim uz priekšu un izmantot šo. Es esmu gatavojas iet uz priekšu un atvērt termināla logu. Un es iešu uz priekšu un move-- patiesībā, vispirms es esmu gatavojas, lai virzītos uz manu desktop. Ja man ls, tur ir hello.html. Un es iešu priekšu un sākt izmantot Jaunais katalogs mēs esam nav izmantotas pirms šodien. hello.html-- Es esmu gatavojas pārvietot lai ../vhosts virtuālās hosts-- vairāk par ka future-- un pēc tam direktoriju sauc localhost, kas ir segvārds dots gandrīz jebkura datora, vai tas ir Mac, PC, vai Linux datoru, un pēc tam īpaši uz direktoriju, ka mēs, darbinieki jau radīts jums, kad jums lejupielādēt ierīci, ko sauc par sabiedrības. Un, jo tā nosaukums liecina, neko Man šajā mapē, teorētiski, būs tagad būs valsts, vismaz uz cilvēkiem, kam ir tieša savienojums ar manu datoru. Tāpēc tagad ļaujiet man iet uz priekšu un do cd ar šo pašu direktorijā lai es varētu redzēt, kas ir notiek un tipa ls. Un tiešām, tas ir Vienīgais, kas tur. Es apgalvo, ka šobrīd, jo man ir nodot šo failu hello.html iekšpusē direktoriju sauc sabiedriskā iekšpusē direktoriju sauc localhost iekšpusē direktoriju sauc vhosts, kas pateicoties CS50 darbiniekiem ir iepriekš konfigurēta, lai būtu sakne jūsu tīmekļa servera, Es tagad var cerams izdarīt. Es esmu gatavojas atvērt jaunu cilni. Un es iešu nevis uz failu: //. Es esmu gatavojas izmantot faktisko http / localhost, kas atkal, ir segvārds par savu serveri. Un tad es iešu uz to, kas faila nosaukumu, tikai, lai būtu skaidrs? Ja ir šis stāsts, iespējams, gatavojas? hello.html. Tātad citiem vārdiem sakot, es gribu tagad šis ir mana datora, mana ierīce, it kā tas faktiski serveri. Tās segvārds ir localhost. Bet domāju par localhost, kā, piemēram, Facebook.com google.com, neatkarīgi. Tas ir tikai mans vietējais nosaukums. Un tad galīgais es gribu, ir sakne no cietā diska, tā sakot, vai sakne web serveri, ergo ar slīpsvītra, un tad faila nosaukumu hello.html. Ļaujiet man tālināt un hit Enter. Un tiešām, tagad ir mana mājas lapa. Tātad, tas ir nedaudz atšķirīgs. Un tas ir tikpat underwhelming. Tas ir vecā versija. Ļaujiet man sarukt fontu atpakaļ. Tas ir vecs. Tas ir jauns. Bet to, kas būtībā notiek Tagad ir tā, ka HTTP tiek izmantots. Veidosim šo nedaudz vairāk skaidrs, vai, ja jūs, nedaudz sarežģītāka. Ļaujiet man iet uz leju pa labi stūrī manu ierīci. Un paziņo, ka tas viss laiks, tur ir bijis numurs. Tas ir unikāla adrese Jūsu CS50 Appliance. Tas ir privāts adrese, uz ko norāda 172,16, kas tikai nozīmē tikai jūs fiziski var piekļūt šo tīmekļa serveri. Viss ir firewalled un labi aizsargāti no pārējās pasaulē, jo tas risina. Un tagad paziņojums, lai gan, ja es eju uz šī adrese, nav manā ierīces, bet Mac OS-- es dodos doties atpakaļ nekā šeit. Šī ir mana Mac tagad. Un tagad es esmu gatavojas atvērt šī versija Chrome šeit. Un es iešu uz http: //172.16.25 / Un es aizmirst rest-- 133. Tāpēc es esmu gatavojas apmeklēt no mana Mac ka IP adrese /hello.html Enter. Un tagad es redzu no sava Mac ka mana CS50 Appliance, kurš ir IP adrese ir, ka numurs, patiešām uzvedas kā tīmekļa serveri internetā. Tas nav jauki viegli atcerēties nosaukumu, piemēram, Facebook.com, bet tas ir, izmantojot HTTP acīmredzot, kaut Chrome ir sava veida vienkāršot pasauli mums, bet nerāda mūs HTTP. Bet tas ir tiešām tieši tā. Chrome ir tikai ietaupīt dažus taustiņsitienus šajās dienās. Un tas, ko mēs tagad redzam. Tā ka viss ir labi un labi. Bet tas ir diezgan underwhelming lapā. Ļaujiet man iet un kaut ko darīt nedaudz savādāka. Tāpēc ļaujiet man iet atpakaļ uz gedit. Un tā vietā, sveiki, pasaule, pieņemsim likts attēlu. Un es pieprasīja no before-- ļaujiet man iet manā localhost direktoriju sabiedrībai. Un ļaujiet man iet uz priekšu un kopēt viss ķekars failus no šodienas no mana Dropbox mapē uz šeit. Tagad, ja es tipa ls, meklēt pie visiem šiem failiem ka es esmu izplatījis Protams, mājas lapā pirms šodien, no kuriem viens vēl hello.html. Tātad tur ir, ka viens. Un atcerēties šo dumjš vienu no pagājušā LAIKU_ cat.jpg. Tāpēc ļaujiet man mēģināt, lai iegultu cat.jpg iekšpusē manu mājas lapā. Es esmu gatavojas iet uz priekšu un darīt cat.jpg, saglabājiet. Ļaujiet man iet atpakaļ uz Chrome. Un ļaujiet man tuvinātu fontu un tagad pārlādēt. Ups, ja man tas? Standby-- Man joprojām ir vecais versija no mana desktop atvērts. Tāpēc ļaujiet man iet manā vhost, mans localhost, mana publiskā un hello.html. Tāpēc tagad ļaujiet man iet uz priekšu un saka cat.jpg iekšpusē ķermeņa kur es gribu, lai to parādīts un pārlādēt. Protams, tas nav pareizi. Tāpēc man ir nepieciešams, lai pastāstītu pārlūku nedaudz vairāk apzināti to, ko es gribu to darīt. Vienkārši ierakstot vārds ir acīmredzot nav pietiekams. Tik atceros, ka tur bija vēl viens tag, attēlu, img par īsu. Tas ir tikai tāpēc, ka cilvēki nepatīk tipa pilnus vārdus. Un tad mēs varam darīt avots = "cat.jpg". Un tagad es esmu gatavojas darīt viena lieta atšķirīgs šeit. Pat ja visi Mūsu tags līdz šim ir bija šo jēdzienu sākuma tagu un beigu tagu, kas nav īsti darīt sajūtu par attēlu, vai ne? Attēls ir vai nu tur, vai tur nav. Un tāpēc cilvēki ir ieradušies klajā ar vienkāršāku konvenciju. Ja jums ir tag, kas var gan sākas un beidzas tajā pašā LAIKU_ tā var būt tukša, tāpēc, lai speak-- vienkārši ielieciet slīpsvītra iekšpusē taga pašās beigās. Tagad ļaujiet man iet atpakaļ uz manu pārlūku. Rezultāts Reload Damn, kaut kas ir nepareizi. Jūs, iespējams, esat redzējis šo dažkārt tīmeklī, pat tad, ja tas nav bijis jūsu vaina. Tas ir web servera vaina. Kas odes tas, šķiet, norāda? Tas ir sadalīti. Tas ir, ja attēla pieder. Yeah? Mērķauditorija: Bet tas nav ir piekļuve attēlam. DAVID J Malan: Tas nav ir piekļuve attēlam. Tas, vai vēl ļaunāk, varbūt tas nav pat neeksistē. Let 's redzēt, ja mēs nevaram diagnosticēt to. Atceros no pēdējo reizi, ka, ja Chrome, ierīcē, vai pat uz jūsu Mac vai PC, doties uz Developer izvēlni un iet uz Developer Tools variants, kas, iespējams, jūs esat neizmanto daudz vai jebkad. Un, ja es eju uz Network un pārlādēt lapu, pieņemsim faktiski apskatīt HTTP pieprasījumi, kas tiek veikti. Izskatās hello.html ir tiešām OK, tātad 200. Bet cat.jpg ir 403. Tātad, tas nav 404. Fails, iespējams, eksistē. 403 ir aizliegta. Tātad tas ir mazliet mulsinoši. Es esmu gatavojas doties atpakaļ uz manu termināļa loga. Ļaujiet man tuvinātu šeit. Un ļaujiet man darīt ls. Tur ir tie paši faili. Tagad ļaujiet man darīt ls-l, kas jūs esat, iespējams, izmantot pirms apskatīt failā izmēri varbūt vai timestamps. Un mēs redzam veselu ķekars milzīgs informācijas. Bet paziņojums dažas detaļas. Lūk hello.html šajā rinda šeit un šeit ir cat.jpg. Un tas ir tikai ierīce ir lietotājam draudzīga, uzsverot JPEG s purpura kā šis. Bet to, kas vēl ir atšķirīgs blakus faila lielums un faila nosaukumu? Mērķauditorija: [dzirdams]. DAVID J Malan: Jā, tur ir vēl divas R vairāk nekā šeit. Paziņojums, ko hello.html jau notiek. Tātad izrādās, ka vārda Šis katalogs sabiedrība ir svarīga. Jebkas šajā direktorijā ir domāts, lai būtu publiski. Bet tas nav pietiekami, vienkārši nomest failus tur. Jūs arī ir nepieciešama, lai mainītu veidu failiem, mainīt atļaujas failu aktīvi nav ir noklusējuma iestatījums, kas ir tas, ka tikai es varu izlasīt un rakstīt to, es to īpašnieks. Es gribu visu pasauli ikvienam varētu lasīt manu failu, lai runāt. Lasīt tikai nozīmē to aplūkotu. Un tiešām, kā jūs redzēsiet problēmas noteikt septiņus, ka tas, ko šie R vidējā. Šie divi R vidējā ļaut ikvienam citur pasaulē arī lasīt to, it īpaši tagad, tas ir šajā direktorijā. Tāpēc vienkāršākais veids, kā noteikt šo ir iet uz manu uzvedni un darīt chmod pārmaiņām režīmā, un tad darīt + R, vispār, visi, visi, kā arī r lasīšanas, un tad cat.jpg Enter. Nekas, šķiet, lai notiktu, kas parasti ir laba lieta. Tātad ls-l again-- tagad aplūkosim cat.jpg. Un šī atļauja šķiet, ir mainījusies. Kā malā, ja jūs veicat kļūda un tu, piemēram, tikko veikts your-- Man nav know-- eseju publiski pieejamu nejauši, jūs varat darīt pretējo, chmod a-r. Lai gan godīgi sakot, to nevajadzētu būt publiskajā direktorijā anyway, ja tas ir bažas. Tāpēc tagad iesim atpakaļ uz mans pārlūku un pārlādēt. Un es esmu gatavojas klikšķi maz Ghostbusters simbols skaidrs, ka daļa ekrāna, lai mēs varam redzēt jaunus pieprasījumus. Un, protams, šeit ir Grump Cat no agrāk. Bet vēl svarīgāk, tehniski ir numurs 200, kas nozīmē, ka mēs saņēmām tas ir OK. Viss ir labi, tā ka viss ir labi un labi. Bet mēs esam ne padarīt labākais no mājas lapas, arī mēs centīsimies pārāk grūti padarīt fanciest mājas lapas šodien. Bet pieņemsim vismaz kaut ko darīt super pazīstami pirms grabošs off dažiem citiem tagiem. Tātad pieņemsim, ka man nav tikai gribu kaķi šeit. Pieņemsim, ka es tiešām gribu šo kaķis saiti uz kaut ko. Es varētu, piemēram, darīt kaut kas līdzīgs šim. enkura href par hiper atsauce equals-- un pieņemsim tikai kaut ko darīt piemēram, www.google.com noslēgumam citēt ciešu kronšteinu. Un tagad meklēt kaķiem. Aizvērt enkura tag. Tāpēc šī ir tikai viena veida principiāli jaunas detaļas. Protams tag, ir atšķirīgs. Tas ir vārds, lai enkurs href vai hiper atsauces. Bet vēl svarīgāk, šī sintakses iezīme šeit. Tas ir tas, ko mēs sāksim zvanot nav tagu, bet atribūts. Un atribūts ir kaut kas maina uzvedību tag. Un šis raksturlielums, href, līdzekļi mainīt uzvedību šī enkura lai tad, kad tas ir uzklikšķināt, tā iet uz šo URL šeit. Un, protams, ka URL ir Google. Tikmēr, kas tas ir tekstu šeit būs? Nu, kas notiek, lai būtu kāda cilvēka faktiski redz kā pasvītrots link, tik vienkārši. Tātad, pieņemsim mēģināt šo. Ļaujiet man to saglabāt. Es esmu vēl hello.html. Bet versijās tiešsaistē, jūs redzēsiet faktiskie failu nosaukumi mēs iepriekš sagatavotas. Ļaujiet man iet uz priekšu un pārlādētu. Un tagad tas ir ļoti underwhelming lapa joprojām. Bet, ja es lidināties virs there-- un tas ir pārāk mazs, but-- jūs varat redzēt apakšā kreisajā stūrī ekrāna, tas patiešām gatavojas google.com. Un, ja es uz to, ka tā būs noslaucīt man ceļu uz faktisko Google. Bet paziņojums šeit iespēja izmantošanu, tāpat kā malā. Un mēs būsim atpakaļ uz otru jautājumi par nodrošinājumu pirms ilgi. Tāpēc, ka tur ir šis dalījums starpā, kur iet un ko jūs sakāt, jūs varētu darīt kaut ko līdzīgu this-- http://www.google.com. Labi, un tagad, ja man pārlādēt Pēc glābšanas šo lapu, izskatās, ka es iešu uz Google. Bet tur nav iemesls, kāpēc es jādodas uz Google, vai ne? Es patiešām varētu iet uz kaut ko līdzīgu badguy.com, pārlādēt lapu nekā šeit. Un paziņojums, tā joprojām izskatās Google. Un tikai tad, ja es esmu asu pietiekami, lai lidināties virs šeit es redzu, ka ir pat gatavojas iet uz citu vietu. Tātad, ja jūs esat kādreiz gotten e-pastu, jo īpaši viens no Paypal, vai šķietami no Paypal lūdz jums, lai pieteiktos savā kontā, šis ir iemesls, kāpēc jums vajadzētu nekad kādreiz uz saitēm e-pastos, godīgi sakot, jebkuras saites e-pastiem. Ja jūs zināt, jums ir faktiskais naudu Paypal vai bankas Valstīm vai Fidelity vai kādu mājas lapa, manuāli ierakstiet to. Jo izskatās, cik viegli tas ir, lai triks kādu cilvēku iepazīstinot kādi izskatās saiti. Bet tas tiešām varētu iet pilnīgi visur. Un tur ir daudz lielāka draudu nekā šis. Faktiski, tas ir mazliet par pieskari tagad, bet viens no labākajiem es kādreiz redzēju kas kopš tā laika ir slēgta, ir kāds vadīja cilvēki kuri paredzēti, lai tas varētu teikt, klikšķiniet šeit, lai piesakieties kontu, bankas konta. Un tas bija Bank of Rietumiem. Lai kāds nopirka to. Un tas ir mazliet vieglāk, lai redzētu tas ar mono izvietotas fontu pietuvināto kas par 30 pēdu projektoru. Bet, kad tas ir mazs fonts e-pastu, ka jūs saņemat, tas izskatās bankofthewest.com, nav bankofthevvest.com, kurā kāds bija samaksājis 10 $ nopirkt. Un tad tas noveda viņus ekvivalents kādu slikti mājas lapā. Un jūs redzēsiet too-- patiesībā mēs varam darīt this-- ja es eju uz faktisko mājas lapā, bankofthewest.com, atkal, atsaukšana no pēdējo reizi ka, ja tas ir viņu mājas lapa un jūs esat ziņkārīgs par to, kā tā darbojas, Jūs, protams, varat doties uz Chrome izstrādātāju rīki. Un jūs varat redzēt visu HTML labi tur format. Bet vēl līdz punktam, Jūs cam-- pieņemsim aizvērt this-- jūs varat doties uz View Izstrādātājs View Source. Kāpēc es tikai kopēt viss, kas Un tad es var iet manā maz gedit logu šeit un padarīt savu mājas lapu. Saglabājiet šo hello.html. Un, iespējams, tas notiek, lai izjauktu, jo tas nav tik vienkārša parasti. Bet tagad, ja es pārlādēt savu lapu mana CS50 Appliance un hit reload, Labi, daži sīkumi lauza. Bet es esmu diezgan tuvu, lai ar mana bankas mājas lapā, vai ne? Tas viss HTML-- [Smiekli] DAVID J Malan: --I nav actually-- un jūs zinu, ka ir kāds, kas tur, kas faktiski noklikšķiniet uz šīm saitēm too. Tik skaidri, daži sīkumi lauza. Bet tas notiek, lai vadīt mums uz diskusiju, nevajadzīgi tieši tagad, par to, ko CSS, kaskādes stila lapas, ir, un kā jūs faktiski lejupielādēt citus HTML failus un JPEG failus GIF failus, kas mājas lapa varētu būt, izmantojot. Bet tas viss ir accomplishable. Bet tas tiešām vārīties uz leju, lai šie ir ļoti vienkāršas heuristics. Tāpēc tagad pieņemsim tikai nosmelt cauri pāris citiem piemēriem HTML tikai, lai dotu jums sajūtu par to, ko vēl jūs varat darīt. Tā, piemēram, tas ir list.html. Pieņemsim, ka es gribēju, lai mājas lapā sarakstu ar māju quad. Es varētu izmantot ul frāzi Nekārtots sarakstu un tad saraksta punkts bērns un tad atkārtot over-- vai saraksta, rather-- māju jautājumu. Un, ja es atvērtu šo augšu, pieņemsim to izdarītu. Iesim nav hello.html, bet list.html. Damn it. Kā es varu noteikt šo? Tas ir tas pats jautājums kā agrāk, vai ne? Tāpēc ļaujiet man darīt chmod-- oops-- chmod + r no list.html. Un tagad, ja es atgriezīšos savā pārlūkprogrammā un noklikšķiniet uz pārlādēt, tur tas ir. Tātad, ja jūs esat kādreiz gribēja, lai padarītu aizzīmēm sarakstu, jūs varat darīt to. Ja jūs vēlaties būt super iedomātā un padarīt lika sarakstu, nevis Nekārtots saraksts mainīt tās, ola, pārlādēt lapu, un Tagad pārlūkprogramma numuru to you. Ko vēl mēs varam darīt? Nu, pāris others-- ja tev ilgi rindkopas text-- piemēram, daži Latīņu teksta tāpat this-- un jūs vēlaties to atsevišķos punktos, open p, netālu p par tag punktu. Un darīt to atkal un atkal. Un, ja es tagad atvērt šo failu, paragraphs.html, labi, tas kļūst kaitinošas. Tāpēc tagad pieņemsim tikai iet atpakaļ uz manu ātru, chmod a + r r zvaigzne .html-- jauku maz wild card tā runāt. Tā vajadzētu noteikt visas šīs problēmas man. Pieņemsim pārlādēt. Tur ir trīs punktus. Un tagad iesim uz priekšu un atvērt vienu otru. Kā par galda? Jūs pamanīsiet galda izskatu nedaudz sarežģītāka. Bet tas ir tas pats idea-- open tag, open tag, atvērts, atklāts, atvērt, aizvērt tag, atvērts tag. Un tie notiks kandidēt galds, kuru robeža ir acīmredzami būs biezums 1-- neatkarīgi ka means-- galda rinda, galds dati, kas nozīmē šūnu. Un, ja es dodos atpakaļ uz manu pārlūku šeit un doties uz table.html, Jūs varat redzēt kaut ko kā šis, pretīgs. Bet mēs nokļūt līdz vietai kur mēs varam reāli padarītu lietas prettier nekā. Tāpēc ļaujiet man izvirzīt tagad. Tur ir ķekarus atslēgvārdus. Un HTML ir brīnišķīgi uzņemt jo, godīgi sakot, viss, kas jums jādara ir apskatīt esošās mājas lapas ar kuru jūs esat iepazinušies. Un jūs, piemēram, ak, tas ir, kā viņi to estētiski. Vai jūs varat meklēt jebkurā tiešsaistes resurss, kā HTML darbojas, un jūs redzēsiet, ka tur ir Visa vārdnīca citu tagus. Bet ar vienkāršu garīgo modeli vien, ka gandrīz jebkura etiķete atverot ir jāslēdz, tas tiešām nav pietiekams, lai mācītu sevi HTML pēc saprast Šie pamata idejas tagus un atribūtus un labi formedness ka mēs esam runājuši par, slēdzot kaut kas mēs varētu atvērt lai mēs nejauciet pārlūkprogrammu. Tāpēc pieņemsim tagad ņemt to daudz interesantu līmeni dodoties uz faktisko. Un iesim uz manu Mac šeit, lai google.com. Un tagad notice-- pieņemsim darīt. Es esmu gongs iet uz Uzstādījumi Meklēt Settings. Es gribu, lai izslēgtu šo kaitinošas instant rezultāti lieta, kur tas uzreiz sāk reaģēt uz jūsu rakstīt. Darīsim šo vecāku skolu, lai mēs tiešām redzētu, kas notiek. Tāpēc es esmu gatavojas, lai saglabātu manu Google iestatījumi šeit. Un tagad notice-- es esmu gatavojas meklēt kaut ko līdzīgu kaķiem. Un tas joprojām dara auto pilnīga šeit, bet gan balstoties uz lietām cilvēki ir drukāti pagātnē. Bet paziņojums par to, kas notiks. URL brīdī tas ir, tikai google.com. Un tehniski, tas ir slīpsvītra. Google ir tikai ietaupot raksturs un nerāda to mums. Tie rāda mums https, vienkārši būt super pārliecinoši, ka mēs esam par drošu un šifrētu lapā. Tāpēc ļaujiet man iet uz priekšu un meklēt kaķiem. Tagad šis saņēmu tiešām milzīgs ātri. Paskaties garumā šo URL. Bet izrādās, ka lielākā daļa šo stuff URL ir faktiski diezgan bezjēdzīgi. Es esmu gatavojas sākt dzēst lietas, es nesaprotu. Es redzu kaķi. Es saprotu kaķi. Es nezinu, kāpēc kaķi ir tur atkal. Es tiešām nezinu ko tas ir absurds. Tāpēc es esmu tikai gatavojas glabāt izceļot un dzēst sīkumi ka es nesaprotu, destilējot URL tikai šo. Tagad ļaujiet man iegūt ienākt vēlreiz. Izskatās, ka Google joprojām darbojas. Tātad kaut kādu iemeslu dēļ, viņi pievienojot sīkumi daudz viņu URL pēc noklusējuma. Bet tas nav noteikti nepieciešams. Tātad, kas ir jauka par šo? Nu, ļaujiet man iet uz priekšu un atvērt Chrome inspektors. Tur ir maz pele īsceļu par to. Dodieties uz cilni Network. Un tagad ļaujiet man pārlādēt šo lapu vēlreiz. Un es esmu turot Shift. Kā malā, pārlūkprogrammām mēdz cache vai saglabāt Informācija tikai efektivitātes dēļ. Bet parasti, turot Shift un pārkraušanas liks visu sākt vairāk no sākuma. Un tas, ko es gribu darīt šeit. Un paziņojums visi šie rindas, kas tikko parādījās. Izrādās, ka jebkurā noteiktā web lapa, tur varētu būt tikai viens fails involved-- hello.html-- vai tur var būt 52, kā šajā gadījumā. Kad es apmeklēju google.com, acīmredzot, mans pārlūks sākas 52 atsevišķas HTTP pieprasījumus. Kāpēc tā? Nu, paskaties, kas ir iekšā Šīs mājas lapas augšu augšas. Tur ir ne tikai tekstu, bet tur ir faktiskie attēli kaķu nekā pa labi. Tur ir krāsains logo šeit kreisajā pusē. Tur ir visas šīs ikonas par mikrofonu, un tā tālāk. Tur ir daudz gabalu, ēku bloki, momentloterijas gabali, ja jūs, šajā mājas lapā. Un ko pārlūks dara pēc kļūst ļoti pirmo failu, kas tas ir rinda šeit, tas ir būtībā atkārtojot pār HTML augšas uz leju, no kreisās uz labo, meklē lietas, piemēram, attēlu tagus vai citu tagus kas tiek minēts citus failus un ja tā uzskata, ka viņiem, iet un ielādē tos izmantojot HTTP, dzīvotspējīgu vesels aploksne metafora, un pēc tam parāda tos piemērotu vietu šajā mājas lapā. Bet paziņojums šeit, ja es koncentrēties uz pirmie mest, meklēt kaķi, ievērosiet, ka tas patiešām ir, izmantojot HTTP 1.1. Un diemžēl, Google Chrome tagad versijā 39 ir sava veida dumbing lietas leju un nerāda mums faktiskos galvenes. Bet to, kas patiešām ir nosūtīts pieprasījums ne slash, bet / search? q = kaķi. Tagad, kāpēc ir tik svarīga? Nu, es esmu gatavojas, lai secinātu, no tā, ka, ja jūs Google atbalsta vaicājumus šīs veidlapas, kāpēc nav man īstenot savu meklēšanu dzinējs CS50, bet tikai priekšā beigas, tikai grafiskā lietotāja saskarne. Un mēs ārpakalpojumus atpakaļ beigām, faktiskais meklēšanas rezultātus Google. Tātad, kā es varu darīt? Nu, ļaujiet man iedziļināties gedit nekā šeit. Un ļaujiet man iet uz priekšu un atvērt augšu, teiksim, jaunu failu. Un es esmu gatavojas, lai saglabātu šo īslaicīgi kā meklēšanas-0.html. Un tad galu galā, mēs ātri nosūta vienu es iepriekš sagatavotas. Un es esmu gatavojas ātri sakult doc tipu html open kronšteins html cieša kronšteins html. Tad es esmu gatavojas darīt galvu cieša galva open virsraksts CS50 Meklēt nevis Google meklēšanas. Leju šeit es esmu nāksies ķermenis, noteikti šeit tuvu ķermeņa. Un tagad man ir nepieciešams CS50 Meklēt. Un patiesībā, pieņemsim veidot to pakāpeniski. Es esmu gatavojas iet uz priekšu un slēgt šo un faktiski ielieciet to manā publiskajā abonentu. Tā dod man tikai vienu mirkli. meklēšanas 0.html-- es esmu gatavojas īslaicīgi to sauc search.html. Es esmu gatavojas chmod tai + R search.html. Un tagad es esmu gatavojas, lai to atvērtu. Viss ir labi, tā ka bija ātri. Bet mērķis bija vienkārši lai mūs līdz punktam , kam šo tekstu failu sauc search.html. Tāpēc nav daudz apskatīt vēl. Patiešām, ja es eju uz manu pārlūku, un doties uz search.html, ka viss tā ir. Bet jūs zināt, ko? Es varu būt mazliet mīļotājs. Es izlasīju kādā grāmatā, ka tur ir virsraksts tag sauc H1. Un es iešu uz priekšu un izmantot šo atvērto H1 un ciešu H1. Pārlādēt lapu. Un tagad tas ir lielāks un drosmīgāki, nav tik interesanti, bet vismaz tas strukturāli interesantāku. Bet tagad ļaujiet man iepazīstināt citu tag. Izrādās, tur ir forma tag. Un ļaujiet man tuvu, ka tag. Un izrādās, tur ir ievades tagu, kas ir atribūtu sauc veids, kas ir datu tips lauka, ja Jums gribas. Un būs tipa tekstu. Un tā vērtība būs būt CS50 Search. Aizvērt tag. Un tur būs ne jēdziens atverot un aizverot ar atsevišķām tagiem. Ļaujiet man iet atpakaļ vairāk nekā šeit, un redzēt, kas notiek, pārlādēt. Kļūst interesanti. Izskatās, ka tas ir teksta lauks. Un patiesībā, es negribēju likt vērtību tur vēl. Ļaujiet man iet atpakaļ šeit un faktiski saņemt atbrīvoties no šīs vērtības, lai saglabātu tā vienkārši. Tā vietā, kura vērtība, ko es gribēju lai dotu šo lietu bija vārds. Un es nezinu, kas tas ir, tāpēc es atnākšu atpakaļ uz to. Bet tālāk, ka es gribu darīt ievades veids = iesniegt. Un šī vērtība būs CS50 Meklēt. Un mēs redzēsim, kāpēc es pārcēlās vērtību šim. Kad es pārlādēt, man šķiet, tagad ir iesākums manā meklēšanu dzinējs, super pretīgs, lai gan godīgi sakot, tas ir nav tālu mest no tā, ko Google noklusējuma lapa izskatās. Ja es iet šeit tagad, es varu ierakstīt kaķi un, cerams, noklikšķiniet uz Meklēt. Bet es neesmu gluži darīts vēl, tāpēc, ka man nav īstenoti, protams, datu bāzes. Man nav atsaukta tīmekļa meklēšanas rezultātos. Tāpēc man ir nepieciešams, lai ārpakalpojumus, ka Google. Tātad, kā es varu darīt? Nu, pirmkārt, I nepieciešams pievienot un rīcības piedēvēt manu formu frāzi ir http://www.google.com/search. Un es zinu, ka tikai no tā secināt, skatoties cieši pie viņu URL. Un tagad ņemt minējums. Kas būtu šo tekstu laukā iespējams saukt, pamatojoties uz to, kur mēs nonācām No agrāk? Mērķauditorija:? Q. DAVID J Malan:? Q. Un mums nav tiešām ir nepieciešams jautājumu atzīmētu izrādās, bet q ir tiešām tas, q par vaicājumu, iespējams ar noklusējuma, tikai tāpēc, ka tas ir kādi Lerijs un Sergejs nāca klajā ar gadiem. Tāpēc tagad ļaujiet man pārlādē šo lapu. Tas neizskatās viss, kas atšķiras. Bet tagad skatīties, kas notiek. Ja es tipa kaķiem un klikšķi CS50 meklēt un ļaut iet, pamanīt man whisked prom uz faktisko Google. Tagad Google ir nedaudz kaitinošas, ka viņi pievienojot papildu parametru, ja jūs, uz URL. Tas viss notiek automātiski Google pusē. Svarīgi ir tas, ka man šķiet ir radījis šo lūgumu šeit. Un tiešām, tas, kas notiek. Ja jums ir HTML, ka izskatās šādi, šis ir sava veida web izstrādātājiem notācijas sakot, iet uz priekšu un izveidotu formu ka tad, kad tas ir iesniegts, tas notiek, lai dotos uz šo URL. Un, ja URL ir sniedzis vērtības lietām, piemēram, q, nedodas tikai uz šo URL. Patiesībā, dodieties uz jautājumu zīmi un tad Q = kaķi. Pievienot parametru, HTTP parametrs, piemēram, ka. Un tikai, lai būtu super precīzs, to, kas tiek izsecināt here-- bet es būšu vairāk explicit-- ir ka metode, es gribu, lai izmantotu ir iegūt, nevis kaut ko līdzīgu post, ko mēs galu galā redzēt. Tātad īsumā, vienkārši izpratne HTML un izmantojot dažus diezgan vienkāršus tagus, tagad mēs varam sākt veidot mūsu pašu front galalietotājs interfeiss ar meklēšanu dzinējs aiz tā. Bet tas, protams, ir diezgan pretīgs. Tāpēc ļaujiet man faktiski atvērt Nedaudz labāka versija. Šis ir viens es sagatavots sekmētu, ka ir dažas piezīmes. Bet jūs redzēsiet, ka es diezgan daudz pārbūvēts to. Tātad tas jau ir pieejama tiešsaistē. Un man gadās preemptively doties uz https tikai, lai saglabātu tā vienkārši. Un tagad pieņemsim atvērt nākamais atkārtojuma no tā. Ir 0 versija 1 vietā. Kas lec ārā pie jums kā nedaudz atšķirīgs šajā piemērā? Mērķauditorija: [dzirdams]. Jā, tur ir šis teksts saskaņot centru. Tas ir mazliet dīvaini šeit. Bet tas ir patiešām jauns. Un varbūt uzminēt, kas notiek varētu notikt. Ja es iet uz manu pārlūku tagad un apmeklēt meklēšanas-1.html, tas ir gandrīz tas pats. Bet tas ir solis tuvāk kas ir nedaudz vairāk diezgan. Tas joprojām ir neglīts, bet prettier ar to, ka vismaz viss ir tagad centrā. Tātad izrādās, ka tas, kas es esmu, izmantojot ir cita valoda, vispār sauc CSS, kaskādes stila lapas. CSS un, atklāti sakot, ir laipns par, jo mans personīgais viedoklis, atrociously izstrādāta valoda. Tas ir ļoti kaitinošas atcerēties visas dažādās detaļas. Bet tas ir tas, ko stylizes Visa globālais tīmeklis šodien. Es aizvainojis kāds. Labi. Tāpēc iesim atpakaļ šeit un redzēt kā mēs esam patiesībā, izmantojot šo. Un izrādās, vismaz tas ir tiešām diezgan vienkārša valoda. Tā ir tikai galvenās vērtības pāros, īpašības un vērtības, īpašības un vērtības. Patiesi, šeit ir viens šī manta un cenas. Vienkārši izmantojot stilu atribūtika par manu ķermeņa tag un piešķirot tam vērtību Vārds resnās un kādu citu vārdu, vai īpašumu un vērtību, Es varu ietekmēt estētiku no mājas lapas, nevis obligāti struktūra vēl, bet estētika tā. Un tikai ar Googling apkārt, es saprotu ka CSS, kaskādes stila lapas, atbalsta īpašumu sauc teksta saskaņot, kura vērtība var atstāt, pa labi, vai centru, piemēram. Tāpēc tagad, kad es pārlādēt lapu, ko es darīju get bija centrēts lapas, bet joprojām ir diezgan neglīts. Iesim uz priekšu un atvērt up Search 2 versiju. Un tagad paziņojums es esmu darījusi nedaudz vairāk. Ievērojiet, ka šeit iekšpusē galvas tag, tur var būt vairāk nekā titulu. Patiesībā, tur ir stils tag. Un tas ir, ja tas tikai kļūst mazliet netīrs redzēt CSS reizēm. Paziņojums, ka man šķiet, ir kaut kas ka strukturāli izskatās ļoti atšķiras. Bet šeit ir vārds tag Es gribu stilizēti. Te ir mūsu vecie draugi cirtaini bikšturi un slēgta cirtaini lencēm. Un tad šeit ir tas, ka mantu un tās vērtību. Ja es ielādēt šo failu, search2.html, Gala rezultāts ir identisks. Bet tas ir solis ceļā uz labāku dizainu. Ar faktoringa šo CSS, es esmu nedrīkst sajaukt to ar manu HTML. Un tiešām, kā mēs redzēsim, es varētu atkārtoti šīs īpašības un vērtības. Ja es gribēju, lai ķekarus daļas manā mājas lapā centrēts, Man nav rakstīt style = teksta-align centru visā vietā. Es varu likt vienā vietā varbūt, patīk augšā. Bet pat tas nav labākais dizains. Patiesībā, viena no lietām, jūs uzzināsiet kā jūs pavadīt vairāk un vairāk laika ar Web programmēšana ir tas, ka vairāk jūs varat modularize lietas un faktoru lietas tāpat .H failiem ļaujiet mums faktora stuff, patīk helpers.c Ļaujiet mums faktora lietas pāris psets atpakaļ. Tāpat varētu mums vēlas, lai to sasniegtu. Tātad paziņojuma versijā trīs search.html Esmu sakopta vadītājs lapa un tikai nodot šajā, saikne tag, kas pretrunā ar nosaukumu, nedod jums hipersaiti. Tas ir saistīts ar citu failu veidā href, kura vērtība šajā gadījumā, ir meklēšanas 3.css Tāpēc es saprotu, mēs ejam ātri. Bet viss, ko es daru, ir laipns pārvietojas lietas apkārt. Ļaujiet man atvērt meklēšanas 3.css. Tur tas ir, nekas īsti uz to. Es vienkārši nokopēt un ielīmēt to jaunā failu, līdzīgi kā mēs ņemt stuff citos failos pirms. Un result-- pilnīgi underwhelming-- būs tieši tāds pats. Bet mēs esam pārvietojas toward-- nē, tas nav. Ak, es zinu, kāpēc. Tātad tas, šķiet, ir kļūda. Un tas ir kaut kādā ziņā. Bet ļaujiet man atvērt savu cilni Network. Ļaujiet man pārlādēt lapu. Ah, kāpēc CSS netiek piemērots? Nu, CSS failu, līdzīgi, ir būt pasaulē lasāms, lai runāt. Un tas arī šobrīd aizliegta. Tāpēc ļaujiet man darīt chmod a + r Star dot CSS-- whoops-- mēs dot CSS ir tikai failu paplašinājums CSS failus. Tagad ļaujiet man iet atpakaļ uz mans pārlūku un pārlādēt. Labi, mazliet labāk. Tagad ļaujiet man darīt vienu pēdējā lieta. Meklēšanas-4.html. Man ir versija, ka es tikai domāju bija tā dzesētājs, lai gan tā vairāk sarežģīta. Apskatīsim rezultātu pirmās. Aizvērt šo dot mums vairāk vietas. Mainīt to, lai meklētu-4, Enter. Un tagad ķekars lietas ir sadalīti. Es esmu gatavojas doties atpakaļ manā direktorijā šeit. Un tagad es esmu tikai gatavojas darīt chmod par + R uz file-- jo es zinu, tas exists-- sauc logo.gif, kurā ir attēls. Un tagad pārlādēt. Un wow-- tāpēc tagad es esmu diezgan tuvu, atklāti sakot, patīk uz 1999. gada versiju Google, un godīgi sakot, 2014 versiju Google, tiesības? Tātad, tas ir tagad gatavojas viņu mājas lapā, galu galā, ja es meklētu kaķiem. Un tas patiešām ir. Bet tas, ko es daru savādāk šajā versijā 4? Tāpēc mēs ne aiztures pārāk daudz par to šeit. Jūs redzēsiet šo problēmu noteikti septiņi galu galā. Bet paziņojums I did dažas lietas. Es iepazīstināja div tag, kas ir sadalījums, līdzīgs garā uz tag punktu. Bet sadalījums ir tāpat kā, šeit ir taisnstūra neredzams reģions ekrāna. Pieņemsim arī tā unikāls identifikators, kājenes, tikko tā, ka mēs varam runāt par tas mūsu HTML citur. Šeit ir vēl viens div lapas kuru ID būs saturu. Tas ir lapas saturs. Un šeit ir galvenē lapā. Citiem vārdiem sakot, es esmu būtībā HTML esmu garīgi Apskatot šo tīmekļa lapu kā trīs komponenti, header šeit ar šīs neredzamās taisnstūra, saturs vidū, un pēc tam kājenes lejā, pat gan mēs neredzam tās lietas. Jo es gribu, lai manā galvā un lapā šeit, vai .CSS failā, Es varu izmantot šo sintaksi. Header nav tag. Tas ir ID, lai tā kļūst , ka darot #header, Es tagad var piemērot vienu vai vairākus īpašības attiecībā uz galvenes. Es varu darīt to pašu saturu, pats par saturu šeit. Tā piemēram, kājenē, paziņojumā visas šīs īpašības es esmu pievienojot. Un es zinu, ka viņi eksistē, vienkārši lasījumā līdzi dokumentāciju CSS. Fonta lielums būs smaller-- tāpēc daži relatīvo fonta izmērs. Svars būs treknrakstā. Margin-- cik daudz pikseļus ap it-- ir 20 pikseļi. Un tas būs centrēts. Bet tieši tagad, lapa izskatās šādi. Ja es neesmu apmierināts ar mana kopija labi tur, Es varētu darīt kaut ko līdzīgu sarkano krāsu. Un tad es varu saglabāt to, pārlādēt, un tagad es esmu stilizēti kājenes. Tātad tas ir tikai hinting pie varas par to, ko jūs varat darīt, kas mājas lapā parādīt sevi. Un pat vēsākas, nekā tas, ja vēlaties kule apkārt ar faktisko mājas lapas, Jūs nevarat neatgriezeniski mainīt tos. Bet, ja es atvērtu Chrome inspektors atkal un es eju nevis kreisajā pusē šeit, kas liecina Facebook HTML, bet liecina par labi labā puse visu savu CSS, Jūs varat vai nu un mainīt lietas uz lidot. Tāpēc ļaujiet man iet uz priekšu un darīt to. Ļaujiet man iet uz priekšu un kontrole noklikšķiniet uz šīs izlases vārdu šeit, paraksta, un noklikšķiniet uz Pārbaudīt elementu. Chrome ir ļoti ērti lec h1 tag, ka Facebook izmanto. Un paziņojums šeit Facebook ir sava veida laiski grūti kodē fonta lielumu, kā īpašumā šeit. Tik cool lieta gan ir ka, ja es tiešām iet šeit un teikt, ak, Facebook, man nepatīk, ka 64 pikseļi, mēs tagad varam mainīt Facebook. Protams, mēs esam tikai mainot to man personīgi brīdī. Bet tas ir tikai vēl viens instruments mūsu instrumentu komplekts kas notiek, lai ļautu mums kniebiens un izdomāt, kā arī diagnosticēt jautājumi mūsu pašu tīmekļa lapās. Un mēs varētu tāpat iet pa šeit, kas ir tas pats. Ja jūs patiešām vēlaties iegūt iedomātā, es domāju, tagad jūs tiešām var mutēt lapu un darīt trakas lietas. Tātad, kāpēc tas viss noderīga? Nu, galu galā, mēs esam gatavojas vēlaties, lai būtu spēj izveidot mājas lapas, virza mūsu pašu atpakaļ galiem, nevis tikai Google un ārpakalpojumi atpakaļ beigām tur. Mēs tiešām gribam vērtība, piemēram, mūsu meklētājprogrammas rīcību piedēvēt iet nevis kāds cits, bet kaut ko līdzīgu search.php, kur search.php ir mūsu pašu serveri, nevis kāds cits. Un tāpēc, lai tur nokļūt, mēs faktiski nepieciešams ieviest jaunu valodu. Tātad, mēs esam jau paskatījās viens jauns valoda šeit, vai divas tiešām, HTML un CSS. Bet tie patiešām ir tikai strukturālās un estētiskās valodas. Viņi nav programmēšanas valodas per se. Un tas ir apmēram tikpat daudz, formāla laiku, kā mēs tērēt par tiem. Tāpēc, ka mēs sāksim tagad pāriet uz PHP. Tāpēc PHP ir faktiskais programmēšanas valoda. Tas ir skriptu valoda tādā nozīmē, ka tas ir domāts, lai būtu vieglākas kā kaut ko līdzīgu C. Un tas ir interpretēts valoda, kas nozīmē, ka tas nav apkopota. Tātad īsumā, ko īsti tas nozīmē kad mēs izmantojām valodu, piemēram, C un mums bija apkopot to? Ko tas nozīmē apkopo C pirmkodu? Mērķauditorija: [dzirdams]. DAVID J Malan: Pasaki to vēlreiz? Mērķauditorija: [dzirdams]. DAVID J Malan: Perfect. Izrādās to bināro. Izrādās to nulles un vieninieku no faktiskās angļu līdzīgu pirmkodu. Un tad mēs varam reāli palaist šo nulles un vieninieku pĆrcelties cauri CPU ar dubultklikšķi ikona vai darbojas komandu. PHP un Python un Ruby un Perl un JavaScript un ķekarus citi valodas tiek interpretēti valodas, kas ir teikt Jums nav apkopošanai. Drīzāk, jūs barības tos kā ieguldījumu programmu, ko sauc par tulku. Un tas tulks, kurā kāds cits rakstīja, skan jūsu avota kodu augšas uz leju, kreisās uz labo pusi, un tikai interpretē šīs līnijas un dara to, ko jūs sakāt. Tātad, ja jūs sastopaties līnija, kas saka druka, tas ne vienmēr pārvērst print uz attiecīgajiem nullēm un uzņēmumiem. Tā vienkārši ir šī tulks, piemēram liels, ja nosacījums, kas saka, ja programmētājs norādījums ir drukāt, tad rīkojieties šādi. Tātad tas interpretē to vienkārši pēc veida argumentāciju ar to, ko jūs esat stāsta to darīt. Un PHP ir viena no šīm valodām. Un pirms PHP gadiem tika izstrādāts tieši web programmēšanu. Un tas bija sākotnēji ļoti apliets netīrs valoda. Un tiešām, tur ir milzīgs daudzums slikta PHP kodu, kas tur. Bet pati valoda ir nogatavināts gadu gaitā, tik daudz, ka tagad tā ir tiešām brīnišķīgs nākamais solis pedagoģiski no C, jo tas ir tik darned pazīstami visu jūs esat tikko redzējām pēdējo pāris nedēļu laikā. Viena sākotnējā starpība redzēsim nav tur nav galvenā funkcija vairs. Kad sākat rakstīt kodu, tas ir tikai gatavojas saņemt izpildīts vienalga ko, kā mēs redzēsim pēc brīža. Tikmēr, lūk, ko mainīgais izskatās PHP. Tas ir nedaudz atšķirīgs, bet tikai tikko. PHP, tur nav spēcīga rakstīt. Tur ir nedēļā rakstīt, kas nozīmē tikai to, ka ir datu tipi, piemēram, stīgas un numurus un citas lietas. Bet jums nav apnikt, norādot kādi tie ir vairs. PHP skaitļi to par Jums. Dolāra zīme ir tikai lēmums ka PHP cilvēki, kas gadiem Pirms tā, ka jebkurš mainīgais PHP tikko sākas ar dolāra zīmi. Tas ir faktiski sava veida noderīgi, jo tas lec ārā pie jums nedaudz vairāk. Bet pēc tam, šis ir nosacījums PHP. Kas ir atšķirīgs, salīdzinot ar C? Triks question-- neko, kas ir tiešām ļoti jauki. Būla izteiksmes PHP-- pats. Būla izteiksmes ar un vs. vai, slēdži, cilpas, cilpas, loops-- OK, tas viens ir atšķirīgs. Tātad izrādās, tur ir pāris citas funkcijas PHP. Viens no tiem ir faktiski tas, kas ir lieliski ērti. Ja $ numuriem ir masīvs, ka jūs esat deklarēta iepriekš programmā, jums ir šī iedomātā katram būvēt ka tā vietā, dara visu, kas kaitinošas Man ir vienāds ar 0, man ir mazāk nekā tas, [? Es ++?], par katru numuru, kā numuru, kur katra Šo dolāra zīmi vērtībām ir tikai mainīgs, un pēdējais Jūs varat iedomāties, kā I. Jūs varētu to nosaukt kaut ko vēlaties. Es to sauca numurs. Tas ir gatavojas atkārtot pār masīvs sauc numurus. Un par katru atkārtojuma, tā ir gatavojas automātiski atjaunināt Jums dolāra zīmi numuru mainīgais, lai jūs pastāvīgi piekļūt mainīgo vēlaties bez darīt jebkuru kvadrātveida pamatni notācija vai indeksācija masīvs. Tālāk, mums pat ir lietas, piemēram, bloki, kas izskatās gandrīz tāds pats, izņemot gadījumus, tas ir ļoti bieži, jo mēs skat, gan PHP un JavaScript iepriekš inicializēt masīvu Izmantojot kvadrātiekavas. C izmanto cirtaini lencēm. Tātad, tas ir nedaudz atšķirīgs, lai gan mēs neesam īsti izmantot šo triks daudz. Bet vēl spēcīgāk, PHP ir asociatīvas bloki, kas ir iedomātā veids kā pateikt hash tabulas. Patiesībā, ja jūs vēlaties, lai pasludināt saīsināto galda PHP, atšķirībā C- cik rindas kods tas veic, lai faktiski īsteno hash tabulu C? Vai cik koda rindiņas ir tā, ņemot īstenot hash tabulu C? Tātad, tas ir iespējams, daudz, vai ne? Tas ir daži desmiti, varbūt 100 vai 200. Tas ir netriviāls. Vai tas ir par, lai būtu, jo jūs drīz redzēt, netriviāls ieviest hash tabulu [Dzirdams], un arī mēģināt. Bet PHP-- un godīgi sakot, es iespējams, nevajadzētu jums pateikt to līdz Monday-- PHP, ja vēlaties tabulu, darīts. Tas ir hash table-- tik ar vienu rindiņu kodu. Un Valodu daudz darīt. Ir jautri ar PSET pieci. Tik daudz valodu izdarītu. Viņi jums šo abstrakciju ka citiem cilvēkiem, citiem programmētājiem, ir radīts, lai jūs, lai Jūs varat stāvēt uz saviem pleciem un sākt izmantot idejas, kas ir super pārliecinoši, piemēram, hash tabulas un koki un mēģina. Bet jums nav obligāti īstenot šīs lietas pats. Un tā galu galā, kādi mēs ejam, lai izmantotu PHP potenciāli rakstiski programmas no tā saukto komandrindas. Mēs varētu atjaunot visas programmas mēs esam uzrakstījis šo semestri līdz šim, izņemot varbūt Breakout kas izmanto SPL, kas ir raksturīgs C brīdī. Bet katru cita problēma noteikt, protams, Mario un Cēzars un Vigenere un [? Kreka?], Un tālāk, mēs varētu atkārtoti īstenot PHP, un iespējams, nedaudz vieglāk. Bet tas, ko mēs galu galā dodas izmantot PHP ir interneta programmēšanas. Un mēs esam gatavojas ieviest nākamo nedēļa garīgo modeli, paradigmu sauc MVC, modelis skats kontrolieris, kas, ja jūs esat darījuši programmēšana Pirms Python vai Ruby vai kur citur, jūs varētu zināt par šo komandu ar Sliedes un Django un tamlīdzīgi. Bet, ja jūs esat jauns, lai šo pārāk, jūs redzēsiet ka tas ir tiešām ļoti dabisks paplašināšana factorization un veida dizainu kodu, kas mēs esam darot C. Mēs ejam, lai tagad piemērot dažus no šiem nodarbības uz PHP tā, ka galu galā, mēs esam Īstenojot mūsu pašu mājas lapas. Un, ja jūs esat veida mesmerized vai pārsteigts ka mēs gatavojamies darīt visi tik ātri, saprast, ka gandrīz katru semestris, gandrīz 90% no studentu CS50, ieskaitot tos, kuri nekad iepriekš ieprogrammēts, galu galā padarot gala projektus, pamatā web programmēšanu. Un tā jūs redzēsiet, ka atgriežas ir augsts nedēļās nākt. Tāpēc mēs redzēsim jums, tad pirmdien. SPEAKER 1: Un tagad, Deep Domas ar Daven Farnham. Hash tabulas. [Smiekli]