1
00:00:00,000 --> 00:00:01,390

2
00:00:01,390 --> 00:00:04,890
>> [Predvajanje glasbe]

3
00:00:04,890 --> 00:00:10,955

4
00:00:10,955 --> 00:00:12,580
DAVID J Malan: Dobro, dobrodošel nazaj.

5
00:00:12,580 --> 00:00:13,600
To je CS50.

6
00:00:13,600 --> 00:00:15,540
To je konec sedem tedna.

7
00:00:15,540 --> 00:00:18,180
In to je konec tega odstranjevalca
hunt od problema nastaviti štiri

8
00:00:18,180 --> 00:00:19,220
da boste morda spomni.

9
00:00:19,220 --> 00:00:21,650
Po okrevanju vse
te datoteke JPEG osebja,

10
00:00:21,650 --> 00:00:24,820
ste bili sporni, če želite,
da se fotografira s toliko

11
00:00:24,820 --> 00:00:25,981
od teh ljudi, kot lahko.

12
00:00:25,981 --> 00:00:28,480
Imamo cel kup vlog
v zadnjih nekaj tednih,

13
00:00:28,480 --> 00:00:32,980
res, kar nekaj tik pred poldnevom
danes, od katerih so nekateri tistih tod

14
00:00:32,980 --> 00:00:37,670
ujete tukaj in-- izgleda like-- Annenberg
Dvorana ob uradnih urah, ena tukaj

15
00:00:37,670 --> 00:00:39,530
V Lowell House z Nickom.

16
00:00:39,530 --> 00:00:41,750
Tukaj je pa Ramon ujeli na telefonu.

17
00:00:41,750 --> 00:00:43,870
To je bilo na CS50 kosilo.

18
00:00:43,870 --> 00:00:46,840
To je bil Jason Skyping z
bolj ustvarjalni sošolec,

19
00:00:46,840 --> 00:00:48,280
ki mu je poklical na ta način.

20
00:00:48,280 --> 00:00:49,690
Ne vemo, kaj je to bilo.

21
00:00:49,690 --> 00:00:51,940
>> [Smeh]

22
00:00:51,940 --> 00:00:54,570
>> DAVID J Malan: A
da je vredno GB.

23
00:00:54,570 --> 00:00:56,960
Tukaj je Chang, ki
dobesedno pobegnila oder

24
00:00:56,960 --> 00:01:00,480
da ne bi fotografirali eno
dan, vendar je bil na koncu ujeli.

25
00:01:00,480 --> 00:01:02,050
Tukaj je Nick.

26
00:01:02,050 --> 00:01:03,480
Tukaj je Nick.

27
00:01:03,480 --> 00:01:04,080
Tukaj je Nick.

28
00:01:04,080 --> 00:01:05,090

29
00:01:05,090 --> 00:01:07,670
In tukaj je Alison, ki jih določijo področjih.

30
00:01:07,670 --> 00:01:11,840
In Zamyla še bilo ugotovljeno,
na tekmovanju dvorano.

31
00:01:11,840 --> 00:01:14,100
Torej bomo šli skozi
Te fotografije, ugotovimo,

32
00:01:14,100 --> 00:01:16,690
ki je predložil najbolj
prej, in nagrada

33
00:01:16,690 --> 00:01:20,662
eno čudovito nagrado, kot je
obljubljali v spec.

34
00:01:20,662 --> 00:01:23,120
In bomo tudi nadaljnje ukrepanje glede
Prostor, ki je bil vpleten.

35
00:01:23,120 --> 00:01:26,860
>> Nekaj ​​announcements-- tako kosilo
je, še enkrat, ta petek ob 13:15.

36
00:01:26,860 --> 00:01:30,420
Če želite, da se nam pridružite,
RSVP na tem URL tukaj.

37
00:01:30,420 --> 00:01:33,730
Jason se pojavi spet tukaj od enega
odsekov nekaj let

38
00:01:33,730 --> 00:01:35,510
nazaj, kar se je zgodilo
pade na noč čarovnic.

39
00:01:35,510 --> 00:01:38,950
In res je oblečen kot
buče, da posamezno leto.

40
00:01:38,950 --> 00:01:42,700
Če gledaš to poglavje
njegovega od 2.011 oddelku

41
00:01:42,700 --> 00:01:46,480
osem, če ste radovedni,
na CS50.tv, mislim,

42
00:01:46,480 --> 00:01:49,730
To je bilo leto, v katerem
njegova zračna črpalka delala.

43
00:01:49,730 --> 00:01:52,490
>> Če ste, potem gledal
Podobno oddelek v letu 2012,

44
00:01:52,490 --> 00:01:55,620
boste videli to Jason precej zmanjšano,
saj obleka ni več deloval,

45
00:01:55,620 --> 00:01:58,060
ki je samo reči
ta petek, če bi

46
00:01:58,060 --> 00:02:02,720
rad bi si buče z Daven
in Gabe in drugi, RSVP glavami

47
00:02:02,720 --> 00:02:04,480
na cs50.harvard.edu naslov.

48
00:02:04,480 --> 00:02:06,200
Obljublja, da bo zelo zabavno.

49
00:02:06,200 --> 00:02:08,660
Daven, smo povedali, je vklesan
Buče vse življenje.

50
00:02:08,660 --> 00:02:11,930
Gabriel iz Brazilije še nikoli
izrezljane buče za noč čarovnic.

51
00:02:11,930 --> 00:02:14,700
Zato se tam z njimi, kot se uči.

52
00:02:14,700 --> 00:02:16,830
>> Seminarji, meanwhile--
tako da se bomo kmalu naučili

53
00:02:16,830 --> 00:02:20,650
o tem, kaj so naša pričakovanja so za
končni projekt, ki je v bistvu

54
00:02:20,650 --> 00:02:23,150
se omejijo na
oblikovanju in izvajanju

55
00:02:23,150 --> 00:02:26,440
Najbolj kakršen koli projekt v interesu
si, čeprav na podlagi odobritve

56
00:02:26,440 --> 00:02:28,490
in smernice iz vašega asistent.

57
00:02:28,490 --> 00:02:32,110
Proti koncu
semester, uvajamo številne

58
00:02:32,110 --> 00:02:35,610
seminarjev, ki so fakultativni pouk
jih učnih štipendistov in Harvardu pod vodstvom

59
00:02:35,610 --> 00:02:38,570
Osebje, prijatelji seveda po vsej
campus, o različnih temah, ki

60
00:02:38,570 --> 00:02:41,470
so tangencialna
Seveda je osnovni učni načrt

61
00:02:41,470 --> 00:02:45,590
vendar je kljub temu primerno, zabavno in
razlikuje za možne končne projekte.

62
00:02:45,590 --> 00:02:49,530
>> Na primer, prvič, če želite,
registrirati, glavo, da ta URL tam.

63
00:02:49,530 --> 00:02:53,010
In to je postava za
Samo letos je seminarji.

64
00:02:53,010 --> 00:02:56,060
Vendar zavedaš imamo na desetine
seminarji iz preteklih let, ki so vse

65
00:02:56,060 --> 00:02:59,774
so povezani v meniju seminarji
Možnost spletni strani seveda je.

66
00:02:59,774 --> 00:03:02,190
Torej, če razmišljate o
presegajo vašega območja udobja

67
00:03:02,190 --> 00:03:05,060
ali pobral nekaj novih znanj in spretnosti,
na primer, programiranje iPhone

68
00:03:05,060 --> 00:03:08,100
apps z Swift, novega jezika
Apple ali Objective-C

69
00:03:08,100 --> 00:03:11,230
ali Android aplikacije ali programiranje [? nakažete?]
žarnice, ali kateri koli od teme

70
00:03:11,230 --> 00:03:15,490
tu in še več, zaradi prijava
iz strani za registracijo.

71
00:03:15,490 --> 00:03:19,730
>> Tako smo začeli in zaključila
Ponedeljek z gledaš HTTP.

72
00:03:19,730 --> 00:03:22,675
Tako hitro refresher-- HTTP,
HyperText Transfer Protocol.

73
00:03:22,675 --> 00:03:24,045
Toda kaj to v resnici pomeni?

74
00:03:24,045 --> 00:03:26,805

75
00:03:26,805 --> 00:03:27,930
Kaj to v resnici pomeni?

76
00:03:27,930 --> 00:03:30,665

77
00:03:30,665 --> 00:03:31,290
Je, da z roko?

78
00:03:31,290 --> 00:03:33,074

79
00:03:33,074 --> 00:03:34,740
Vem, da ste samo praskanje svojo glavo.

80
00:03:34,740 --> 00:03:36,400
Vendar želite, da predlaga kaj je HTTP?

81
00:03:36,400 --> 00:03:37,792

82
00:03:37,792 --> 00:03:40,576
>> Publika: Kako računalniki
komunicirati z [neslišno].

83
00:03:40,576 --> 00:03:41,517

84
00:03:41,517 --> 00:03:43,100
DAVID J Malan: Zamudil sem zadnji del.

85
00:03:43,100 --> 00:03:45,774
Kako računalniki komunicirajo with--

86
00:03:45,774 --> 00:03:47,325
>> OBČINSTVO: Internet strežniki.

87
00:03:47,325 --> 00:03:50,450
DAVID J Malan: Good-- z internetom
strežniki, in posebej, spletni strežniki.

88
00:03:50,450 --> 00:03:53,533
Zaradi odpoklica, tam je kup
storitve na internetu, od katerih so nekatere

89
00:03:53,533 --> 00:03:57,349
Uporabljate verjetno vsak dan med klepetom
in sporočila, klepet in spletne in e-pošta,

90
00:03:57,349 --> 00:03:57,890
in podobno.

91
00:03:57,890 --> 00:04:00,900
In HTTP je le
protokol, spletni brskalniki

92
00:04:00,900 --> 00:04:03,750
govorimo pri komuniciranju z
spletnih strežnikov, in obratno.

93
00:04:03,750 --> 00:04:05,580
In Analog
Človeški svet je lahko,

94
00:04:05,580 --> 00:04:08,730
Iztegnil sem roko, da se pretrese nekaj
drugi človek je in on ali ona

95
00:04:08,730 --> 00:04:11,970
priznava, z razširitvijo
njegovo roko kot dobro.

96
00:04:11,970 --> 00:04:13,970
Torej, to je samo protokol,
niz konvencij.

97
00:04:13,970 --> 00:04:15,630
>> In kaj v resnici so ti dogovori?

98
00:04:15,630 --> 00:04:18,640
No, to ravno ne začne vreti navzdol
pošiljanje sporočil in nazaj,

99
00:04:18,640 --> 00:04:19,770
kot smo je prikazano tukaj.

100
00:04:19,770 --> 00:04:22,520
In tam je nekaj načinov, na
ki jih lahko ta sporočila.

101
00:04:22,520 --> 00:04:24,360
In kar je morda najbolj
Skupno je znan kot get.

102
00:04:24,360 --> 00:04:26,510
In bomo videli, kontrast
to kmalu.

103
00:04:26,510 --> 00:04:30,010
>> Vendar zahteva get iz brskalnika
s strežnikom samo izgleda takole.

104
00:04:30,010 --> 00:04:32,960
To je kup besedila, ki jih postavlja
znotraj virtualnega ovoja.

105
00:04:32,960 --> 00:04:35,854
Na zunanji strani tega ovoja
iti par kosov podrobnosti.

106
00:04:35,854 --> 00:04:37,770
Kaj je potrebno, da gredo na
ovojnica, tako rekoč,

107
00:04:37,770 --> 00:04:41,820
da bi dobili zahtevo, kot je
to od mene na spletni strežnik?

108
00:04:41,820 --> 00:04:42,320
Ja.

109
00:04:42,320 --> 00:04:43,270
>> OBČINSTVO: Vaš IP naslov.

110
00:04:43,270 --> 00:04:45,890
>> DAVID J Malan: Moj IP naslov
V polje, tako rekoč,

111
00:04:45,890 --> 00:04:49,490
in seveda,
IP naslov prejemnika.

112
00:04:49,490 --> 00:04:52,710
Toda v primeru spletnega paketa,
potrebujemo malo več podrobnosti

113
00:04:52,710 --> 00:04:55,254
To ni dovolj, samo da bi
pošlji kuverto s strežnikom

114
00:04:55,254 --> 00:04:57,670
ker bi to lahko strežnik
poslušanje za različne vrste

115
00:04:57,670 --> 00:04:59,180
internetnega prometa.

116
00:04:59,180 --> 00:05:01,370
Torej, kaj še potrebujemo
poleg prejemnika OP?

117
00:05:01,370 --> 00:05:02,723

118
00:05:02,723 --> 00:05:03,222
Ja?

119
00:05:03,222 --> 00:05:04,241
>> OBČINSTVO: Ali je TCP?

120
00:05:04,241 --> 00:05:05,074
DAVID J Malan: Dobro.

121
00:05:05,074 --> 00:05:06,470
TCP--

122
00:05:06,470 --> 00:05:07,340
>> OBČINSTVO: Naslov.

123
00:05:07,340 --> 00:05:09,340
>> DAVID J Malan: Naslov,
ali pristanišče, kot je pozval.

124
00:05:09,340 --> 00:05:11,010
Blizu, toda številka vrat TCP.

125
00:05:11,010 --> 00:05:12,220
In tam je kup teh.

126
00:05:12,220 --> 00:05:14,310
Vendar zagotovo najbolj
seznanjeni naj bi sčasoma

127
00:05:14,310 --> 00:05:17,590
80, ki je privzeto
ena se uporablja za spletni promet.

128
00:05:17,590 --> 00:05:20,040
In še ena pozna
Kmalu bo ena 443,

129
00:05:20,040 --> 00:05:24,280
ki se uporablja za varni splet
prometa, URL-ji, ki se začnejo s https.

130
00:05:24,280 --> 00:05:26,650
>> Torej, to je, kaj se dogaja
znotraj tega okvira.

131
00:05:26,650 --> 00:05:29,780
In dobili / samo pomeni, daje
me spletna stran privzeta.

132
00:05:29,780 --> 00:05:32,700
Daj mi koren težko
voziti na tej spletni strežnik.

133
00:05:32,700 --> 00:05:36,050
In upajmo, web
server se bo odzvala z, OK

134
00:05:36,050 --> 00:05:39,630
in številka 200, ki je prav
Konvencija rekel, ja, vse

135
00:05:39,630 --> 00:05:40,470
je res OK.

136
00:05:40,470 --> 00:05:41,680
Tukaj je stran.

137
00:05:41,680 --> 00:05:45,510
Vrsta spletne strani, se bo
je besedilo, ampak bolj specifično, HTML,

138
00:05:45,510 --> 00:05:47,010
ki smo na tem, da se potopite nazaj v.

139
00:05:47,010 --> 00:05:49,877
In dot dot dot samo
sredstvo, tukaj je HTML.

140
00:05:49,877 --> 00:05:51,710
In to je, če smo
poberem zgodbo danes

141
00:05:51,710 --> 00:05:55,740
dejansko pisanje HTML,
HyperText Markup Language, ki

142
00:05:55,740 --> 00:05:57,727
je jezik, v katerem
Spletne strani so napisane.

143
00:05:57,727 --> 00:05:59,060
To ni programski jezik.

144
00:05:59,060 --> 00:06:01,270
Tukaj ni funkcije
ali zank ali pogojev.

145
00:06:01,270 --> 00:06:03,800
To je označevalni jezik,
pa je spet videti danes

146
00:06:03,800 --> 00:06:07,240
ki vam omogoča, da določite
kako strukturirati in Stilizovati

147
00:06:07,240 --> 00:06:09,300
estetsko spletno stran.

148
00:06:09,300 --> 00:06:11,470
>> Torej, to je bila ena
in samo stran res

149
00:06:11,470 --> 00:06:13,930
pogledal, če na kratko, v ponedeljek.

150
00:06:13,930 --> 00:06:16,250
In opazili nekaj
glavne značilnosti poslovanja.

151
00:06:16,250 --> 00:06:20,170
Tam je veliko odprtih kotno
nosilec in blizu nagnjen nosilec.

152
00:06:20,170 --> 00:06:23,160
Med tistimi, kotno
nosilci so besede.

153
00:06:23,160 --> 00:06:25,660
In bomo začeli
kliče te besede oznake.

154
00:06:25,660 --> 00:06:28,800
Torej odprt oklepaj glava
in zaprti oklepaj glava

155
00:06:28,800 --> 00:06:33,620
so odprti in zaprti oznake,
ali začetka in konca oznake

156
00:06:33,620 --> 00:06:37,660
zaporedju, HTML elementa,
saj ga bomo klic, ki se imenuje glavo.

157
00:06:37,660 --> 00:06:41,760
In uporablja enak žargon
organu v HTML in tako naprej.

158
00:06:41,760 --> 00:06:43,970
>> In tisto, kar je lepo, je
HTML-- in seveda, da bomo

159
00:06:43,970 --> 00:06:47,187
preživeti strašno malo časa na njem,
saj boste večinoma le ugotovimo,

160
00:06:47,187 --> 00:06:49,770
kaj jo ima je, ko vas
dejansko imajo konkretnega problema

161
00:06:49,770 --> 00:06:52,820
da solve-- boste ugotovili, da
Brskalnik je precej neumno.

162
00:06:52,820 --> 00:06:56,450
To je le, da bo do-- niso v nasprotju
computer-- tisto, kar je povedal, da storiti.

163
00:06:56,450 --> 00:06:59,279
In tako, ko imate odprto
Nosilec HTML na samem vrhu

164
00:06:59,279 --> 00:07:01,320
tam, da v bistvu
pomeni samo, hej, brskalnik,

165
00:07:01,320 --> 00:07:04,090
tukaj prihaja spletna stran napisana v HTML.

166
00:07:04,090 --> 00:07:06,130
>> Ko pa vidi odprto konzolo
glavo, da samo pomeni,

167
00:07:06,130 --> 00:07:10,350
hej, brskalnik, tukaj prihaja glavo, ali
vrhunskih del moje spletne strani.

168
00:07:10,350 --> 00:07:14,192
Ko vidi zaprto nosilec
glavo, da samo pomeni, hej,

169
00:07:14,192 --> 00:07:15,150
to je to za glavo.

170
00:07:15,150 --> 00:07:16,420
Pripravljenosti za nekaj drugega.

171
00:07:16,420 --> 00:07:18,878
In to je nekaj drugega, je
očitno bo telo.

172
00:07:18,878 --> 00:07:22,630
In ko nimate oznako, kot
imate le Pozdravljeni, vejicami, svet,

173
00:07:22,630 --> 00:07:26,610
to je samo bo surovo besedilo, ki
na koncu se prikaže na zaslonu.

174
00:07:26,610 --> 00:07:29,220
>> Zdaj, boste opazili tudi
zareza tukaj.

175
00:07:29,220 --> 00:07:32,160
Si verjetno lahko sklepamo,
kako smo ga stylizing.

176
00:07:32,160 --> 00:07:34,850
Vsakič, ko odprem oznako,
tako rekoč, sem zamakniti.

177
00:07:34,850 --> 00:07:38,540
In vsakič, ko zaprem
tag, I un-alinea,

178
00:07:38,540 --> 00:07:40,690
pisane v duhu zavitimi oklepaji.

179
00:07:40,690 --> 00:07:43,470
In po tem, da sem nekako
uporabe mojo presojo.

180
00:07:43,470 --> 00:07:48,380
Obvestilo, da nisem moti tepe
Vnesite znotraj tega naslova tag.

181
00:07:48,380 --> 00:07:48,990
Zakaj?

182
00:07:48,990 --> 00:07:51,920
No, sem se odločil, da je pogledal
malo čistilo za mano, človek,

183
00:07:51,920 --> 00:07:53,181
samo ne trudim s tem.

184
00:07:53,181 --> 00:07:54,930
Torej še enkrat, obstaja nekaj
sodba zahteva samo

185
00:07:54,930 --> 00:07:57,670
kakršna je v C ali kateremkoli jeziku.

186
00:07:57,670 --> 00:08:04,110
>> Toda opazil tudi, da je zareza
dovzetni za duševne modelu

187
00:08:04,110 --> 00:08:05,670
da ne bo nad njim zaplete.

188
00:08:05,670 --> 00:08:07,020
Ampak drevo, kajne?

189
00:08:07,020 --> 00:08:09,290
Če menite, da je splet
Stran, očitno pisno

190
00:08:09,290 --> 00:08:12,050
kot je ta, kot
lepo zamaknjen na ta način,

191
00:08:12,050 --> 00:08:17,390
lahko skoraj razmišljati odprte konzole
HTML zaprti oklepaj tag je razmejitev

192
00:08:17,390 --> 00:08:21,380
koren vozlišče, družinsko drevo
slog vozlišče v stilu dreves

193
00:08:21,380 --> 00:08:22,900
smo pogledal na zadnji petek.

194
00:08:22,900 --> 00:08:27,630
>> In res, imamo na tukaj
kar pokličem DOM, D-O-M, dokument

195
00:08:27,630 --> 00:08:31,680
objektni model, fancy način rekel
Drevo, ki pomeni, da je HTML.

196
00:08:31,680 --> 00:08:36,140
In opazili, da je HTML, bomo rekli,
kot družinsko drevo, dva otroka.

197
00:08:36,140 --> 00:08:37,659
Na levi je glava.

198
00:08:37,659 --> 00:08:39,179
Na desni je telo.

199
00:08:39,179 --> 00:08:44,220
>> In prav tako kot nespametnega misli vadbo,
glava, seveda, ima, koliko otrok

200
00:08:44,220 --> 00:08:46,070
Glede na to strukturo?

201
00:08:46,070 --> 00:08:48,200
Torej samo eden, title--
in zato imamo

202
00:08:48,200 --> 00:08:50,580
Puščica bo od glave do naslova.

203
00:08:50,580 --> 00:08:55,110
Torej, to je, kot da bi te osebe v
družinsko drevo je imela samo eno potomcev.

204
00:08:55,110 --> 00:08:58,230
In potem sam naslov lahko
je dejal, da imajo otroka preveč.

205
00:08:58,230 --> 00:09:01,780
>> Spomnimo se, da je HTML
Pozdravljeni, vejica, svet pod njo.

206
00:09:01,780 --> 00:09:06,090
In sem ga preprosto sestaviti v
ovalne namesto pravokotnika pravkar

207
00:09:06,090 --> 00:09:10,559
za pomensko sporočilo, da čeprav
to je vozlišče v drevesu, tako rekoč,

208
00:09:10,559 --> 00:09:12,100
to je nekako bistveno drugačna.

209
00:09:12,100 --> 00:09:12,800
To ni tag.

210
00:09:12,800 --> 00:09:14,780
Ali bolj pravilno, to ni element.

211
00:09:14,780 --> 00:09:16,590
To je samo besedilo vozlišče, če hočete.

212
00:09:16,590 --> 00:09:18,990
Vendar so v celoti
samovoljnih človeških konvencij.

213
00:09:18,990 --> 00:09:23,180
To je šele zdaj moj način
predstavlja, kaj bom kot agregat

214
00:09:23,180 --> 00:09:24,340
pokličite dokument.

215
00:09:24,340 --> 00:09:27,750
>> In kot igralcev, stvar na
super top corner levo roko,

216
00:09:27,750 --> 00:09:32,080
odprti oklepaj klicaj doc
tipa HTML, to izgleda kot oznako,

217
00:09:32,080 --> 00:09:35,560
ampak to je primer neumen kotiček, kjer
da je samo tam, kopirali in prilepili

218
00:09:35,560 --> 00:09:38,460
navesti brskalnikov
To je različica HTML 5.

219
00:09:38,460 --> 00:09:41,540
Svet se spreminja, kaj se
Prva vrstica kode na strani, mora biti.

220
00:09:41,540 --> 00:09:43,820
To samo pomeni, različica 5.

221
00:09:43,820 --> 00:09:45,950
Tako da ne povsem
izgledajo kot drugi.

222
00:09:45,950 --> 00:09:48,120
>> Vse je v redu, tako da s tem
je rekel, da boste zdaj cenili

223
00:09:48,120 --> 00:09:50,767
to dokaj neumen
tattoo nekdo.

224
00:09:50,767 --> 00:09:51,990
>> [Smeh]

225
00:09:51,990 --> 00:09:54,210
>> DAVID J Malan: Dobro,
in zdaj pa je dejansko dive

226
00:09:54,210 --> 00:09:55,710
v delaš nekaj s tem.

227
00:09:55,710 --> 00:09:58,610
Boste opozarjajo, da je zadnji čas
Sem odprla CS50 Appliance

228
00:09:58,610 --> 00:10:01,650
in sem naredil nekaj tako
enostavno, kot odpiranje gedit.

229
00:10:01,650 --> 00:10:05,190
In sem shranil datoteko tudi na
moj desktop-- nikjer special--

230
00:10:05,190 --> 00:10:05,870
kot hello.html.

231
00:10:05,870 --> 00:10:07,100

232
00:10:07,100 --> 00:10:10,984
>> Torej, kaj naj storim, da
again-- hello.html Enter.

233
00:10:10,984 --> 00:10:13,900
In zdaj v tej datoteki, bom
iti naprej in ponoviti, kar smo pravkar

234
00:10:13,900 --> 00:10:18,850
saw-- doc tipa html Potem bom
naredi odprti oklepaj html zaprt nosilec.

235
00:10:18,850 --> 00:10:21,890
In potem bom preemptively
Odpiranje in zapiranje oznako.

236
00:10:21,890 --> 00:10:22,390
Zakaj?

237
00:10:22,390 --> 00:10:23,598
Samo, da mi ne pozabite kasneje.

238
00:10:23,598 --> 00:10:26,850
To je samo dobra praksa, kot odpiranja
in zapiranje zavitimi oklepaji naenkrat.

239
00:10:26,850 --> 00:10:28,900
>> In kaj potem je prišel zraven?

240
00:10:28,900 --> 00:10:30,582
Si lahko zamislite tatoo.

241
00:10:30,582 --> 00:10:31,450
>> OBČINSTVO: glava.

242
00:10:31,450 --> 00:10:32,500
>> DAVID J Malan: glava.

243
00:10:32,500 --> 00:10:36,020
In potem je tukaj, jaz
imel naslov, mislim.

244
00:10:36,020 --> 00:10:39,886
In naslov je samovoljno,
Hello, world blizu naslov.

245
00:10:39,886 --> 00:10:42,760
In potem sem dol, telo, od
course-- potem zaprite telesne oznako.

246
00:10:42,760 --> 00:10:45,660
In potem samo nekoliko redundantly,
Sem imel isto stvar tukaj.

247
00:10:45,660 --> 00:10:47,150
>> Zato trdim, da je ta spletna stran.

248
00:10:47,150 --> 00:10:49,050
To je nekaj, kar
lahko sedaj v živo na spletu,

249
00:10:49,050 --> 00:10:51,925
čeprav seveda, to je dobesedno
živi na mojem namizju zdaj.

250
00:10:51,925 --> 00:10:55,837
Ampak res, če sem zmanjšati gedit,
Bom videl na mojem namizju ikono.

251
00:10:55,837 --> 00:10:58,420
Čeprav je ta aparat,
bi lahko to storite na Mac OS

252
00:10:58,420 --> 00:11:01,580
brez TextEdit ali
Windows Beležnica s celo.

253
00:11:01,580 --> 00:11:06,115
>> In če grem naprej in dvojni klik
da tudi, in select-- No,

254
00:11:06,115 --> 00:11:07,990
Ne izberite, da zato, ker
Chrome se ne odpirajo.

255
00:11:07,990 --> 00:11:09,281
Pojdimo naprej in odprite Chrome.

256
00:11:09,281 --> 00:11:10,160

257
00:11:10,160 --> 00:11:14,040
In naredite Command-O za odprto
In pojdite na namizje

258
00:11:14,040 --> 00:11:15,320
in odprite datoteko.

259
00:11:15,320 --> 00:11:20,120
To je, kako brskalnik interpretira
HTML, od zgoraj navzdol, od leve proti desni.

260
00:11:20,120 --> 00:11:21,314
Hej, tukaj je brskalnik HTML.

261
00:11:21,314 --> 00:11:21,980
Tukaj je glava.

262
00:11:21,980 --> 00:11:23,250
Tukaj je naslov.

263
00:11:23,250 --> 00:11:24,090
Tu je telo.

264
00:11:24,090 --> 00:11:26,620
In res, to je, kako
da postane to spletno stran.

265
00:11:26,620 --> 00:11:27,800
>> Ampak obvestilo URL.

266
00:11:27,800 --> 00:11:32,430
Nihče od vas lahko dvigni to specifično
stran od vaših prenosnih računalnikov, prav zdaj,

267
00:11:32,430 --> 00:11:34,910
celo znotraj vašega
aparat preko tega URL-ja,

268
00:11:34,910 --> 00:11:40,130
ker datoteke: // kaže, da je dejansko
na moji datotečnem sistemu, mojega trdega diska,

269
00:11:40,130 --> 00:11:40,990
ne tvoja.

270
00:11:40,990 --> 00:11:42,440
Tako da to ni vse, kar koristno.

271
00:11:42,440 --> 00:11:44,940
>> Poglejmo zdaj premik v smeri
uporabo dejanske spletnega strežnika.

272
00:11:44,940 --> 00:11:48,309
In se izkaže, da CS50 Appliance
je več kot le okolju, kjer je

273
00:11:48,309 --> 00:11:51,100
lahko pišete C kodo in pripravijo
in prost dostop, kot ste delali.

274
00:11:51,100 --> 00:11:55,500
Ugotovljeno je bilo tudi konfiguriran z
osebje, da predstavlja tipičen spletu

275
00:11:55,500 --> 00:11:58,290
strežnik, ki je na internetu,
tisti, ki boste morda plačali za

276
00:11:58,290 --> 00:12:00,210
ali tista, ki je v tako imenovanem oblaka.

277
00:12:00,210 --> 00:12:02,600
>> In to je tekmovanje v teku
Standard brezplačno open source

278
00:12:02,600 --> 00:12:06,160
programska oprema, na primer, nekaj
imenovana Apache, ki je morda

279
00:12:06,160 --> 00:12:08,700
še vedno najbolj priljubljen spletni
strežniške programske opreme na svetu

280
00:12:08,700 --> 00:12:11,030
da se na tisoče spletnih strani uporabljajo danes.

281
00:12:11,030 --> 00:12:13,420
In ima tudi še
programske opreme, kot so MySQL,

282
00:12:13,420 --> 00:12:16,240
ki je podatkovni strežnik
da bomo na koncu dobili,

283
00:12:16,240 --> 00:12:18,330
ki je samo reči
Jaz se lahko začne zdravljenje

284
00:12:18,330 --> 00:12:22,040
moj aparat kot popolne strežniku
da ne bom plačal drugje.

285
00:12:22,040 --> 00:12:25,980
Samo živi na svojem prenosniku za
razvoj in udobje namene.

286
00:12:25,980 --> 00:12:27,870
>> Torej, gremo naprej in
izkoristiti to.

287
00:12:27,870 --> 00:12:30,120
Bom, da gredo naprej in
odpreti terminalsko okno.

288
00:12:30,120 --> 00:12:33,030
In bom, da gredo naprej in
move-- pravzaprav, najprej sem

289
00:12:33,030 --> 00:12:34,860
dogaja se pomaknite na mojem namizju.

290
00:12:34,860 --> 00:12:36,400
Če naredim ls, tam je hello.html.

291
00:12:36,400 --> 00:12:37,022

292
00:12:37,022 --> 00:12:38,730
In sem šel
naprej in začnite uporabljati

293
00:12:38,730 --> 00:12:40,800
nov imenik smo jih
ne uporablja pred današnjim dnem.

294
00:12:40,800 --> 00:12:46,840
>> hello.html-- bom, da se premaknete
da ../vhosts za virtualno hosts--

295
00:12:46,840 --> 00:12:50,940
več o tem v future-- in nato
v imeniku, imenovanem localhost,

296
00:12:50,940 --> 00:12:54,420
kar je vzdevek dati skoraj
vsak računalnik, pa naj gre za Mac, PC,

297
00:12:54,420 --> 00:12:57,560
ali Linux računalnik, nato pa
posebej v imeniku, da smo,

298
00:12:57,560 --> 00:13:01,260
Osebje že ustvarili za vas, ko
ste prenesli napravo, imenovano

299
00:13:01,260 --> 00:13:01,760
javno.

300
00:13:01,760 --> 00:13:04,551
In kot že ime pove, kaj
Sem dal v to mapo, v teoriji,

301
00:13:04,551 --> 00:13:07,790
se bo zdaj
javne, vsaj ljudem

302
00:13:07,790 --> 00:13:10,030
ki imajo neposreden
Povezava na moj računalnik.

303
00:13:10,030 --> 00:13:13,160
>> Torej, zdaj pa grem naprej in
naredite cd v ta isti imenik

304
00:13:13,160 --> 00:13:15,490
tako da vidim, kaj je
dogaja in ls tipa.

305
00:13:15,490 --> 00:13:17,630
In res, da je
Edina stvar tam.

306
00:13:17,630 --> 00:13:23,250
Trdim, da je zdaj, ker sem dal to
vložiti hello.html znotraj imenik

307
00:13:23,250 --> 00:13:26,940
imenovano javno notranjost imenik
imenuje localhost znotraj imenik

308
00:13:26,940 --> 00:13:29,810
imenovane vhosts, ki
hvala za osebje CS50

309
00:13:29,810 --> 00:13:34,390
ki je bil predhodno nastavljen tako, da je
koren vašega spletnega strežnika,

310
00:13:34,390 --> 00:13:36,900
Zdaj lahko upamo to storiti.

311
00:13:36,900 --> 00:13:38,390
>> Bom odprla nov zavihek.

312
00:13:38,390 --> 00:13:40,090
In sem šel, da ne file: //.

313
00:13:40,090 --> 00:13:44,520
Grem uporabiti dejanski
http / localhost, ki

314
00:13:44,520 --> 00:13:47,470
še enkrat, je vzdevek
za moj lasten strežnik.

315
00:13:47,470 --> 00:13:51,085
In potem bom šel s tem, kar
ime datoteke, tako da bo jasno?

316
00:13:51,085 --> 00:13:52,680

317
00:13:52,680 --> 00:13:54,320
Kadar je ta zgodba verjetno dogaja?

318
00:13:54,320 --> 00:13:56,066

319
00:13:56,066 --> 00:13:56,565
hello.html.

320
00:13:56,565 --> 00:13:58,350

321
00:13:58,350 --> 00:14:04,270
>> Torej, z drugimi besedami, želim, da zdaj to
je moja lastna računalnik, moja naprava,

322
00:14:04,270 --> 00:14:05,660
kot da je dejanski strežnik.

323
00:14:05,660 --> 00:14:07,490
Njen vzdevek je localhost.

324
00:14:07,490 --> 00:14:10,210
Ampak mislim localhost podobna
Facebook.com google.com, karkoli.

325
00:14:10,210 --> 00:14:11,600
To je samo moje pravo ime.

326
00:14:11,600 --> 00:14:14,810
In potem končno želim v
koren trdem disku, tako rekoč,

327
00:14:14,810 --> 00:14:17,729
ali koren spletni strežnik,
ergo poševnico in nato

328
00:14:17,729 --> 00:14:18,770
ime datoteke hello.html.

329
00:14:18,770 --> 00:14:19,880

330
00:14:19,880 --> 00:14:21,930
>> Dovolite mi, pomanjšanje in pritisnite tipko Enter.

331
00:14:21,930 --> 00:14:24,266
In res, da je zdaj moja spletna stran.

332
00:14:24,266 --> 00:14:25,390
Tako da je nekoliko drugačen.

333
00:14:25,390 --> 00:14:26,880
In to je samo kot underwhelming.

334
00:14:26,880 --> 00:14:27,904
To je stara različica.

335
00:14:27,904 --> 00:14:29,070
Dovolite mi, da skrči pisavo nazaj.

336
00:14:29,070 --> 00:14:29,745
To je stara.

337
00:14:29,745 --> 00:14:30,890
To je nova.

338
00:14:30,890 --> 00:14:35,430
Ampak, kaj se v bistvu dogaja
Zdaj je, da se HTTP uporablja.

339
00:14:35,430 --> 00:14:39,344
>> Naj bo to malo bolj jasno, ali
če hočete, malo bolj zapletena.

340
00:14:39,344 --> 00:14:41,760
Naj grem do spodaj desno
kotu mojega aparata.

341
00:14:41,760 --> 00:14:44,000
In opazili, da se vse to
Tokrat pa je bilo število.

342
00:14:44,000 --> 00:14:47,330
To je edinstven naslov
vašega CS50 Appliance.

343
00:14:47,330 --> 00:14:50,800
To je zasebni naslov,
kot je razvidna iz 172,16,

344
00:14:50,800 --> 00:14:53,860
ki samo pomeni samo, da fizično
lahko dostop do tega spletnega strežnika.

345
00:14:53,860 --> 00:14:56,340
Vse je firewalled in
lepo zaščitena od ostalega

346
00:14:56,340 --> 00:14:58,130
svet zaradi tega naslavljanje.

347
00:14:58,130 --> 00:15:01,920
>> In zdaj opazil, čeprav, če sem šel v
ta naslov, ne na mojem aparatu,

348
00:15:01,920 --> 00:15:04,340
ampak v Mac OS-- bom
iti nazaj tja.

349
00:15:04,340 --> 00:15:05,930
To je moj Mac zdaj.

350
00:15:05,930 --> 00:15:08,460
In zdaj bom odprla
ta različica Chroma tukaj.

351
00:15:08,460 --> 00:15:17,370
In sem šel na http: //172.16.25
/ In sem pozabil rest-- 133.

352
00:15:17,370 --> 00:15:25,210
>> Torej grem na obisk iz mojega Mac
da IP naslov /hello.html Enter.

353
00:15:25,210 --> 00:15:29,850
In zdaj vidim iz mojega Mac
da moj CS50 Appliance, ki je

354
00:15:29,850 --> 00:15:32,600
IP naslov, ki
Številka je res obnaša

355
00:15:32,600 --> 00:15:34,320
kot spletni strežnik na spletu.

356
00:15:34,320 --> 00:15:36,944
To ni lepo, enostavno
zapomniti imena kot Facebook.com,

357
00:15:36,944 --> 00:15:40,370
vendar pa je z uporabo HTTP
očitno, čeprav Chrome

358
00:15:40,370 --> 00:15:43,560
je vrsta poenostavitev svet
za nas, ne pa da nam kaže HTTP.

359
00:15:43,560 --> 00:15:46,210
Ampak to je res točno to.

360
00:15:46,210 --> 00:15:48,470
Chrome je samo varčevanje nekaj
keystrokes teh dneh.

361
00:15:48,470 --> 00:15:50,530
In to je tisto, kar smo zdaj videli.

362
00:15:50,530 --> 00:15:51,890
>> Tako, da je vse lepo in prav.

363
00:15:51,890 --> 00:15:53,740
Ampak to je precej underwhelming stran.

364
00:15:53,740 --> 00:15:56,230
Dovolite mi, da gredo v in narediti nekaj
malo drugačen zdaj.

365
00:15:56,230 --> 00:15:57,910
Torej, naj grem nazaj v gedit.

366
00:15:57,910 --> 00:16:00,580
In namesto da bi zdravo,
svet, kaj je dal sliko.

367
00:16:00,580 --> 00:16:05,880
In jaz trdil od before-- pustite me
v mojem localhost imenika javnosti.

368
00:16:05,880 --> 00:16:10,580
In mi gremo naprej in kopiranje
cel kup datotek, od danes

369
00:16:10,580 --> 00:16:15,633
iz moje Dropbox mape v tukaj.

370
00:16:15,633 --> 00:16:19,470

371
00:16:19,470 --> 00:16:21,680
>> Zdaj, če sem tip ls, poglej
na vseh teh datotek

372
00:16:21,680 --> 00:16:24,940
da sem ga razdelijo
Spletna stran je seveda vnaprej danes,

373
00:16:24,940 --> 00:16:26,830
ena, ki je še vedno hello.html.

374
00:16:26,830 --> 00:16:27,830
Tako da je to ena.

375
00:16:27,830 --> 00:16:30,730
In opozarjajo na to neumno eno
od zadnjega time-- cat.jpg.

376
00:16:30,730 --> 00:16:34,550
Zato mi dovolite, poskusite, da bi vgradili
cat.jpg znotraj moje spletne strani.

377
00:16:34,550 --> 00:16:37,690
>> Bom, da gredo naprej
in ne cat.jpg, shranite.

378
00:16:37,690 --> 00:16:38,950
Naj grem nazaj na Chrome.

379
00:16:38,950 --> 00:16:41,140
In mi povečavo
pisave in zdaj osvežite.

380
00:16:41,140 --> 00:16:43,090

381
00:16:43,090 --> 00:16:45,030
Ups, kjer sem dal to?

382
00:16:45,030 --> 00:16:48,210

383
00:16:48,210 --> 00:16:51,520
Standby-- sem še vedno stara
Različica iz mojega namizja odprt.

384
00:16:51,520 --> 00:16:56,020
Torej, naj grem v mojo vhost, my
localhost, moj javni in hello.html.

385
00:16:56,020 --> 00:16:57,320

386
00:16:57,320 --> 00:17:00,670
Torej, zdaj pa grem naprej in
pravijo cat.jpg notranjosti telesa

387
00:17:00,670 --> 00:17:02,830
kjer želim, da bi bilo
prikaže in osvežite.

388
00:17:02,830 --> 00:17:04,560
Seveda ta ni pravilna.

389
00:17:04,560 --> 00:17:08,050
>> Tako da moram povedati, da brskalnik malo
bolj premišljeno, kar želim storiti.

390
00:17:08,050 --> 00:17:10,210
Preprosto vtipkate ime
očitno ne zadostuje.

391
00:17:10,210 --> 00:17:15,134
Tako opozarjajo, da je bil drugi
tag, image, img na kratko.

392
00:17:15,134 --> 00:17:17,550
To je samo zato, ker so ljudje
Ne maram tipa polne besede.

393
00:17:17,550 --> 00:17:19,050
In potem lahko naredimo vir = "cat.jpg".

394
00:17:19,050 --> 00:17:21,470

395
00:17:21,470 --> 00:17:23,550
>> In zdaj bom naredil
ena stvar drugačna tukaj.

396
00:17:23,550 --> 00:17:25,390
Čeprav vse
naši oznake imajo doslej

397
00:17:25,390 --> 00:17:28,086
imel ta pojem
začetek tag in konec tag,

398
00:17:28,086 --> 00:17:30,210
da ne res, da
Občutek za sliko, kajne?

399
00:17:30,210 --> 00:17:32,430
Slika je bodisi obstaja ali ne obstaja.

400
00:17:32,430 --> 00:17:36,650
In tako so prišli so ljudje
z enostavnejšo konvencije.

401
00:17:36,650 --> 00:17:40,310
Ko imate tablico, da lahko tako
začeti in končati na isti time--

402
00:17:40,310 --> 00:17:43,790
je lahko prazna, tako da le speak--
postaviti poševnico v notranjosti značke

403
00:17:43,790 --> 00:17:44,710
na samem koncu.

404
00:17:44,710 --> 00:17:45,776

405
00:17:45,776 --> 00:17:47,150
Zdaj pa grem nazaj v mojem brskalniku.

406
00:17:47,150 --> 00:17:50,377
Hit Reload Prekleto, kaj je narobe.

407
00:17:50,377 --> 00:17:52,460
Verjetno ste že videli ta
občasno na spletu,

408
00:17:52,460 --> 00:17:53,600
tudi če je ni tvoja krivda.

409
00:17:53,600 --> 00:17:54,766
To je napaka web strežnika.

410
00:17:54,766 --> 00:17:56,240
Kaj Ode to lahko pomenilo?

411
00:17:56,240 --> 00:17:57,450

412
00:17:57,450 --> 00:17:58,009
To je pokvarjen.

413
00:17:58,009 --> 00:17:59,300
To je, kjer je slika pripada.

414
00:17:59,300 --> 00:17:59,700
Ja?

415
00:17:59,700 --> 00:18:01,560
>> OBČINSTVO: Ampak to ne
imajo dostop do slike.

416
00:18:01,560 --> 00:18:03,070
>> DAVID J Malan: To ne
imajo dostop do slike.

417
00:18:03,070 --> 00:18:05,230
To, ali še huje, morda
sploh ne obstaja.

418
00:18:05,230 --> 00:18:06,729
Poglejmo, če ne moremo diagnosticirati, da.

419
00:18:06,729 --> 00:18:09,390
Spomnimo, od zadnjič, da če
v Chromu v napravi,

420
00:18:09,390 --> 00:18:11,870
ali celo na vašem Mac ali PC,
greš v meni za razvijalce

421
00:18:11,870 --> 00:18:14,650
in pojdite na Orodja za razvijalce
opcija, ki verjetno ste

422
00:18:14,650 --> 00:18:16,850
ne uporabljajo veliko ali kdaj.

423
00:18:16,850 --> 00:18:20,780
In če grem Network
in ponovno naložite stran,

424
00:18:20,780 --> 00:18:24,110
kaj je dejansko videti na HTTP
zahteva, da so v teku.

425
00:18:24,110 --> 00:18:28,400
>> Izgleda, da je hello.html
res OK, torej 200.

426
00:18:28,400 --> 00:18:30,630
Vendar cat.jpg je 403.

427
00:18:30,630 --> 00:18:31,650
Tako da to ni 404.

428
00:18:31,650 --> 00:18:33,490
Datoteka verjetno obstaja.

429
00:18:33,490 --> 00:18:35,250
403 pomeni prepovedano.

430
00:18:35,250 --> 00:18:37,790
Tako da je to malo zmedeno.

431
00:18:37,790 --> 00:18:42,340
Jaz bom šel nazaj
na moj terminala okno.

432
00:18:42,340 --> 00:18:43,700
Dovolite mi, da povečate tukaj.

433
00:18:43,700 --> 00:18:44,750
In mi naredil ls.

434
00:18:44,750 --> 00:18:46,430
Tam te iste datoteke.

435
00:18:46,430 --> 00:18:49,410
>> Zdaj pa mi naredil ls-l,
ki ste verjetno

436
00:18:49,410 --> 00:18:53,350
uporablja pred pogledati datoteko
Velikosti morda ali žige.

437
00:18:53,350 --> 00:18:55,590
In vidimo cel kup
ogromno informacij.

438
00:18:55,590 --> 00:18:57,040
Vendar pa opazili nekaj podrobnosti.

439
00:18:57,040 --> 00:19:01,660
Tukaj je hello.html v tem
veslati tukaj in tukaj je cat.jpg.

440
00:19:01,660 --> 00:19:02,934

441
00:19:02,934 --> 00:19:05,850
In to je samo aparat pa
uporabniku prijazen s poudarjanjem JPEG je

442
00:19:05,850 --> 00:19:07,380
v vijolični, kot je ta.

443
00:19:07,380 --> 00:19:11,470
Ampak kaj je drugače zraven
velikost datoteke in ime datoteke?

444
00:19:11,470 --> 00:19:13,438

445
00:19:13,438 --> 00:19:14,754
>> OBČINSTVO: [neslišno].

446
00:19:14,754 --> 00:19:16,920
DAVID Malan J: Ja, tam je
dva R je tukaj.

447
00:19:16,920 --> 00:19:20,170
Opažati hello.html se je dogajalo.

448
00:19:20,170 --> 00:19:24,050
Tako se izkaže, da ime
ta imenik javnost je pomembno.

449
00:19:24,050 --> 00:19:26,400
Kaj v tem imeniku
je mišljeno, da bo javno.

450
00:19:26,400 --> 00:19:28,790
Ampak to ni dovolj,
samo da spustite datoteke tam.

451
00:19:28,790 --> 00:19:31,480
Prav tako je treba spremeniti
Način datotek,

452
00:19:31,480 --> 00:19:35,180
spreminjanje dovoljenj
Datoteka proaktivno ne

453
00:19:35,180 --> 00:19:37,650
je privzeta nastavitev,
ki je, da bi le lahko preberete

454
00:19:37,650 --> 00:19:39,220
in napisati, da sem lastnik.

455
00:19:39,220 --> 00:19:43,540
Hočem ves svet vsakogar do
lahko prebrali mojo kartoteko, tako rekoč.

456
00:19:43,540 --> 00:19:44,950
Preberite samo pomeni, da si jo ogledate.

457
00:19:44,950 --> 00:19:49,780
>> In res, kot boste videli v problemu
nastavite sedem, to je tisto, srednja teh romov.

458
00:19:49,780 --> 00:19:53,160
Sredina teh dveh R je pustil vse
drugje na svetu lahko preberete tudi,

459
00:19:53,160 --> 00:19:55,300
zlasti sedaj,
to je v tem imeniku.

460
00:19:55,300 --> 00:19:59,620
Torej najpreprostejši način za odpravo tega je, da
pojdi na moj poziv in ne chmod za spremembe

461
00:19:59,620 --> 00:20:05,580
Način in naredite + R, v celoti,
vsi, vsi, plus r za branje,

462
00:20:05,580 --> 00:20:07,944
in nato cat.jpg Enter.

463
00:20:07,944 --> 00:20:10,360
Nič ne zdi, da se zgodi, kar
ponavadi pomeni nekaj dobrega.

464
00:20:10,360 --> 00:20:13,850
Torej ls-l again-- zdaj
oglejmo cat.jpg.

465
00:20:13,850 --> 00:20:15,750
In to dovoljenje
Zdi se, da so se spremenile.

466
00:20:15,750 --> 00:20:18,670
Kot prahi, če bi
napaka in si, na primer,

467
00:20:18,670 --> 00:20:23,210
pravkar your-- ne know-- esej
dostopni javnosti po nesreči,

468
00:20:23,210 --> 00:20:25,480
lahko storite nasprotno, chmod a-r.

469
00:20:25,480 --> 00:20:25,909

470
00:20:25,909 --> 00:20:28,200
Čeprav odkrito povedano, ne bi smeli
biti v javni imenik

471
00:20:28,200 --> 00:20:29,760
vseeno, če je to problem.

472
00:20:29,760 --> 00:20:32,475
>> Torej, zdaj gremo nazaj
moj brskalnik in osveži.

473
00:20:32,475 --> 00:20:32,904

474
00:20:32,904 --> 00:20:34,820
In bom, da kliknete
malo Ghostbusters

475
00:20:34,820 --> 00:20:38,030
Simbol za brisanje tisti del
zaslon tako da bomo lahko videli nove zahteve.

476
00:20:38,030 --> 00:20:40,630
In res, tu je
Grump Cat od prej.

477
00:20:40,630 --> 00:20:43,010
Toda še bolj pomembno,
tehnično, obstaja

478
00:20:43,010 --> 00:20:45,565
Številka 200, ki
pomeni, da imamo v redu.

479
00:20:45,565 --> 00:20:47,190
Vse je v redu, tako da je vse lepo in prav.

480
00:20:47,190 --> 00:20:48,940
Vendar mi ne bi
Najboljši spletnih strani,

481
00:20:48,940 --> 00:20:51,967
niti ne bomo poskušali pretežko
bi fanciest spletnih strani danes.

482
00:20:51,967 --> 00:20:54,550
Vendar pa vsaj nekaj narediti
Pred rožljanje super pozna

483
00:20:54,550 --> 00:20:56,030
off nekaj drugih oznak.

484
00:20:56,030 --> 00:20:58,470
Torej domnevam, da ne samo želim mačko tukaj.

485
00:20:58,470 --> 00:21:02,530
Recimo, pravzaprav hočem to
cat povezavo do nečesa.

486
00:21:02,530 --> 00:21:07,210
>> Sem lahko, na primer,
narediti kaj takega.

487
00:21:07,210 --> 00:21:08,580

488
00:21:08,580 --> 00:21:12,890
za sidro href za
hiper reference equals--

489
00:21:12,890 --> 00:21:17,440
in kaj je samo nekaj
kot www.google.com blizu

490
00:21:17,440 --> 00:21:19,540
citiram tesno nosilec.

491
00:21:19,540 --> 00:21:22,000
In zdaj iščejo mačke.

492
00:21:22,000 --> 00:21:23,520
Zapri sidro tag.

493
00:21:23,520 --> 00:21:26,760
Torej, to ima samo eno vrsto
v temelju nov podatek.

494
00:21:26,760 --> 00:21:28,190
Oznaka je seveda drugačna.

495
00:21:28,190 --> 00:21:31,770
To je ime za sidro
href ali hiper reference.

496
00:21:31,770 --> 00:21:35,269
>> Vendar je še pomembneje, tam je
to skladenjsko funkcijo tukaj.

497
00:21:35,269 --> 00:21:37,810
To je tisto, kar bomo začeli kliče
Ne tag, vendar atribut.

498
00:21:37,810 --> 00:21:40,830
In atribut je nekaj,
modificira obnašanje etiketo.

499
00:21:40,830 --> 00:21:45,400
In ta atribut, href, sredstva
spremeniti obnašanje tega sidra

500
00:21:45,400 --> 00:21:48,430
tako da, ko je to kliknil,
gre na ta URL tukaj.

501
00:21:48,430 --> 00:21:50,330
In seveda, da URL je Google.

502
00:21:50,330 --> 00:21:53,951
>> Medtem, kaj je to
besedilo tukaj bo?

503
00:21:53,951 --> 00:21:55,950
No, to se dogaja, da se
kaj človek dejansko

504
00:21:55,950 --> 00:21:58,470
vidi kot podčrtano
povezave, tako enostavno, kot da.

505
00:21:58,470 --> 00:21:59,220
Torej poskusimo to.

506
00:21:59,220 --> 00:21:59,980
Dovolite mi, da jo shranite.

507
00:21:59,980 --> 00:22:01,650
Še vedno sem v hello.html.

508
00:22:01,650 --> 00:22:05,360
Toda v različicah spletnih, boste videli,
dejanska imena datotek bomo vnaprej pripravljenih.

509
00:22:05,360 --> 00:22:06,805
Dovolite mi, da gredo naprej in osvežite.

510
00:22:06,805 --> 00:22:08,680
In zdaj je zelo
underwhelming stran vedno.

511
00:22:08,680 --> 00:22:10,910
Ampak, če sem hover nad there--
in to je malo majhen,

512
00:22:10,910 --> 00:22:13,576
ampak-- si lahko ogledate na dnu
levem kotu zaslona,

513
00:22:13,576 --> 00:22:15,242
to je v resnici dogaja, da google.com.

514
00:22:15,242 --> 00:22:19,280
In če sem kliknite, da se bo ta
stepemo mi pot do dejanske Google.

515
00:22:19,280 --> 00:22:22,610
>> Ampak obvestilo, tu priložnost za
izkoriščanje, tako kot stran.

516
00:22:22,610 --> 00:22:25,150
In se bomo vrnili na drugo
Vprašanja varnosti pred dolgo.

517
00:22:25,150 --> 00:22:29,290
Zato, ker je ta dihotomija
med, kam greš in kaj pravite,

518
00:22:29,290 --> 00:22:34,722
ki jo lahko naredite nekaj podobnega
this-- http://www.google.com.

519
00:22:34,722 --> 00:22:37,134
OK, zdaj pa, če sem osvežite
Po shranjevanju to stran,

520
00:22:37,134 --> 00:22:38,800
izgleda, da bom šel na Google.

521
00:22:38,800 --> 00:22:40,966
Vendar ni razloga, da sem
morali iti na Google, kajne?

522
00:22:40,966 --> 00:22:47,460
Jaz bi dejansko šel za nekaj podobnega
badguy.com, osvežite stran tukaj.

523
00:22:47,460 --> 00:22:49,750
In obvestilo, da še vedno izgleda kot Google.

524
00:22:49,750 --> 00:22:52,020
In le če sem oster
Dovolj, da veje nad tukaj

525
00:22:52,020 --> 00:22:54,770
storiti vidim, da je celo dogaja, da
pojdi na drugo mesto.

526
00:22:54,770 --> 00:22:57,400
>> Torej, če ste kdaj gotten
email, še posebej,

527
00:22:57,400 --> 00:22:59,610
eden od Paypal, ali
Predvsem iz Paypala

528
00:22:59,610 --> 00:23:01,830
vas prosim, da se prijavite
na svoj račun, to

529
00:23:01,830 --> 00:23:06,380
Zato bi smeli nikoli
kdaj klikajo na povezave v e-pošto,

530
00:23:06,380 --> 00:23:07,930
odkrito povedano, vse povezave v e-pošto.

531
00:23:07,930 --> 00:23:10,380
Če veste, da imate dejansko
Denar na Paypal ali banke

532
00:23:10,380 --> 00:23:14,250
Amerike ali Fidelity ali katerokoli
Spletna stran, ročno vnesite v.

533
00:23:14,250 --> 00:23:17,530
Ker je videti, kako enostavno je, da
trik nekoga v predstavitvi kaj

534
00:23:17,530 --> 00:23:18,526
Izgleda povezavo.

535
00:23:18,526 --> 00:23:20,400
Ampak to dejansko lahko
iti absolutno nikamor.

536
00:23:20,400 --> 00:23:23,301
>> In tam je veliko večja
grožnje, kot je ta.

537
00:23:23,301 --> 00:23:25,300
V bistvu, to je malo
dne tangenta zdaj, ampak ena

538
00:23:25,300 --> 00:23:28,430
najboljših, ki sem jih kdaj videla
ki je bil zato ustavljen,

539
00:23:28,430 --> 00:23:34,060
je nekdo vodil ljudi
to-- tako da to bi lahko rekli,

540
00:23:34,060 --> 00:23:37,660
Kliknite tukaj, da se prijavite v svoj
račun, bančni račun.

541
00:23:37,660 --> 00:23:40,985
In to je bila Bank of West.

542
00:23:40,985 --> 00:23:43,030

543
00:23:43,030 --> 00:23:44,250
>> Torej, kdo je to kupil.

544
00:23:44,250 --> 00:23:47,090
In to je malo lažje videti
je v pisavi mono razporejene povečani

545
00:23:47,090 --> 00:23:49,190
na na 30-foot projektorjem.

546
00:23:49,190 --> 00:23:51,720
Toda, ko je majhna pisava
e-poštni naslov, ki ste prejemali,

547
00:23:51,720 --> 00:23:54,690
to izgleda bankofthewest.com,
ne bankofthevvest.com,

548
00:23:54,690 --> 00:23:58,230
nekdo, ki je plačal 10 evrov kupiti.

549
00:23:58,230 --> 00:24:00,840
In potem je ta jih je pripeljala do
ekvivalent nekaj slabih strani.

550
00:24:00,840 --> 00:24:05,540
>> In videli boste, too-- pravzaprav ne moremo storiti
this-- če grem na sami strani,

551
00:24:05,540 --> 00:24:10,335
bankofthewest.com, še enkrat,
odpoklic od zadnjega obiska

552
00:24:10,335 --> 00:24:13,210
da, če je to njihova spletna stran in
ste radovedni, kako deluje,

553
00:24:13,210 --> 00:24:15,610
lahko zagotovo iti
Orodja za razvijalce Chromu.

554
00:24:15,610 --> 00:24:18,890
In si lahko ogledate vse
HTML je lepo oblikovana.

555
00:24:18,890 --> 00:24:20,890
>> Temveč bolj do točke,
ste cam-- dajmo zapreti

556
00:24:20,890 --> 00:24:24,760
this-- lahko greš na View
Developer View Source.

557
00:24:24,760 --> 00:24:25,770

558
00:24:25,770 --> 00:24:28,350
Zakaj ne samo kopirati
vse to In potem sem

559
00:24:28,350 --> 00:24:31,630
Lahko greš v mojo malo okno gedit
tu in da bi svoj lasten spletni strani.

560
00:24:31,630 --> 00:24:33,210
Shrani to v hello.html.

561
00:24:33,210 --> 00:24:36,770
In verjetno, da bo to prekinil,
ker to ni tako enostavno ponavadi.

562
00:24:36,770 --> 00:24:41,590
Ampak zdaj, če sem osvežite svojo stran na
moje CS50 Appliance in hit reload,

563
00:24:41,590 --> 00:24:42,990
OK, nekaj stvari zlomil.

564
00:24:42,990 --> 00:24:45,750
Ampak jaz sem zelo blizu, da imajo
moje bančne spletne strani, kajne?

565
00:24:45,750 --> 00:24:46,570
Vse to HTML--

566
00:24:46,570 --> 00:24:47,370
>> [Smeh]

567
00:24:47,370 --> 00:24:49,210
>> DAVID J Malan: --I
ni actually-- in si

568
00:24:49,210 --> 00:24:52,210
vem, da je nekdo tam zunaj, ki
bi dejansko kliknite te povezave tudi.

569
00:24:52,210 --> 00:24:54,864
Torej je jasno, nekatere stvari zlomil.

570
00:24:54,864 --> 00:24:56,780
Ampak to se dogaja, da vodijo
nam v razpravo,

571
00:24:56,780 --> 00:25:00,810
nepotrebnem zdaj, o tem, kaj
CSS, kaskadnih slogov, so,

572
00:25:00,810 --> 00:25:03,410
in kako ti dejansko
prenos drugih datotek HTML

573
00:25:03,410 --> 00:25:06,140
in JPEG datoteke GIF datoteke, da
Spletna stran se lahko uporablja.

574
00:25:06,140 --> 00:25:07,960
Ampak vse to je accomplishable.

575
00:25:07,960 --> 00:25:11,110
Ampak res izvira na
te zelo preproste tolči.

576
00:25:11,110 --> 00:25:14,450
>> Torej, zdaj naj samo površno preletite
Nekaj ​​drugih primerov HTML

577
00:25:14,450 --> 00:25:16,680
samo da vam občutek
kaj še lahko storite.

578
00:25:16,680 --> 00:25:18,670
Na primer, to je list.html.

579
00:25:18,670 --> 00:25:23,240
Recimo, da sem želel, da bi spletno stran
s seznamom hiš v quad.

580
00:25:23,240 --> 00:25:28,960
Jaz lahko uporabite ul oznako za Neurejen
seznam in nato element seznama otrok

581
00:25:28,960 --> 00:25:33,760
nato pa ponovitev over-- ali seznam,
rather-- hiše v vprašanju.

582
00:25:33,760 --> 00:25:36,080
>> In če sem to odprla, naredimo to.

583
00:25:36,080 --> 00:25:40,670
Pojdimo, da ne hello.html,
ampak list.html.

584
00:25:40,670 --> 00:25:42,160
Prekleto.

585
00:25:42,160 --> 00:25:43,000
Kako naj to popravim?

586
00:25:43,000 --> 00:25:45,679

587
00:25:45,679 --> 00:25:47,220
To je isto vprašanje kot prej, kajne?

588
00:25:47,220 --> 00:25:52,510
Torej, kaj naj storim chmod-- oops--
chmod + r list.html.

589
00:25:52,510 --> 00:25:54,610

590
00:25:54,610 --> 00:25:59,610
In zdaj, če grem nazaj v mojem brskalniku
in kliknite Reload, tam je.

591
00:25:59,610 --> 00:26:02,360
Torej, če ste kdaj želeli, da bi
označen seznam, lahko to storite.

592
00:26:02,360 --> 00:26:06,210
Če želite biti super fancy in da
urejen seznam, ne Neurejen seznam,

593
00:26:06,210 --> 00:26:10,170
spremeniti tiste, ol, osvežite stran, in
Zdaj bo brskalnik številka za vas.

594
00:26:10,170 --> 00:26:11,241
>> Kaj še lahko storimo?

595
00:26:11,241 --> 00:26:13,990
No, nekaj others-- če
imaš dolge odstavke text--

596
00:26:13,990 --> 00:26:15,698
na primer, nekatere
Latinsko besedilo kot this--

597
00:26:15,698 --> 00:26:20,730
in si ga želijo v ločenih točkah,
odprt p, blizu p za odstavkom oznako.

598
00:26:20,730 --> 00:26:22,010
In to znova in znova.

599
00:26:22,010 --> 00:26:26,600
In če sem zdaj odprla to datoteko,
paragraphs.html, no, to

600
00:26:26,600 --> 00:26:27,570
postaja nadležno.

601
00:26:27,570 --> 00:26:34,320
Zdaj pa pojdi nazaj v moje
poziv, chmod a + r r zvezdo .html--

602
00:26:34,320 --> 00:26:36,099
lepo wild card tako rekoč.

603
00:26:36,099 --> 00:26:37,890
To bi bilo treba določiti vse
ti problemi za mano.

604
00:26:37,890 --> 00:26:38,990
Oglejmo osvežite.

605
00:26:38,990 --> 00:26:40,500
Tam je tri odstavke.

606
00:26:40,500 --> 00:26:42,930
>> In zdaj gremo naprej
in odprla eno drugo.

607
00:26:42,930 --> 00:26:44,310
Kaj pa mizo?

608
00:26:44,310 --> 00:26:46,440
Opazili boste, namizne videz
malo bolj zapletena.

609
00:26:46,440 --> 00:26:49,110
Ampak to je isto idea--
odprti tag, odprti tag,

610
00:26:49,110 --> 00:26:51,360
open, open, open, close tag, tag odprta.

611
00:26:51,360 --> 00:26:54,410
In to se zgodi, da stoji
miza, katere meja je očitno

612
00:26:54,410 --> 00:26:58,500
bo debelina 1-- karkoli
da means-- vrstica tabele, tabela

613
00:26:58,500 --> 00:27:00,320
Podatki, ki pomeni celico.

614
00:27:00,320 --> 00:27:03,840
In če se vrnem k mojim brskalnikom
tukaj in pojdite na table.html,

615
00:27:03,840 --> 00:27:05,840
si lahko ogledate nekaj
kot je ta, grd.

616
00:27:05,840 --> 00:27:07,840
Ampak bomo prišli do točke
kjer bomo lahko dejansko

617
00:27:07,840 --> 00:27:09,260
postavil lepši od tega.

618
00:27:09,260 --> 00:27:10,530
>> Zato mi dovolite, določajo, za zdaj.

619
00:27:10,530 --> 00:27:11,870
Tam je šopki za več oznak.

620
00:27:11,870 --> 00:27:15,225
In HTML je čudovito, da poberem
ker, odkrito povedano, vse, kar morate storiti,

621
00:27:15,225 --> 00:27:17,600
je pogled na obstoječih spletnih straneh
s katerimi ste seznanjeni.

622
00:27:17,600 --> 00:27:20,340
In ste kot, oh, to je, kako
so to storili estetsko.

623
00:27:20,340 --> 00:27:23,159
>> Ali si lahko pogledate vsako spletu
vir, kako HTML deluje,

624
00:27:23,159 --> 00:27:25,700
in videli boste, da obstaja
Celoten besednjak drugih oznak.

625
00:27:25,700 --> 00:27:30,110
Ampak s preprostim duševno modelu
samo, da je skoraj vsaka tag odprete

626
00:27:30,110 --> 00:27:33,620
je treba zapreti, je res
ne zadostuje, da samega sebe naučiti

627
00:27:33,620 --> 00:27:36,950
HTML po razumem
te osnovne ideje oznak

628
00:27:36,950 --> 00:27:40,520
in atributi in dobro formed
da smo se pogovarjali o tem,

629
00:27:40,520 --> 00:27:44,697
zapiranje karkoli, da bi se nam odpre
tako da se ne mešajo brskalnik.

630
00:27:44,697 --> 00:27:46,780
Torej, kaj je sedaj sprejeti, da je to
bolj zanimivo ravni

631
00:27:46,780 --> 00:27:48,100
ki ga bo dejansko.

632
00:27:48,100 --> 00:27:51,095
In pojdimo na moj Mac
Tukaj, na google.com.

633
00:27:51,095 --> 00:27:52,280

634
00:27:52,280 --> 00:27:54,020
In zdaj notice-- naredimo to.

635
00:27:54,020 --> 00:27:57,280
Jaz sem gong iti
Nastavitve, Nastavitve iskanja.

636
00:27:57,280 --> 00:28:01,070
Želim, da izključite to siten trenutek
Rezultati stvar, kjer je takoj

637
00:28:01,070 --> 00:28:02,450
začne odgovor na vaše tipkanje.

638
00:28:02,450 --> 00:28:05,300
Naredimo to starejšo šolo, tako
smo dejansko videli, kaj se dogaja.

639
00:28:05,300 --> 00:28:08,260
>> Tako da bom rešiti moj
Google nastavitve tukaj.

640
00:28:08,260 --> 00:28:11,160
In zdaj notice-- jaz grem na
poiskati nekaj podobnega mačke.

641
00:28:11,160 --> 00:28:14,500
In to še vedno počne avto
popolna tod temveč temelji na stvari

642
00:28:14,500 --> 00:28:15,970
ljudje so se vnesli v preteklosti.

643
00:28:15,970 --> 00:28:17,490
Ampak obvestilo, kaj se bo zgodilo.

644
00:28:17,490 --> 00:28:20,272
>> V URL v trenutku
je to, samo google.com.

645
00:28:20,272 --> 00:28:22,650
In tehnično, to je poševnica.

646
00:28:22,650 --> 00:28:25,910
Google je samo varčevanje znak
in ne nas, ki prikazuje.

647
00:28:25,910 --> 00:28:30,400
So nam kaže https, samo
da je super prepričala, da smo

648
00:28:30,400 --> 00:28:32,850
na varnem ali šifrirano stran.

649
00:28:32,850 --> 00:28:35,690
>> Zato naj gredo naprej in iskanje za mačke.

650
00:28:35,690 --> 00:28:37,670
Zdaj je to res dobil
velika hitro.

651
00:28:37,670 --> 00:28:39,470
Poglej dolžini ta URL.

652
00:28:39,470 --> 00:28:43,070
Vendar se je izkazalo, da je večina teh stvari
V URL-ju je pravzaprav precej neuporabna.

653
00:28:43,070 --> 00:28:45,320
Jaz bom za začetek brisanje
stvari, ki jih ne razumem.

654
00:28:45,320 --> 00:28:46,560

655
00:28:46,560 --> 00:28:47,360
Vidim mačke.

656
00:28:47,360 --> 00:28:48,470
Razumem mačke.

657
00:28:48,470 --> 00:28:50,380
Ne vem, zakaj so mačke spet tam.

658
00:28:50,380 --> 00:28:52,620
Res ne vem,
kaj je to nesmisel je.

659
00:28:52,620 --> 00:28:56,030
Tako da sem le, da bo naprej
poudarjanje in brisanje stvari

660
00:28:56,030 --> 00:28:59,905
da ne razumem,
destilacijo URL v samo to.

661
00:28:59,905 --> 00:29:00,920

662
00:29:00,920 --> 00:29:02,270
>> Zdaj pa mi se enkrat začne.

663
00:29:02,270 --> 00:29:03,814
Izgleda, da Google še vedno deluje.

664
00:29:03,814 --> 00:29:06,980
Torej, iz neznanega razloga, oni dodajanje
Veliko stvari za privzeto svojega URL.

665
00:29:06,980 --> 00:29:09,000
Vendar pa to ni nujno potrebno.

666
00:29:09,000 --> 00:29:10,340
Torej, kaj je lepo, o tem?

667
00:29:10,340 --> 00:29:13,630
No, naj gredo naprej in
odpirajo inšpektor Chrome.

668
00:29:13,630 --> 00:29:15,960
Tam je malo bližnjica miška za to.

669
00:29:15,960 --> 00:29:17,360
>> Pojdite na jeziček Network.

670
00:29:17,360 --> 00:29:19,340
In zdaj naj mi osvežite
ta stran še enkrat.

671
00:29:19,340 --> 00:29:20,280
In držim Shift.

672
00:29:20,280 --> 00:29:22,520
Naj omenim, da brskalniki
ponavadi predpomnilnik ali shranite

673
00:29:22,520 --> 00:29:24,697
informacije samo zavoljo učinkovitost je.

674
00:29:24,697 --> 00:29:27,280
Ampak ponavadi, držite Shift in
prekladanja bo prisilila vse

675
00:29:27,280 --> 00:29:28,994
začeti znova od začetka.

676
00:29:28,994 --> 00:29:30,410
In to je tisto, kar želim storiti tukaj.

677
00:29:30,410 --> 00:29:33,550
>> In opazil, vsi ti
vrstice, ki so pravkar pojavil.

678
00:29:33,550 --> 00:29:37,920
Izkazalo se je, da je v danem spletu
stran, lahko pride samo ena datoteka

679
00:29:37,920 --> 00:29:43,500
involved-- hello.html-- ali obstaja
morda 52, kot v tem primeru.

680
00:29:43,500 --> 00:29:45,820
Ko sem obiskal google.com,
očitno je, da moj brskalnik

681
00:29:45,820 --> 00:29:49,650
začenja 52 ločenih zahteve HTTP.

682
00:29:49,650 --> 00:29:50,520
Zakaj je tako?

683
00:29:50,520 --> 00:29:53,380
>> No, poglej, kaj je notri
ta spletna stran, do vrha.

684
00:29:53,380 --> 00:29:55,620
Tam ni le besedilo,
vendar pa dejanske slike

685
00:29:55,620 --> 00:29:57,130
mačk več kot v desno.

686
00:29:57,130 --> 00:29:59,110
Tam je barvita logo tu gor na levi strani.

687
00:29:59,110 --> 00:30:01,750
Tam je vse od teh ikon
za mikrofon in tako naprej.

688
00:30:01,750 --> 00:30:05,130
Obstaja veliko kosov, ki gradi
bloki, scratch kosov, če hočete,

689
00:30:05,130 --> 00:30:06,250
na tej spletni strani.

690
00:30:06,250 --> 00:30:10,310
In kaj brskalnik je delal na
dobili zelo prvo datoteko, ki

691
00:30:10,310 --> 00:30:16,180
je ta vrstica tod je v bistvu
ponavljanjem preko HTML vrh

692
00:30:16,180 --> 00:30:19,880
navzdol, levo in desno, ki išče
stvari, kot so slikovne oznake ali druge oznake

693
00:30:19,880 --> 00:30:23,160
da se omenjajo druge datoteke in
ko jih vidi, gre in jih puščati

694
00:30:23,160 --> 00:30:26,050
preko HTTP, uspešna celota
envelope metafora,

695
00:30:26,050 --> 00:30:29,670
in jih nato prikaže v
primerno mesto v spletni strani.

696
00:30:29,670 --> 00:30:33,370
>> Toda opazil sem, če sem se osredotočil na
Prvi met, iskanje mačke

697
00:30:33,370 --> 00:30:37,090
opazili, da je res, da je z uporabo HTTP 1.1.

698
00:30:37,090 --> 00:30:41,690
In na žalost, Google
Chrome zdaj v različici 39

699
00:30:41,690 --> 00:30:45,110
je nekako dumbing stvari navzdol in
nam ne prikazuje dejanske glave.

700
00:30:45,110 --> 00:30:49,680
Toda kaj se je dejansko poslal, je prošnja
da ni drastično, ampak / search? q = mačke.

701
00:30:49,680 --> 00:30:52,830

702
00:30:52,830 --> 00:30:54,340
>> Zdaj, zakaj je to pomembno?

703
00:30:54,340 --> 00:30:57,110
No, bom sklepati
iz tega, da če vam Google

704
00:30:57,110 --> 00:31:01,520
podpira poizvedbe tega obrazca, zakaj
jaz ne izvajajo svojo lastno iskanje

705
00:31:01,520 --> 00:31:06,420
motor za CS50, ampak samo spredaj
konec, samo grafični uporabniški vmesnik.

706
00:31:06,420 --> 00:31:09,610
In bomo oddajajo zadnji konec,
Rezultati iskanja dejanski Googlu.

707
00:31:09,610 --> 00:31:10,510
>> Torej, kako lahko to storim?

708
00:31:10,510 --> 00:31:13,820
No, naj gredo v gedit tukaj.

709
00:31:13,820 --> 00:31:19,180
In mi gredo naprej in odprite
do, recimo, novo datoteko.

710
00:31:19,180 --> 00:31:22,280
In bom, da shranite to
začasno kot iskalna 0.html.

711
00:31:22,280 --> 00:31:25,111

712
00:31:25,111 --> 00:31:27,860
In potem na koncu, bomo hitro
pričakuje, da tisti, ki sem pre pripravljeni.

713
00:31:27,860 --> 00:31:30,190
>> In bom
hitro bič gor vrsto doc

714
00:31:30,190 --> 00:31:33,840
html odprti oklepaj html
blizu nosilec html.

715
00:31:33,840 --> 00:31:38,390
Potem bom naredil glavo
blizu glave open naslov CS50

716
00:31:38,390 --> 00:31:40,150
Iskanje namesto iskanja Google.

717
00:31:40,150 --> 00:31:43,480
Tukaj bom imel
telo, tukaj blizu telesa.

718
00:31:43,480 --> 00:31:45,835
In zdaj moram CS50 iskanje.

719
00:31:45,835 --> 00:31:47,710
In pravzaprav, kaj je
graditi to postopoma.

720
00:31:47,710 --> 00:31:51,043
Bom, da gredo naprej in zaprite to in
pravzaprav ga dal v mojem javnem imeniku.

721
00:31:51,043 --> 00:31:52,730
Torej daj mi samo en trenutek.

722
00:31:52,730 --> 00:31:55,390
iskanje-0.html-- bom
časovno ga pokličete search.html.

723
00:31:55,390 --> 00:31:56,600

724
00:31:56,600 --> 00:31:59,750
Jaz bom to chmod a + r search.html.

725
00:31:59,750 --> 00:32:01,072

726
00:32:01,072 --> 00:32:02,280
In zdaj grem, da ga odprete.

727
00:32:02,280 --> 00:32:03,224

728
00:32:03,224 --> 00:32:04,390
Vse je v redu, tako da je bilo hitro.

729
00:32:04,390 --> 00:32:06,800
Vendar je bil cilj zgolj
da nas pridete do točke

730
00:32:06,800 --> 00:32:09,630
da ima to besedilo
datoteko imenovano search.html.

731
00:32:09,630 --> 00:32:10,940

732
00:32:10,940 --> 00:32:12,790
Torej ni veliko na pogled še.

733
00:32:12,790 --> 00:32:16,970
Pravzaprav, če sem šel v mojem brskalniku, in
pojdite na search.html, da je vse, kar je.

734
00:32:16,970 --> 00:32:17,720
Ampak veš kaj?

735
00:32:17,720 --> 00:32:19,000
Lahko sem malo Ljubitelj.

736
00:32:19,000 --> 00:32:22,710
Sem bral v knjigi, da obstaja
Naslov tag imenovano H1.

737
00:32:22,710 --> 00:32:26,100
In bom, da gredo naprej in
uporabi to odprto H1 in tesno H1.

738
00:32:26,100 --> 00:32:27,220
Naložite stran.

739
00:32:27,220 --> 00:32:29,600
In zdaj je večji in drznejši,
ni vse tako zanimivo,

740
00:32:29,600 --> 00:32:32,399
ampak vsaj to strukturno
bolj zanimivo.

741
00:32:32,399 --> 00:32:33,940
Zdaj pa naj vam predstavim še eno oznako.

742
00:32:33,940 --> 00:32:36,500
Izkazalo se je, da je oblika tag.

743
00:32:36,500 --> 00:32:38,400
In mi zapre to oznako.

744
00:32:38,400 --> 00:32:40,830
In se izkaže, tam je
input tag, ki

745
00:32:40,830 --> 00:32:44,600
ima lastnost, imenovano tipa, ki
je podatkovni tip polja,

746
00:32:44,600 --> 00:32:45,200
če hočete.

747
00:32:45,200 --> 00:32:47,050
In se bo od tipa besedila.

748
00:32:47,050 --> 00:32:52,200
In njegova vrednost se dogaja
biti CS50 iskanje.

749
00:32:52,200 --> 00:32:53,850
Zapri tag.

750
00:32:53,850 --> 00:32:57,100
In tam se dogaja, da ne pojem
odpiranje in zapiranje s posebnimi oznakami.

751
00:32:57,100 --> 00:33:00,300
>> Naj grem nazaj tja in
glej, kaj se dogaja, osvežite.

752
00:33:00,300 --> 00:33:01,380
Postaja zanimivo.

753
00:33:01,380 --> 00:33:02,950
Izgleda, da je to polje besedila.

754
00:33:02,950 --> 00:33:04,080

755
00:33:04,080 --> 00:33:06,999
In v resnici, nisem hotel
postaviti vrednost še tam.

756
00:33:06,999 --> 00:33:10,040
Naj grem nazaj in dejansko dobili
znebili te vrednosti, da bo enostavno.

757
00:33:10,040 --> 00:33:12,939
Namesto vrednosti, kar sem hotel
da bi to stvar bilo ime.

758
00:33:12,939 --> 00:33:15,230
In ne vem, kaj je to,
tako da bom prišel nazaj na to.

759
00:33:15,230 --> 00:33:18,270
>> Ampak spodaj, da hočem
storiti vrste vhoda = predložiti.

760
00:33:18,270 --> 00:33:19,840

761
00:33:19,840 --> 00:33:22,120
In ta vrednost bo CS50 iskanje.

762
00:33:22,120 --> 00:33:24,850
In bomo videli, zakaj sem
preselil vrednost na to.

763
00:33:24,850 --> 00:33:28,900
Ko sem se osvežite, sem se zdi, da imajo zdaj
Začetki moje iskanje

764
00:33:28,900 --> 00:33:30,820
motor, super ostudno,
čeprav odkrito povedano, to je

765
00:33:30,820 --> 00:33:34,260
Ne daleč od tega, kar met
Googlov privzeta stran izgleda.

766
00:33:34,260 --> 00:33:37,950
>> Če grem zdaj tukaj, lahko vnesete
mačke in upajmo kliknite Najdi.

767
00:33:37,950 --> 00:33:40,380
Ampak nisem še čisto končali,
ker nisem izvajal,

768
00:33:40,380 --> 00:33:41,045
očitno, baze podatkov.

769
00:33:41,045 --> 00:33:42,940
Nisem obiskal
web za rezultate iskanja.

770
00:33:42,940 --> 00:33:44,840
Tako da moram za oddajanje, ki Googlu.

771
00:33:44,840 --> 00:33:46,290
Torej, kako naj to storim?

772
00:33:46,290 --> 00:33:49,170
>> No, najprej I
morali dodati in ukrepanje

773
00:33:49,170 --> 00:33:58,460
pripisovati mojo obliko oznake, ki
je http://www.google.com/search.

774
00:33:58,460 --> 00:34:01,180
In vem, da samo z njihovo
sklepati z natančno videti

775
00:34:01,180 --> 00:34:02,505
na njihov URL-jev.

776
00:34:02,505 --> 00:34:03,380
In zdaj si ugibati.

777
00:34:03,380 --> 00:34:09,090
Kaj naj bi to besedilo polje verjetno
se imenuje, na podlagi, kjer smo prišli

778
00:34:09,090 --> 00:34:09,754
od prej?

779
00:34:09,754 --> 00:34:11,896

780
00:34:11,896 --> 00:34:13,290
>> OBČINSTVO: q.

781
00:34:13,290 --> 00:34:14,370
>> DAVID J Malan: q.

782
00:34:14,370 --> 00:34:17,800
In pravzaprav ne potrebujemo vprašanje
označi se izkaže, ampak q je res to,

783
00:34:17,800 --> 00:34:20,489
q za poizvedbo verjetno s
privzeto, samo zato, ker je to

784
00:34:20,489 --> 00:34:23,060
kaj Larry in Sergey
prišel z leti.

785
00:34:23,060 --> 00:34:24,739
Torej, zdaj mi dovolite osvežite stran.

786
00:34:24,739 --> 00:34:26,409
Ni videti vse te različne.

787
00:34:26,409 --> 00:34:28,120
Zdaj pa gledam, kaj se dogaja.

788
00:34:28,120 --> 00:34:32,360
>> Če sem tipa pri mačkah in klik
CS50 Iskanje in izpustil,

789
00:34:32,360 --> 00:34:35,770
opazil sem dobil stepena
proč, da dejansko Googlu.

790
00:34:35,770 --> 00:34:38,150
Zdaj, Google je pa malo
siten, da oni

791
00:34:38,150 --> 00:34:41,877
dodajo dodaten parameter,
če hočete, na URL.

792
00:34:41,877 --> 00:34:43,960
To je vse dogaja
samodejno na Google strani.

793
00:34:43,960 --> 00:34:48,730
>> Pomemben del je, da sem se zdi,
da so ustvarili to prošnjo tukaj.

794
00:34:48,730 --> 00:34:50,179
In res je, da je tisto, kar se zgodi.

795
00:34:50,179 --> 00:34:53,040
Ko imate HTML, ki
izgleda takole, ta

796
00:34:53,040 --> 00:34:57,620
je neke vrste spletnih razvijalcev zapisa
Za rekel, pojdi naprej in ustvarite obrazec

797
00:34:57,620 --> 00:34:59,990
da, ko je predložen,
to se dogaja, da gredo na ta URL.

798
00:34:59,990 --> 00:35:03,430
In ko je URL, če
Vrednosti za stvari, kot so q,

799
00:35:03,430 --> 00:35:05,440
ne gre samo za ta URL.

800
00:35:05,440 --> 00:35:08,210
Pravzaprav, pojdite na vprašanje
znamka in je q = mačke.

801
00:35:08,210 --> 00:35:09,590

802
00:35:09,590 --> 00:35:13,060
Dodajte parameter,
HTTP parameter, kot je ta.

803
00:35:13,060 --> 00:35:15,590
>> In samo, da je super natančen,
kaj je bilo sklepati here--

804
00:35:15,590 --> 00:35:18,130
ampak bom bolj explicit-- je
da metoda želim uporabljati

805
00:35:18,130 --> 00:35:22,270
je dobil, namesto da bi nekaj podobnega
delovno mesto, ki ga bomo na koncu videli.

806
00:35:22,270 --> 00:35:27,710
Torej, na kratko, preprosto z razumevanjem
HTML in uporabo nekaterih dokaj enostavne oznake,

807
00:35:27,710 --> 00:35:30,610
zdaj lahko začeli ustvarjati
naše front end uporabnik

808
00:35:30,610 --> 00:35:32,850
vmesnik z iskanjem
motor za njim.

809
00:35:32,850 --> 00:35:34,800
>> Toda to je seveda precej grd.

810
00:35:34,800 --> 00:35:37,259
Torej, kaj me pravzaprav odpirajo
nekoliko boljša verzija.

811
00:35:37,259 --> 00:35:39,800
To je ena sem pripravljen v
napredovati, da ima nekaj pripomb.

812
00:35:39,800 --> 00:35:41,900
Vendar pa boste videli, da sem
zal je veliko poustvarili.

813
00:35:41,900 --> 00:35:44,150
Torej, to je na spletu že na voljo.

814
00:35:44,150 --> 00:35:48,050
In nisem se zgodi, da preemptively
pojdite na https samo, da ga bo enostavno.

815
00:35:48,050 --> 00:35:50,610
>> In zdaj pa odpirajo
Naslednja ponovitev tega.

816
00:35:50,610 --> 00:35:52,510
Je različica 1 namesto 0.

817
00:35:52,510 --> 00:35:55,315
Kaj skoči ven na vas, kot nekoliko
razlikuje v tem primeru?

818
00:35:55,315 --> 00:35:59,480

819
00:35:59,480 --> 00:36:00,440
>> OBČINSTVO: [neslišno].

820
00:36:00,440 --> 00:36:03,020
>> Ja, tam je to besedilo align center.

821
00:36:03,020 --> 00:36:04,590
To je malo čudno sem gor.

822
00:36:04,590 --> 00:36:06,150
Ampak to je res novo.

823
00:36:06,150 --> 00:36:07,800
In morda veš kaj se bo zgodilo.

824
00:36:07,800 --> 00:36:11,730
Če grem k mojim brskalnikom zdaj
in obiščite iskanje-1.html,

825
00:36:11,730 --> 00:36:13,090
to je skoraj isto stvar.

826
00:36:13,090 --> 00:36:15,705
Ampak to je korak bližje
pa malo bolj lepa.

827
00:36:15,705 --> 00:36:19,150
Še vedno je grd, ampak lepša, da
vsaj vse, kar je zdaj na sredini.

828
00:36:19,150 --> 00:36:23,470
>> Tako se izkaže, da kaj sem s pomočjo
je še en jezik, v celoti imenuje

829
00:36:23,470 --> 00:36:25,680
CSS, kaskadnih slogov.

830
00:36:25,680 --> 00:36:28,310
In CSS, odkrito povedano, je nekako
po mojem osebnem mnenju,

831
00:36:28,310 --> 00:36:29,775
atrociously oblikovan jezik.

832
00:36:29,775 --> 00:36:33,110
To je zelo nadležno, da se spomnimo
vsi različni podatki.

833
00:36:33,110 --> 00:36:38,479
Ampak to je tisto, kar stylizes
Celotna svetovnem spletu danes.

834
00:36:38,479 --> 00:36:39,270
Sem užalil nekoga.

835
00:36:39,270 --> 00:36:39,769
Vse je v redu.

836
00:36:39,769 --> 00:36:43,180
Torej, pojdimo nazaj in videti
kako smo dejansko uporabo tega.

837
00:36:43,180 --> 00:36:45,940
In se izkaže, vsaj to
pravzaprav zelo preprost jezik.

838
00:36:45,940 --> 00:36:49,470
To je le nekaj parov vrednosti ključev, lastnosti
in vrednote, lastnosti in vrednosti.

839
00:36:49,470 --> 00:36:52,080
Dejansko, tukaj je ena
to premoženje in vrednost.

840
00:36:52,080 --> 00:36:55,890
>> Preprosto z uporabo slog
atribut na mojem telesu tag

841
00:36:55,890 --> 00:37:00,360
in mu daje vrednost
Beseda debelega črevesa in drugo besedo,

842
00:37:00,360 --> 00:37:03,730
ali premoženje in vrednost,
Lahko vplivajo na estetiko

843
00:37:03,730 --> 00:37:06,210
spletne strani, ne
nujno struktura še,

844
00:37:06,210 --> 00:37:07,550
ampak estetika njej.

845
00:37:07,550 --> 00:37:10,960
In samo Googling okoli, se zavedam
da CSS, padajočih listov s slogi,

846
00:37:10,960 --> 00:37:14,170
Podpira lastnost imenovano
text-align, katerega vrednost se lahko

847
00:37:14,170 --> 00:37:16,980
se levo, desno ali center, na primer.

848
00:37:16,980 --> 00:37:19,990
>> Torej, zdaj, ko sem ponovno naložiti
to stran, kaj sem dobil

849
00:37:19,990 --> 00:37:22,730
bil osredotočen stran,
vendar še vedno precej grdo.

850
00:37:22,730 --> 00:37:25,770
Pojdimo naprej in odprite
up različice 2 Iskanje.

851
00:37:25,770 --> 00:37:28,570
In zdaj opazil sem naredil malo več.

852
00:37:28,570 --> 00:37:33,760
Opazili, da se tukaj v notranjosti glave
tag, ne more biti več kot naziv.

853
00:37:33,760 --> 00:37:35,400
Dejstvo je, da je slog tag.

854
00:37:35,400 --> 00:37:38,630
In to je, če je le dobi
malo grdo videnje CSS včasih.

855
00:37:38,630 --> 00:37:41,971
>> Obvestilo, da sem se zdi, da imajo nekaj
da strukturno izgleda zelo različni.

856
00:37:41,971 --> 00:37:44,095
Ampak tukaj je ime
tag želim stilizirani.

857
00:37:44,095 --> 00:37:47,570
Tukaj so naši stari prijatelji kodrasti
oporniki in zaprta kodrasti naramnicami.

858
00:37:47,570 --> 00:37:50,290
In potem je tu, da
Premoženje in njegova vrednost.

859
00:37:50,290 --> 00:37:56,300
>> Če sem naložiti te datoteke, search2.html,
Končni rezultat je enak.

860
00:37:56,300 --> 00:37:59,300
Ampak to je korak k boljšemu načrtovanju.

861
00:37:59,300 --> 00:38:04,560
Tako da ta CSS, Sem
ne pomešane z mojim HTML.

862
00:38:04,560 --> 00:38:07,560
In res, kot bomo videli, sem lahko
ponovno uporabo te lastnosti in vrednote.

863
00:38:07,560 --> 00:38:10,420
Če bi želel, da bi šopke
Deli mojo spletno stran na sredino,

864
00:38:10,420 --> 00:38:13,630
Nimam vnesti style = besedilno-align
središče povsod.

865
00:38:13,630 --> 00:38:16,580
Lahko dam na enem mestu
morda želeli na vrhu.

866
00:38:16,580 --> 00:38:18,210
>> Toda tudi to ni najboljši dizajn.

867
00:38:18,210 --> 00:38:21,720
V bistvu, ena od stvari, boste izvedeli,
kot ste porabili več časa z

868
00:38:21,720 --> 00:38:25,730
spletno programiranje je, da bolj lahko
modularize stvari in faktorja stvari

869
00:38:25,730 --> 00:38:30,610
kot .h datotek pustite nam faktorja stvari ven,
rad helpers.c Dovolite nam faktorja stvari

870
00:38:30,610 --> 00:38:31,880
Pred nekaj psets.

871
00:38:31,880 --> 00:38:34,200
Podobno, morda smo
želijo doseči.

872
00:38:34,200 --> 00:38:37,920
>> Tako obvestilo v različici
tri search.html Sem

873
00:38:37,920 --> 00:38:40,610
očistiti glava
stran in samo čaka

874
00:38:40,610 --> 00:38:43,320
v tem, povezava oznaka, ki
v nasprotju z imenom,

875
00:38:43,320 --> 00:38:44,700
ne dam hiperpovezave.

876
00:38:44,700 --> 00:38:49,150
To se povezuje z drugo datoteko s pomočjo
href, katerega vrednost je v tem primeru,

877
00:38:49,150 --> 00:38:51,586
je iskanje-3.css

878
00:38:51,586 --> 00:38:52,960
Zato se zavedam, da smo se hitro dogaja.

879
00:38:52,960 --> 00:38:54,600
Toda vse delam je nekako
premikati stvari okoli.

880
00:38:54,600 --> 00:38:55,760
Naj mi odprto iskanje-3.css.

881
00:38:55,760 --> 00:38:57,114

882
00:38:57,114 --> 00:38:58,530
Tam je, pravzaprav nič z njim.

883
00:38:58,530 --> 00:39:02,270
Pravkar sem prekopiral in ga prilepiti v novo
datoteko, podobno kot smo vključeno stvari iz

884
00:39:02,270 --> 00:39:03,509
v druge datoteke pred.

885
00:39:03,509 --> 00:39:05,300
In result--
popolnoma underwhelming--

886
00:39:05,300 --> 00:39:06,730
se bo popolnoma enako.

887
00:39:06,730 --> 00:39:10,490
Vendar pa se selimo toward-- ne, to ni.

888
00:39:10,490 --> 00:39:11,930
Oh, vem zakaj.

889
00:39:11,930 --> 00:39:13,790
>> Tako se zdi, da je to napaka.

890
00:39:13,790 --> 00:39:15,010
In to je v nekem smislu.

891
00:39:15,010 --> 00:39:17,730
Ampak naj odprejo svoj zavihek Omrežje.

892
00:39:17,730 --> 00:39:19,660
Dovolite mi, da naložite stran.

893
00:39:19,660 --> 00:39:23,315
Ah, zakaj CSS ne uporabljajo?

894
00:39:23,315 --> 00:39:26,920
No, datoteke CSS ima podobno
da je svet berljivi, tako rekoč.

895
00:39:26,920 --> 00:39:28,440
In preveč je trenutno prepovedana.

896
00:39:28,440 --> 00:39:33,760
Torej, kaj me naredi chmod a + r
Star dot CSS-- whoops--

897
00:39:33,760 --> 00:39:37,067
smo dot CSS je le
Končnica datoteke za CSS datoteke.

898
00:39:37,067 --> 00:39:38,900
Zdaj pa grem nazaj
moj brskalnik in osveži.

899
00:39:38,900 --> 00:39:40,910
OK, malo bolje.

900
00:39:40,910 --> 00:39:42,282
>> Zdaj pa mi naredi še zadnjo stvar.

901
00:39:42,282 --> 00:39:42,990
V iskalno-4.html.

902
00:39:42,990 --> 00:39:44,550

903
00:39:44,550 --> 00:39:48,220
Imam verzijo, ki sem mislil,
je bil način, hladilnik, čeprav veliko bolj

904
00:39:48,220 --> 00:39:48,980
zapleteno.

905
00:39:48,980 --> 00:39:50,690
Poglejmo si rezultat prva.

906
00:39:50,690 --> 00:39:52,290
Zaprite to, da nam več prostora.

907
00:39:52,290 --> 00:39:54,275
Spremenite to iskanje-4, Enter.

908
00:39:54,275 --> 00:39:55,430

909
00:39:55,430 --> 00:39:57,200
>> In zdaj kup stvari, ki so pokvarjeni.

910
00:39:57,200 --> 00:39:59,910
Jaz bom šel nazaj
v mojem imeniku tukaj.

911
00:39:59,910 --> 00:40:04,190
In zdaj sem le, da bo naredil
chmod za + r na file--

912
00:40:04,190 --> 00:40:07,450
ker vem, da exists-- imenuje
logo.gif, ki je podoba.

913
00:40:07,450 --> 00:40:08,590
In zdaj osvežite.

914
00:40:08,590 --> 00:40:11,040
In wow-- zdaj sem
zelo blizu, odkrito povedano,

915
00:40:11,040 --> 00:40:15,860
všeč različico Googla 1999, in
odkrito povedano, 2014 različica Google,

916
00:40:15,860 --> 00:40:16,360
kajne?

917
00:40:16,360 --> 00:40:21,920
>> Tako da je zdaj dogaja, da svoje spletne strani,
v končni fazi, če iščem za mačke.

918
00:40:21,920 --> 00:40:23,900
In res je.

919
00:40:23,900 --> 00:40:26,410
Ampak, kaj sem storil drugače
v tej različici 4?

920
00:40:26,410 --> 00:40:28,020
Tako smo na njej ne bo prebival preveč tukaj.

921
00:40:28,020 --> 00:40:30,100
Boste videli v problemu
nastavite sedem sčasoma.

922
00:40:30,100 --> 00:40:31,350
Toda opazil sem nekaj stvari.

923
00:40:31,350 --> 00:40:33,690
>> Sem predstavil div
tag, ki je delitev,

924
00:40:33,690 --> 00:40:35,450
pisane v duhu z odstavkom oznako.

925
00:40:35,450 --> 00:40:38,220
Ampak delitev je tako kot, tukaj je
Pravokotni nevidno področje

926
00:40:38,220 --> 00:40:39,150
zaslona.

927
00:40:39,150 --> 00:40:41,680
Dajmo ji edinstven
identifikator, noge, samo

928
00:40:41,680 --> 00:40:44,700
tako da lahko govorimo o
v naši HTML drugje.

929
00:40:44,700 --> 00:40:47,952
Tu je še en div strani
ID katerih se bo vsebina.

930
00:40:47,952 --> 00:40:49,160
To je vsebina strani.

931
00:40:49,160 --> 00:40:51,090
In tu je glava strani.

932
00:40:51,090 --> 00:40:54,960
>> Z drugimi besedami, Sem
v bistvu v HTML am duševno

933
00:40:54,960 --> 00:40:57,700
ogled te spletne strani, kot je
tri komponente, zbiralni

934
00:40:57,700 --> 00:41:01,200
tu gor s to nevidno pravokotnika,
vsebnost v sredini, in nato

935
00:41:01,200 --> 00:41:04,800
Noga pod navzdol, celo
čeprav ne vidimo te stvari.

936
00:41:04,800 --> 00:41:09,940
Ker želim v moji glavi
stran tukaj, ali v .css datoteko

937
00:41:09,940 --> 00:41:11,460
Lahko uporabite to sintakso.

938
00:41:11,460 --> 00:41:13,070
>> Glava ni tag.

939
00:41:13,070 --> 00:41:17,060
To je ID, tako se je izkazalo
, da s tem #header,

940
00:41:17,060 --> 00:41:20,840
Zdaj lahko uporabijo eno ali več
lastnosti v glavi.

941
00:41:20,840 --> 00:41:24,130
Jaz lahko naredim enako vsebino,
Enako za vsebino tukaj.

942
00:41:24,130 --> 00:41:27,230
>> Tako, na primer, v nogi, obvestila
Vse te lastnosti sem dodajanje.

943
00:41:27,230 --> 00:41:30,660
In vem, da obstajajo samo z branjem
up o dokumentaciji za CSS.

944
00:41:30,660 --> 00:41:33,450
Velikost pisave se bo smaller--
tako da nekateri relativna velikost pisave.

945
00:41:33,450 --> 00:41:34,741
Teža se bo krepko.

946
00:41:34,741 --> 00:41:37,340
Margin-- koliko pik
okoli it-- je 20 pik.

947
00:41:37,340 --> 00:41:38,590
In to se dogaja, da se v sredini.

948
00:41:38,590 --> 00:41:40,256
>> Ampak zdaj, stran izgleda takole.

949
00:41:40,256 --> 00:41:42,840
Če nisem zadovoljen z
moja kopija tam,

950
00:41:42,840 --> 00:41:46,560
Jaz lahko naredim nekaj podobnega rdeči barvi.

951
00:41:46,560 --> 00:41:50,570
In potem sem lahko s tem prihranili, osvežite,
in zdaj sem stilizirani nogo.

952
00:41:50,570 --> 00:41:54,130
Torej, to je samo namigujejo na moč
o tem, kaj lahko storite na spletni strani

953
00:41:54,130 --> 00:41:55,510
spremeniti stvari okoli.

954
00:41:55,510 --> 00:41:59,080
>> In še bolj kul kot to, če hočeš
suniti okrog z dejanskimi spletnih strani,

955
00:41:59,080 --> 00:42:00,810
ste trajno ne more spremeniti.

956
00:42:00,810 --> 00:42:03,640
Ampak, če sem odprla
Inšpektor Chrome znova

957
00:42:03,640 --> 00:42:07,610
in grem, ne na levi strani
tukaj, kar kaže na Facebook HTML,

958
00:42:07,610 --> 00:42:11,380
ampak kaže na desno
hand side vse svoje CSS,

959
00:42:11,380 --> 00:42:13,789
lahko bodisi in
spremeniti stvari na letenje.

960
00:42:13,789 --> 00:42:15,080
Zato naj gredo naprej in to.

961
00:42:15,080 --> 00:42:18,670
>> Dovolite mi, da gredo naprej in nadzor
kliknite na to naključno besedo tukaj,

962
00:42:18,670 --> 00:42:21,230
podpisati in kliknite Preglej element.

963
00:42:21,230 --> 00:42:25,130
Chrome zelo prikladno skoči
h1 tag, da Facebook uporablja.

964
00:42:25,130 --> 00:42:27,290
In opazil sem Facebook
ima nekako leno

965
00:42:27,290 --> 00:42:29,960
težko kodirane pisave kot nepremičnine tukaj.

966
00:42:29,960 --> 00:42:33,530
>> Tako kul stvar, čeprav je
da če bom dejansko šel noter

967
00:42:33,530 --> 00:42:39,560
in reči, oh, Facebook, ne maram, da
64 točk, zdaj lahko spremenite Facebook.

968
00:42:39,560 --> 00:42:42,590
Seveda, smo le njegovi zamenjavi
zame osebno v tem trenutku.

969
00:42:42,590 --> 00:42:45,150
Toda to je samo še en
orodje v našem kompleta orodij

970
00:42:45,150 --> 00:42:48,360
da se dogaja, da nam omogočajo, da poteg
in ugotoviti in tudi diagnosticirati

971
00:42:48,360 --> 00:42:49,729
vprašanja na naših spletnih straneh.

972
00:42:49,729 --> 00:42:52,270
In smo lahko podobno iti čez
tu, ki je ista stvar.

973
00:42:52,270 --> 00:42:55,830
Če res želite, da bi dobili fancy, I
Mislim, sedaj lahko res mutacijo stran

974
00:42:55,830 --> 00:42:57,380
in ne nore stvari.

975
00:42:57,380 --> 00:42:59,870
>> Torej, zakaj je vse to koristno?

976
00:42:59,870 --> 00:43:02,330
No, končno smo
dogaja, da želijo biti

977
00:43:02,330 --> 00:43:07,110
sposobni ustvariti spletne strani, ki
poganja naše nazaj koncih,

978
00:43:07,110 --> 00:43:10,520
ne samo Google in
outsourcing zadnji konec tam.

979
00:43:10,520 --> 00:43:13,510
Dejansko želimo
vrednost, na primer,

980
00:43:13,510 --> 00:43:18,830
delovanja našega iskalnika
pripisovati ne gre za nekoga drugega,

981
00:43:18,830 --> 00:43:24,270
ampak nekaj podobnega search.php,
kjer je search.php na našem strežniku,

982
00:43:24,270 --> 00:43:25,670
ne pa na nekoga drugega.

983
00:43:25,670 --> 00:43:30,316
>> In tako priti do tja, smo dejansko
treba uvesti nov jezik.

984
00:43:30,316 --> 00:43:33,190
Zato smo že pogledal eno novo
jezik tukaj, ali pa dva res, HTML

985
00:43:33,190 --> 00:43:33,700
in CSS.

986
00:43:33,700 --> 00:43:36,330
Vendar so v resnici samo
strukturne in estetske jeziku.

987
00:43:36,330 --> 00:43:38,360
Oni ne programiranje
jeziki per se.

988
00:43:38,360 --> 00:43:41,160
In to je približno toliko formalna
čas, saj bomo porabili za njih.

989
00:43:41,160 --> 00:43:44,910
Ker bomo začeli zdaj
za prehod v PHP.

990
00:43:44,910 --> 00:43:48,160
>> Torej PHP je dejanska
programski jezik.

991
00:43:48,160 --> 00:43:50,750
To je skriptni jezik
v smislu, da je

992
00:43:50,750 --> 00:43:52,855
mišljeno, da bo tanjši
kot nekaj podobnega C.

993
00:43:52,855 --> 00:43:56,082
In to je razlaga jezik,
kar pomeni, da se niso pripravljeni.

994
00:43:56,082 --> 00:43:58,790
Torej, na kratko, kaj je to pomenilo
Ko smo uporabili jezik kot so: C

995
00:43:58,790 --> 00:44:00,290
in imeli smo ga prevedite?

996
00:44:00,290 --> 00:44:02,120
Kaj to pomeni, da
zbere C izvorne kode?

997
00:44:02,120 --> 00:44:03,864

998
00:44:03,864 --> 00:44:04,780
OBČINSTVO: [neslišno].

999
00:44:04,780 --> 00:44:06,184
DAVID J Malan: Povej še enkrat?

1000
00:44:06,184 --> 00:44:07,100
OBČINSTVO: [neslišno].

1001
00:44:07,100 --> 00:44:07,962

1002
00:44:07,962 --> 00:44:08,920
DAVID J Malan: Popolna.

1003
00:44:08,920 --> 00:44:10,180
Jo pretvori v binarno.

1004
00:44:10,180 --> 00:44:14,200
Jo spremeni v ničel in enic
od dejanske angleščina podobnega izvorne kode.

1005
00:44:14,200 --> 00:44:16,424
In potem bomo lahko dejansko
teči tistih ničel in enic

1006
00:44:16,424 --> 00:44:18,840
s tem, da potujejo skozi
CPU z dvojnim klikom ikone

1007
00:44:18,840 --> 00:44:19,980
ali teče ukaz.

1008
00:44:19,980 --> 00:44:23,770
>> PHP in Python in Ruby
in Perl in JavaScript

1009
00:44:23,770 --> 00:44:26,250
in šopki drugo
jeziki so interpretirane

1010
00:44:26,250 --> 00:44:29,290
jezikov, ki je pravi
jih ne zbira.

1011
00:44:29,290 --> 00:44:34,220
Namesto tega ste jih hraniti, kot prispevek k
Program se imenuje tolmača.

1012
00:44:34,220 --> 00:44:36,640
In da je tolmač,
ki je nekdo drug napisal,

1013
00:44:36,640 --> 00:44:40,930
bere svojo izvorno kodo vrha do dna,
od leve proti desni in samo interpretira

1014
00:44:40,930 --> 00:44:43,000
te linije in naredi tisto, kar ste rekli.

1015
00:44:43,000 --> 00:44:45,360
>> Torej, če naletite
vrstica, ki pravi, print,

1016
00:44:45,360 --> 00:44:48,660
ni pa nujno spremeniti tisk
na ustrezne ničlami ​​in narave.

1017
00:44:48,660 --> 00:44:51,910
Treba ga je le ta tolmača, kot je
velik če pogoj, ki pravi,

1018
00:44:51,910 --> 00:44:56,110
če navodila programer je
tiskanje, naredite naslednje.

1019
00:44:56,110 --> 00:44:58,170
Tako da ga razume samo
po načinu sklepanja

1020
00:44:58,170 --> 00:44:59,800
skozi kaj ste to povedali storiti.

1021
00:44:59,800 --> 00:45:01,320
>> In PHP je ena od teh jezikov.

1022
00:45:01,320 --> 00:45:05,310
In je bil pred leti zasnovan PHP
Ravno za spletno programiranje.

1023
00:45:05,310 --> 00:45:08,160
In to je bilo na začetku
zelo površen grdo jezik.

1024
00:45:08,160 --> 00:45:10,940
In res, tam je ogromen
znesek slabega PHP kodo tam.

1025
00:45:10,940 --> 00:45:13,520
Ampak jezik sam
je dozorela v preteklih letih,

1026
00:45:13,520 --> 00:45:16,200
tako zelo, da zdaj je
pravzaprav čudovito naslednji korak

1027
00:45:16,200 --> 00:45:19,970
pedagoško iz C, ker je
tako darned seznanjeni z vsem, kar

1028
00:45:19,970 --> 00:45:22,380
ste pravkar videli v zadnjih nekaj tednih.

1029
00:45:22,380 --> 00:45:25,724
>> Ena začetna razlika bomo videli
je ni glavna funkcija več.

1030
00:45:25,724 --> 00:45:28,890
Ko začnete pisati kodo, to je samo
dogaja se, da izvede ne glede na to, kaj,

1031
00:45:28,890 --> 00:45:30,220
kot bomo videli v trenutku.

1032
00:45:30,220 --> 00:45:33,320
Medtem, tukaj je, kaj
spremenljivka izgleda v PHP.

1033
00:45:33,320 --> 00:45:35,840
To je malo drugačna,
vendar le komaj.

1034
00:45:35,840 --> 00:45:39,380
>> V PHP, tam ni močna tipkanje.

1035
00:45:39,380 --> 00:45:41,430
Tam je teden tipkanje,
ki pomeni le tam

1036
00:45:41,430 --> 00:45:44,030
so vrste podatkov, kot so strune
in številke in druge stvari.

1037
00:45:44,030 --> 00:45:47,030
Vendar ga ne moti opredeljuje
kaj so anymore.

1038
00:45:47,030 --> 00:45:48,980
PHP je številke za vas.

1039
00:45:48,980 --> 00:45:52,030
Znak za dolar je samo odločitev
da PHP ljudje na let

1040
00:45:52,030 --> 00:45:54,890
nazaj tako, da se katerakoli spremenljivka v PHP
Samo začne z znak za dolar.

1041
00:45:54,890 --> 00:45:58,130
Pravzaprav je nekako koristni,
skoči ven na vas malo več.

1042
00:45:58,130 --> 00:46:01,315
>> Toda po tem, ta
je stanje v PHP.

1043
00:46:01,315 --> 00:46:03,140

1044
00:46:03,140 --> 00:46:04,730
Kaj je drugačen v primerjavi s C?

1045
00:46:04,730 --> 00:46:07,180

1046
00:46:07,180 --> 00:46:09,600
Trik question-- ničesar,
kar je pravzaprav res lepo.

1047
00:46:09,600 --> 00:46:12,140
Boolove izrazi v PHP-- isti.

1048
00:46:12,140 --> 00:46:19,354
Boolove izrazi z in v primerjavi z
ali, stikala, zanke, zanke, loops-- OK,

1049
00:46:19,354 --> 00:46:20,270
ta je drugačna.

1050
00:46:20,270 --> 00:46:22,660
>> Tako se izkaže, da je
nekaj drugih funkcij v PHP.

1051
00:46:22,660 --> 00:46:25,243
Eden od njih je pravzaprav to,
kar je nadvse priročno.

1052
00:46:25,243 --> 00:46:29,250
Če $ številk je matrika, ki ste
prej prijavljene v program,

1053
00:46:29,250 --> 00:46:33,350
imate to fancy za vsak konstrukt
da je, namesto da bi vse to

1054
00:46:33,350 --> 00:46:37,020
siten sem enak 0, I je
manj kot to, [? I ++?]

1055
00:46:37,020 --> 00:46:40,320
za vsako številkami kot številka, kjer se vsak
teh vrednot znak dolar je samo

1056
00:46:40,320 --> 00:46:42,790
spremenljivka, in slednji
si lahko zamislite kot I.

1057
00:46:42,790 --> 00:46:44,290
Lahko ga pokličete karkoli želite.

1058
00:46:44,290 --> 00:46:45,770
Poklical sem jo številko.

1059
00:46:45,770 --> 00:46:48,825
To bo ponovitev čez
matrika se imenuje številk.

1060
00:46:48,825 --> 00:46:51,200
In na vsaki ponovitvi, je
bo samodejno posodablja

1061
00:46:51,200 --> 00:46:54,340
za vas številka znak za dolar
spremenljivka, tako da boste neprestano

1062
00:46:54,340 --> 00:46:58,210
imajo dostop do spremenljivke, ki jo želite
ne da narediti vsako kvadratno nosilec

1063
00:46:58,210 --> 00:47:00,980
Zapis ali indeksiranje v array.

1064
00:47:00,980 --> 00:47:04,950
>> Beyond, da imamo tudi stvari, kot so
nizi, ki izgledajo skoraj enako,

1065
00:47:04,950 --> 00:47:08,210
razen, da je zelo pogost, saj bomo
glej, tako v PHP in JavaScript

1066
00:47:08,210 --> 00:47:10,750
vnaprej inicializirati array
z oglatimi oklepaji.

1067
00:47:10,750 --> 00:47:12,040
C uporablja zavitimi oklepaji.

1068
00:47:12,040 --> 00:47:15,330
Tako da je nekoliko drugačen, čeprav
Nismo res ni uporabil ta trik veliko.

1069
00:47:15,330 --> 00:47:20,090
>> Ampak še bolj močno,
PHP ima asociativne nize,

1070
00:47:20,090 --> 00:47:23,100
ki je fancy način
rekel hash tabele.

1071
00:47:23,100 --> 00:47:31,610
V bistvu, če želite, da razglasi hash
miza v PHP, za razliko od C- koliko

1072
00:47:31,610 --> 00:47:34,775
vrstic kode je trajalo, da
dejansko izvajati razpršene tabele v C?

1073
00:47:34,775 --> 00:47:38,310
Ali pa, koliko vrstic je koda ga
ob izvajati razpršene tabele v C?

1074
00:47:38,310 --> 00:47:39,820
Tako da je verjetno veliko, kajne?

1075
00:47:39,820 --> 00:47:41,680
To je nekaj deset, morda 100 ali 200.

1076
00:47:41,680 --> 00:47:42,980
To je enostavna.

1077
00:47:42,980 --> 00:47:45,420
Ali pa je na tem, da se, kot je
kmalu boste videli, enostavna

1078
00:47:45,420 --> 00:47:48,080
za izvajanje razpršene tabele
[Neslišno] in tudi poskusiti.

1079
00:47:48,080 --> 00:47:50,580
Toda v PHP-- in odkrito povedano, sem
Verjetno vam ne bi smel povedati tega

1080
00:47:50,580 --> 00:47:53,630
dokler Monday-- v PHP, če
želite tabelo, storjeno.

1081
00:47:53,630 --> 00:47:56,431
To je hash tako table--
z eno vrstico kode.

1082
00:47:56,431 --> 00:47:56,930
In

1083
00:47:56,930 --> 00:47:58,810
>> Veliko jezikov storiti.

1084
00:47:58,810 --> 00:48:00,190
Zabavajte se z pset pet.

1085
00:48:00,190 --> 00:48:01,980
Torej, veliko jezikov to.

1086
00:48:01,980 --> 00:48:03,050

1087
00:48:03,050 --> 00:48:06,140
So vam te abstrakcije
da drugih ljudi, drugih programerjev,

1088
00:48:06,140 --> 00:48:09,870
so ustvarili za vas, tako da
lahko stoji na svojih ramenih

1089
00:48:09,870 --> 00:48:13,290
in začeti uporabljati ideje, ki so super
prepričljiv, kot je hash tabel in drevesa

1090
00:48:13,290 --> 00:48:14,140
in poskuša.

1091
00:48:14,140 --> 00:48:17,790
Vendar vam ni nujno, da
izvajanje te stvari sami.

1092
00:48:17,790 --> 00:48:20,850
>> In tako na koncu, kaj
bomo uporabljati PHP za

1093
00:48:20,850 --> 00:48:23,580
se lahko pisanje programov
takoimenovanega-ukazno vrstico.

1094
00:48:23,580 --> 00:48:26,600
Mi lahko znova vsak program,
Tako daleč smo že napisal ta semester,

1095
00:48:26,600 --> 00:48:30,410
razen morda Breakout, ki uporablja SPL,
ki je specifičen za C v trenutku.

1096
00:48:30,410 --> 00:48:33,100
Ampak vsak drugi problem določiti,
vsekakor Mario in Caesar

1097
00:48:33,100 --> 00:48:35,300
in Vigenere in
[? Tresk?] In naprej, mi

1098
00:48:35,300 --> 00:48:39,520
lahko ponovno izvajati v PHP, in
verjetno malo bolj enostavno.

1099
00:48:39,520 --> 00:48:43,050
>> Ampak kaj bomo na koncu dogaja
uporabljati PHP za web programiranje.

1100
00:48:43,050 --> 00:48:46,420
In bomo uvesti naslednjo
teden mentalni model, ki se imenuje paradigma

1101
00:48:46,420 --> 00:48:49,610
MVC, model, pogled krmilnik,
ki bi, če ste naredili programiranje

1102
00:48:49,610 --> 00:48:51,610
preden v Python ali
Ruby ali drugje, boste

1103
00:48:51,610 --> 00:48:54,112
Morda veš te ekipe z
Tračnice in Django in podobno.

1104
00:48:54,112 --> 00:48:55,820
Ampak, če ste novi na
tudi to, boste videli

1105
00:48:55,820 --> 00:48:59,652
da je to dejansko zelo naraven
Podaljšanje razcepa

1106
00:48:59,652 --> 00:49:01,360
in vrste oblikovanja
kode, ki smo jih

1107
00:49:01,360 --> 00:49:04,670
počel v C. bomo zdaj
uporabljati nekatere od teh lekcij za PHP

1108
00:49:04,670 --> 00:49:07,190
tako da na koncu smo
izvajanje lastne spletne strani.

1109
00:49:07,190 --> 00:49:09,080
In če ste nekako
Hipnotiziran ali čudil

1110
00:49:09,080 --> 00:49:10,954
da bomo storili
tako hitro vse,

1111
00:49:10,954 --> 00:49:13,410
zavedaš, da skoraj vsak
semester, kar je skoraj 90%

1112
00:49:13,410 --> 00:49:16,560
študentov CS50, vključno s tistimi,
ki niso nikoli programirana prej,

1113
00:49:16,560 --> 00:49:20,329
na koncu kar končne projekte, ki
temeljijo na spletni programiranja.

1114
00:49:20,329 --> 00:49:23,120
In tako boste videli, da se vrne
so visoko v tednih, ki prihajajo.

1115
00:49:23,120 --> 00:49:24,965
Tako vas bomo videli potem v ponedeljek.

1116
00:49:24,965 --> 00:49:27,260

1117
00:49:27,260 --> 00:49:30,120
>> SPEAKER 1: In zdaj, Deep
Misli, ki jih Daven Farnham.

1118
00:49:30,120 --> 00:49:34,055

1119
00:49:34,055 --> 00:49:34,780
Razpršene tabele.

1120
00:49:34,780 --> 00:49:37,180

1121
00:49:37,180 --> 00:49:38,402
>> [Smeh]

1122
00:49:38,402 --> 00:49:38,902