1
00:00:00,000 --> 00:00:02,500
[Powered by Google Translate] [Seminar] [Web Development: van idee tot uitvoering]

2
00:00:02,500 --> 00:00:04,200
[Ben Kuhn] [Billy Janitsch] [Harvard University]

3
00:00:04,200 --> 00:00:07,250
[Dit is CS50] [CS50.TV]

4
00:00:07,250 --> 00:00:10,840
[Billy] Hoi, ik ben Billy en dit is Ben. >> [Ben] Hi.

5
00:00:10,840 --> 00:00:12,840
We gaan praten over web development vandaag.

6
00:00:12,840 --> 00:00:14,840
[Webdev] [Billy Janitsch en Ben Kuhn]

7
00:00:14,840 --> 00:00:16,840
Een beetje over ons eerste.

8
00:00:16,840 --> 00:00:19,590
Ben is een soort van de back-end vent. Hij maakt dingen werken.

9
00:00:19,590 --> 00:00:21,870
En dan ga ik in en maken ze mooi.

10
00:00:21,870 --> 00:00:26,610
Ik ben voornamelijk bezig met meer front-end lay-out ontwerp soort dingen,

11
00:00:26,610 --> 00:00:31,260
en Ben, aan de andere kant, weet wat hij doet, zodat hij werkt op back-end spul.

12
00:00:31,260 --> 00:00:34,050
Samen hebben we een paar dingen.

13
00:00:34,050 --> 00:00:38,710
Bijvoorbeeld, vorig jaar hebben we gewerkt aan Gimblium dat is een online game development studio.

14
00:00:38,710 --> 00:00:40,400
Dat was onze laatste project voor de klas,

15
00:00:40,400 --> 00:00:42,780
en sindsdien hebben we Harvard klasse hebben gemaakt

16
00:00:42,780 --> 00:00:47,860
dat is een online kader voor browsen en winkelen cursussen op Harvard.

17
00:00:47,860 --> 00:00:53,180
>> We gaan beginnen met dit idee voor onze website.

18
00:00:53,180 --> 00:00:57,480
We gaan naar Facebook te maken, maar voor katten.

19
00:00:57,480 --> 00:00:59,520
Voordat u daadwerkelijk deze website,

20
00:00:59,520 --> 00:01:02,520
u deze website niet te maken, want het is niet goed, maar we zullen het gebruiken als een kader

21
00:01:02,520 --> 00:01:05,349
en gaan door het proces van hoe we dit idee

22
00:01:05,349 --> 00:01:07,450
en zet hem in een echte website die we kunnen gebruiken.

23
00:01:07,450 --> 00:01:11,940
We beginnen met het breken van de website naar beneden.

24
00:01:11,940 --> 00:01:13,190
Zoals je hebt gedaan in CS50,

25
00:01:13,190 --> 00:01:17,360
je wilt nadenken over wat zijn de werkelijke componenten die verder gaan in deze website.

26
00:01:17,360 --> 00:01:21,290
Het in principe draaien vanuit een idee dat is gewoon soort van een abstract begrip

27
00:01:21,290 --> 00:01:23,590
in een echt, tastbaar ding dat je zou kunnen maken.

28
00:01:23,590 --> 00:01:25,910
We beginnen met een aantal vragen.

29
00:01:25,910 --> 00:01:28,070
Wat is deze website? Waarom maken we het?

30
00:01:28,070 --> 00:01:30,670
Wat gaat het worden gebruikt? Dat soort dingen.

31
00:01:30,670 --> 00:01:33,660
Bij Facebook Cat,

32
00:01:33,660 --> 00:01:37,730
we eigenlijk willen een website die katten sociale netwerk kunnen met elkaar.

33
00:01:37,730 --> 00:01:41,260
Het idee is dat ze kan plaatsen op muren elkaars

34
00:01:41,260 --> 00:01:43,510
ze kunnen commentaar, dat soort dingen te maken.

35
00:01:43,510 --> 00:01:46,720
En dat is waar we in de functionele componenten komen.

36
00:01:46,720 --> 00:01:51,270
We hebben nu dit soort kader van - we hebben gebruikersprofielen,

37
00:01:51,270 --> 00:01:53,990
we hebben commentaar, en we kunnen plaatsen.

38
00:01:53,990 --> 00:01:57,390
Misschien op een dag zullen we sympathieën en dat soort dingen behoud hiervan.

39
00:01:57,390 --> 00:02:00,410
En we soort van deze mogelijkheden wilt naar binnen te prioriteren

40
00:02:00,410 --> 00:02:03,340
We willen zeggen zoals, oke, het is echt belangrijk dat iedereen een profiel

41
00:02:03,340 --> 00:02:06,440
en dat iedereen kan posten op muren elkaars.

42
00:02:06,440 --> 00:02:08,509
Secundair aan dat, zou commentaren mooi zijn.

43
00:02:08,509 --> 00:02:10,180
Misschien later zullen we houdt behoud hiervan.

44
00:02:10,180 --> 00:02:13,700
Dus, wilt u een idee van wat er fundamenteel voor uw project

45
00:02:13,700 --> 00:02:17,260
en wat is een soort van een meer algemene functie die later kan worden toegepast.

46
00:02:17,260 --> 00:02:20,870
U wilt een soort van een specifieke lijst in het achterhoofd,

47
00:02:20,870 --> 00:02:24,090
maar het project dat je begint met is niet van plan om het project dat u klaar bent met zijn.

48
00:02:24,090 --> 00:02:27,100
Met andere woorden, dingen gaan veranderen terwijl je de site aan het ontwikkelen bent,

49
00:02:27,100 --> 00:02:30,090
en je wilt om ruimte te laten voor.

50
00:02:30,090 --> 00:02:34,470
Ik zal het woord aan Ben die gaat een beetje te praten over structuur.

51
00:02:34,470 --> 00:02:39,610
>> [Ben] Ik ga het hebben over de meer technische kant van webontwikkeling.

52
00:02:39,610 --> 00:02:42,370
Laten we gaan over een aantal basics eerste.

53
00:02:42,370 --> 00:02:45,730
Als je doet een web-app,

54
00:02:45,730 --> 00:02:50,470
de belangrijkste divisie die je gaat moet hebben is

55
00:02:50,470 --> 00:02:52,700
je gaat wat dingen gaande in de client-side hebben -

56
00:02:52,700 --> 00:02:56,700
dat wil zeggen, de code die je browser neemt van de site

57
00:02:56,700 --> 00:03:01,910
en de JavaScript, HTML, CSS spul.

58
00:03:01,910 --> 00:03:04,490
Dat is alles wat op de client zijde.

59
00:03:04,490 --> 00:03:08,680
Je gaat andere code die op de server draait hebben

60
00:03:08,680 --> 00:03:10,770
die bijhoudt van alle gegevens die mensen sturen om u,

61
00:03:10,770 --> 00:03:15,060
beslist wie wat, dat soort dingen geven.

62
00:03:15,060 --> 00:03:20,380
Dit is slechts enkele terminologie, zodat jullie allemaal vertrouwd zijn met wat we over praten.

63
00:03:20,380 --> 00:03:28,600
Voorbij die afdeling is het goed om na te denken van uw web-app in termen van

64
00:03:28,600 --> 00:03:32,500
een paar van de afzonderlijke componenten.

65
00:03:32,500 --> 00:03:35,270
Als je doet webontwikkeling

66
00:03:35,270 --> 00:03:41,710
een van de dingen die je altijd moet proberen te doen is om de complexiteit te verminderen.

67
00:03:41,710 --> 00:03:45,710
Hoe complexer de code is het meer kans er is om bugs te maken,

68
00:03:45,710 --> 00:03:47,710
hoe moeilijker het is om later te veranderen.

69
00:03:47,710 --> 00:03:50,140
Dus, als je kunt breken uw app in een aantal verschillende functionele gebieden

70
00:03:50,140 --> 00:03:57,640
dat zal - en je kunt het soort hoeveelheid cross-area communicatie verminderen -

71
00:03:57,640 --> 00:04:03,530
dat zal u helpen een hoop op de lange termijn in termen van vermindering van bugs.

72
00:04:03,530 --> 00:04:07,950
>> Om concreet te zijn, meestal mensen verdelen een web app in -

73
00:04:07,950 --> 00:04:13,190
zijn dit soort buzz woorden nu, maar ze zijn nog steeds nuttig.

74
00:04:13,190 --> 00:04:17,940
Misschien heb je mensen horen praten over modellen, views en controllers.

75
00:04:17,940 --> 00:04:23,210
Modellen zijn de feitelijke gegevens die uw app gaat behandelen.

76
00:04:23,210 --> 00:04:28,260
Bijvoorbeeld, in uw Cat Facebook, zou je modellen -

77
00:04:28,260 --> 00:04:35,340
zou je een model voor, zoals berichten, en een model voor gebruikersprofielen, dat soort dingen hebben.

78
00:04:35,340 --> 00:04:41,090
Uw mening is hoe presenteren u deze gegevens aan uw gebruikers.

79
00:04:41,090 --> 00:04:46,660
Je zou 1 oog voor het kijken naar een enkele post en alle opmerkingen hebben

80
00:04:46,660 --> 00:04:51,720
en een andere kijk voor je muur die een lijst van alle berichten heeft

81
00:04:51,720 --> 00:04:57,170
die gericht zijn aan u, en een andere kijk voor je nieuwsfeed - dat soort dingen.

82
00:04:57,170 --> 00:05:00,610
Tot slot, heb je de controllers die in feite zijn als mensen om u berichten

83
00:05:00,610 --> 00:05:03,310
en je updates om uw back-end systeem te maken,

84
00:05:03,310 --> 00:05:06,400
je een heleboel tellers verhogen, en wat dan ook.

85
00:05:06,400 --> 00:05:07,860
Dat zijn je controllers.

86
00:05:07,860 --> 00:05:11,030
>> Ik ga vooral praten over modellen.

87
00:05:11,030 --> 00:05:14,030
Bekeken zijn technisch niet zo moeilijk en het probleem is meer met ze te ontwerpen

88
00:05:14,030 --> 00:05:22,040
Controllers gaan specifiek voor wat je het ontwerpen zijn.

89
00:05:22,040 --> 00:05:25,220
Maar er zijn een aantal mooie algemene technieken die u kunt gebruiken

90
00:05:25,220 --> 00:05:30,220
om uw modellen mooier en makkelijker om mee te werken die volgens mij zeer nuttig maken.

91
00:05:30,220 --> 00:05:35,860
Dit wordt meestal gaat worden over hoe om te gaan met uw web-apps gegevens op een leuke manier.

92
00:05:35,860 --> 00:05:40,420
De belangrijkste kwesties met modellen

93
00:05:40,420 --> 00:05:44,540
zijn dat ze leven op de client en de server en je moet uitzoeken

94
00:05:44,540 --> 00:05:51,170
a) hoe ze te krijgen - alle relevante degenen - van de server naar de client,

95
00:05:51,170 --> 00:05:53,440
en b) hoe ze te synchroon te houden.

96
00:05:53,440 --> 00:05:58,700
Uw gebruikers zullen willen wat updates te maken.

97
00:05:58,700 --> 00:06:00,470
Ze zullen willen nieuwe berichten maken.

98
00:06:00,470 --> 00:06:04,800
Ze zullen willen dingen en dat soort dingen als je wil.

99
00:06:04,800 --> 00:06:11,490
Dat zijn de belangrijkste technische uitdagingen van omgaan met modellen.

100
00:06:11,490 --> 00:06:15,680
Het eerste dat je gaat jezelf wilt stellen is

101
00:06:15,680 --> 00:06:18,420
wat voor gegevens gaat in dit model en wat voor soort vragen gaan we willen doen -

102
00:06:18,420 --> 00:06:24,290
dat wil zeggen, hoe gaan we kijken naar de modellen?

103
00:06:24,290 --> 00:06:26,940
Voor uw kat Facebook bijvoorbeeld,

104
00:06:26,940 --> 00:06:31,520
uw post gaat naar een auteur verbonden aan,

105
00:06:31,520 --> 00:06:35,660
sommige muur na tekst, en een ontvanger van de muur na.

106
00:06:35,660 --> 00:06:38,470
En dan wilt u misschien te vragen dat in een heleboel verschillende manieren.

107
00:06:38,470 --> 00:06:42,220
Je zou willen kijken door wie welk bericht heeft geschreven,

108
00:06:42,220 --> 00:06:46,620
door die ontvangen die posten, misschien door de datum waarop ze zijn geplaatst.

109
00:06:46,620 --> 00:06:50,340
Maar als je gaat om het te doen op datum, dan moet je een ander veld toe te voegen aan je bericht

110
00:06:50,340 --> 00:06:52,490
wanneer het daadwerkelijk is geplaatst.

111
00:06:52,490 --> 00:07:00,220
Deze 2 factoren - welke gegevens u wilt gebruiken en hoe je het wilt bekijken -

112
00:07:00,220 --> 00:07:04,200
je moet eerst over hen denken, omdat ze afhankelijk zijn van elkaar,

113
00:07:04,200 --> 00:07:08,030
en het zal moeilijker zijn om ze later toe te voegen.

114
00:07:08,030 --> 00:07:12,750
>> Er zijn een aantal andere overwegingen.

115
00:07:12,750 --> 00:07:17,540
Wanneer u denkt over hoe je omgaat met modellen op de server

116
00:07:17,540 --> 00:07:20,540
wat je wilt kijken is -

117
00:07:20,540 --> 00:07:27,440
je eigenlijk wilt dat de server zo eenvoudig mogelijk te maken.

118
00:07:29,440 --> 00:07:35,500
Dingen doen op de client zijde is over het algemeen veel sneller als je het puur kan doen op de client

119
00:07:35,500 --> 00:07:38,230
zonder enige vorm van verzoek van het netwerk.

120
00:07:38,230 --> 00:07:47,860
Het idee is om zo veel van de vragen als je kan op de client doen.

121
00:07:47,860 --> 00:07:51,560
Het enige probleem met dat

122
00:07:51,560 --> 00:07:54,160
is dat als u een verzoek alle gegevens aan het begin

123
00:07:54,160 --> 00:07:57,160
dan dat gaat een lange tijd om te laden.

124
00:07:57,160 --> 00:08:02,290
Dus, het idee is om een ​​middenweg te vinden tussen het hebben van voldoende gegevens over de cliënt

125
00:08:02,290 --> 00:08:07,640
die u het meest van uw werk kunt doen daar, maar niet alleen ophalen alles in een keer

126
00:08:07,640 --> 00:08:09,710
zodat je echt lange laadtijd aan het begin.

127
00:08:09,710 --> 00:08:12,610
Bijvoorbeeld, voor uw kat gegevens

128
00:08:12,610 --> 00:08:20,340
zou u waarschijnlijk willen een heleboel recente prikbordberichten halen.

129
00:08:20,340 --> 00:08:23,790
Je zou niet willen om ze allemaal te halen, want dat kon terug een paar jaar.

130
00:08:23,790 --> 00:08:25,470
Maar je wilt niet dat ze een te halen op een moment

131
00:08:25,470 --> 00:08:28,740
want dat zou veel van het netwerk overhead introduceren.

132
00:08:28,740 --> 00:08:33,620
>> Het is vaak heel moeilijk - als je eenmaal een database onder -

133
00:08:33,620 --> 00:08:37,210
is het vaak heel moeilijk om te veranderen welke data je hebt in het -

134
00:08:37,210 --> 00:08:40,510
dat wil zeggen, voeg een nieuwe database kolom of iets -

135
00:08:40,510 --> 00:08:43,510
dus een goede strategie is eigenlijk alleen maar om veel van uw gegevens in een tekst blob te houden -

136
00:08:43,510 --> 00:08:53,880
een JSON blob - JSON dat JavaScript Object Notation -

137
00:08:53,880 --> 00:08:58,330
De reden dat het handig is want dan kun je nieuwe eigenschappen toe te voegen

138
00:08:58,330 --> 00:09:01,920
om al deze JSON blobs zonder de database te veranderen.

139
00:09:01,920 --> 00:09:06,860
Het enige nadeel daarvan is dat als je een heleboel velden

140
00:09:06,860 --> 00:09:09,890
die u hebt toegevoegd later - zoals verborgen in dat JSON blob -

141
00:09:09,890 --> 00:09:12,850
dan is het moeilijker om ze een query in de database.

142
00:09:12,850 --> 00:09:17,690
Bijvoorbeeld, als je later - als je je post model hadden dat we eerder besproken

143
00:09:17,690 --> 00:09:25,380
met alleen de auteur, de ontvanger en de tekst -

144
00:09:25,380 --> 00:09:29,000
je zou ook een JSON blob en dan als je later wilde een datum veld toe te voegen

145
00:09:29,000 --> 00:09:31,000
zou u niet om uw database te veranderen.

146
00:09:31,000 --> 00:09:36,140
Je kon gewoon data toe te voegen aan alle van de tekstvelden.

147
00:09:36,140 --> 00:09:39,640
En dan zou je kunnen kijken naar die op de client zijn,

148
00:09:39,640 --> 00:09:42,430
maar je zou niet in staat zijn om ze te doorzoeken op de server

149
00:09:42,430 --> 00:09:44,430
want het is verborgen in die tekst.

150
00:09:44,430 --> 00:09:49,920
>> Het andere probleem dat u wilt nadenken over

151
00:09:49,920 --> 00:09:52,400
is hoe uw klant en uw server gaan communiceren.

152
00:09:52,400 --> 00:09:56,040
Je meestal willen dit zo eenvoudig mogelijk te houden.

153
00:09:56,040 --> 00:10:02,230
Je kunt gewoon als een get-me-deze gegevens verzoek,

154
00:10:02,230 --> 00:10:09,140
een create-a-new-object ding, en een verzoek actualisering-een-oude-object.

155
00:10:09,140 --> 00:10:12,930
En dat zal dan uitsluitend verschillende URL's op een server die u -

156
00:10:12,930 --> 00:10:20,030
dat de browser zou - u AJAX verzoeken te gebruiken voor al deze

157
00:10:20,030 --> 00:10:24,000
en ofwel te ontvangen of post gegevens.

158
00:10:24,000 --> 00:10:26,600
Nogmaals, voor onze Cat Facebook bijvoorbeeld,

159
00:10:26,600 --> 00:10:32,350
kon je dat URL moet een afzonderlijk bericht te krijgen,

160
00:10:32,350 --> 00:10:39,750
en je zou een URL hebben voor het creëren van een nieuwe muur bericht

161
00:10:39,750 --> 00:10:45,670
en misschien een URL voor het uploaden van uw profielfoto, dat soort dingen.

162
00:10:45,670 --> 00:10:51,730
Maar nogmaals, dat is een pre-fetch meeste van uw gegevens, zodat u niet hoeft te houden

163
00:10:51,730 --> 00:10:53,360
maken van het netwerk verzoeken.

164
00:10:53,360 --> 00:10:59,030
Om die reden, zou je niet willen dat individuele krijgen verzoek om een ​​enkele post hebben,

165
00:10:59,030 --> 00:11:03,210
en in plaats daarvan zou je gewoon wilt 1 get verzoek om de hele muur.

166
00:11:03,210 --> 00:11:06,110
En dan als je probeert om een ​​evenwicht omdat -

167
00:11:06,110 --> 00:11:10,970
dit gaat ook afhangen van uw aanvraag.

168
00:11:10,970 --> 00:11:13,430
Want als je verwacht dat mensen slechts 10 of 20 prikbordberichten

169
00:11:13,430 --> 00:11:15,430
dat komt wel goed.

170
00:11:15,430 --> 00:11:17,390
Maar als je verwacht dat ze zullen duizenden hebben dan is dat verzoek zou te lang duren,

171
00:11:17,390 --> 00:11:23,580
en dus je zou willen om een ​​get-alle-berichten-sinds parameter toe te voegen.

172
00:11:23,580 --> 00:11:26,580
>> Voor al deze je waarschijnlijk gaat om uw gegevens wilt synchroniseren in JSON -

173
00:11:26,580 --> 00:11:29,260
JavaScript Object Notation.

174
00:11:29,260 --> 00:11:34,600
Vrijwel elke taal bezighoudt met JSON zeer goed.

175
00:11:34,600 --> 00:11:40,880
JQuery heeft deze mooie getJSON functie dat al het harde werk voor u zal doen.

176
00:11:40,880 --> 00:11:47,390
En op PHP er is ook heel mooi JSON communicatiefuncties.

177
00:11:47,390 --> 00:11:52,660
Dus, dat is waarschijnlijk het beste formaat voor het verzenden van uw modellen heen en weer.

178
00:11:52,660 --> 00:11:56,570
>> Als voorbeeld van wat we hebben gesproken over tot nu toe,

179
00:11:56,570 --> 00:12:00,520
hier is een voorbeeld-stroom voor uw Cat Facebook applicatie.

180
00:12:00,520 --> 00:12:07,760
Het begint met uw browser vraagt ​​de basis URL van de website.

181
00:12:07,760 --> 00:12:15,470
De server waarschijnlijk zou sturen over statische HTML-en JavaScript-en CSS.

182
00:12:15,470 --> 00:12:19,170
Het is meestal het beste elke weergave op de server niet te doen.

183
00:12:19,170 --> 00:12:23,370
U heeft waarschijnlijk niet willen -

184
00:12:23,370 --> 00:12:28,360
wat de server is er niet te doen gaat de lijst van muur berichten

185
00:12:28,360 --> 00:12:31,120
en het genereren van een aantal HTML-code voor een ieder en het verzenden van dat voorbij.

186
00:12:31,120 --> 00:12:34,960
Het is meestal het beste om dat te doen op de client, omdat anders

187
00:12:34,960 --> 00:12:38,580
elke keer dat u opnieuw wilt tekenen iets, moet je een server verzoek.

188
00:12:38,580 --> 00:12:42,450
En dat heel snel geeft je veel overhead.

189
00:12:42,450 --> 00:12:47,430
Het is meestal het beste gewoon schip zendt statische HTML

190
00:12:47,430 --> 00:12:50,660
en dan JavaScript en CSS die de rendering doen op de client.

191
00:12:50,660 --> 00:12:56,750
Zodra dat spul komt,

192
00:12:56,750 --> 00:13:03,500
dan je kunt hebben - in JavaScript - u kunt verzoeken doen voor de muur gegevens

193
00:13:03,500 --> 00:13:08,740
en dat soort dingen, en na dat de server is eigenlijk gewoon doen database queries

194
00:13:08,740 --> 00:13:10,740
en het controleren van machtigingen.

195
00:13:10,740 --> 00:13:16,690
Het enige belangrijke is dat het niet kan versturen over een aantal andere gebruikers prikbordberichten

196
00:13:16,690 --> 00:13:19,220
dat je niet mag zien.

197
00:13:19,220 --> 00:13:28,050
Het kan een zeer dunne laag voor toegang tot de database in principe zijn,

198
00:13:28,050 --> 00:13:32,820
en dan al het tonen van de gegevens - alle standpunten en Simon -

199
00:13:32,820 --> 00:13:37,280
die kunnen gebeuren in uw browser, en dan als je wilt een bericht of iets maken

200
00:13:37,280 --> 00:13:40,000
stuur je gewoon een ander verzoek.

201
00:13:40,000 --> 00:13:45,350
>> Er is ook een aantal mooie dingen die je kunt doen op de top van dit.

202
00:13:45,350 --> 00:13:49,550
In termen van meer specifieke technische informatie,

203
00:13:49,550 --> 00:13:53,360
ontwikkelen in gewone JavaScript kan een beetje pijnlijk,

204
00:13:53,360 --> 00:13:56,220
dus er zijn een aantal bibliotheken en tools die u helpen een hoop mee.

205
00:13:56,220 --> 00:14:03,690
Ik denk dat je waarschijnlijk allemaal gehoord over jQuery waardoor doen HTML rendering

206
00:14:03,690 --> 00:14:08,890
en manipulatie een stuk makkelijker - hebben veel luxe functies voor het vervagen in en uit,

207
00:14:08,890 --> 00:14:12,020
en het doen van zippy animaties.

208
00:14:12,020 --> 00:14:13,720
Er is ook deze bibliotheek genoemd Underscore.js.

209
00:14:13,720 --> 00:14:20,760
Het heeft een heleboel nuttige nutsfuncties, dingen die je zou verwachten JavaScript te hebben

210
00:14:20,760 --> 00:14:24,740
dat het echt Doesnt - dingen zoals schuifelen een array,

211
00:14:24,740 --> 00:14:28,900
het verwijderen van duplicaten uit een lijst, of afvlakking een lijst van lijsten.

212
00:14:28,900 --> 00:14:30,900
Dit is slechts een klein voorbeeld code.

213
00:14:30,900 --> 00:14:36,520
Underscore heeft een ton van deze mooie functies die je zou willen dat je de hele tijd te hebben.

214
00:14:36,520 --> 00:14:38,840
>> En dan is er nog 1 bibliotheek die ik zou graag een beetje tijd te besteden aan

215
00:14:38,840 --> 00:14:44,800
genoemd Backbone.js omdat Backbone echt helpt je om met modellen op de client

216
00:14:44,800 --> 00:14:47,210
en veel van de verwarring kan veroorzaken.

217
00:14:47,210 --> 00:14:53,550
Backbone geeft u dit concept van modellen en collecties

218
00:14:53,550 --> 00:14:58,300
in JavaScript die in feite zijn precies hetzelfde als JavaScript-objecten

219
00:14:58,300 --> 00:15:04,900
in JavaScript arrays maar ze hebben gebeurtenissen wanneer je hun eigenschappen veranderen.

220
00:15:04,900 --> 00:15:09,090
Net als in JavaScript, kunt u een gebeurtenis wanneer een knop wordt geklikt of iets

221
00:15:09,090 --> 00:15:14,800
deze Backbone modellen en Backbone collecties zullen dingen als uitzenden

222
00:15:14,800 --> 00:15:17,510
dat wanneer ze veranderen.

223
00:15:17,510 --> 00:15:22,270
Dat betekent dat je gewoon zoiets als dit stukje code kan schrijven hier -

224
00:15:22,270 --> 00:15:27,530
dit zegt, wanneer je iets toe te voegen aan de berichten matrix je de hele muur opnieuw te tekenen.

225
00:15:27,530 --> 00:15:34,270
En dit zou zeggen wanneer een post nummer 'likes verandert,

226
00:15:34,270 --> 00:15:38,970
u de gebruiker dat iemand graag hun post te melden.

227
00:15:38,970 --> 00:15:45,210
Of wanneer een eigenschap van een bericht wijzigt u de post opnieuw te tekenen.

228
00:15:45,210 --> 00:15:51,050
Dat soort dingen zullen u want anders redden ton complexiteit

229
00:15:51,050 --> 00:15:55,440
als je geen enkele kader als dit dan elke keer in je code die je verandert

230
00:15:55,440 --> 00:16:04,280
iets over een post, zou je moet jezelf niet vergeten om alle renderen functies aanroepen

231
00:16:04,280 --> 00:16:07,680
en dat soort dingen, en als je wilde iets nieuws dat gebeurd voegen

232
00:16:07,680 --> 00:16:10,680
elke keer dat u een bericht bewerkt zou je moeten gaan door elke plaats in uw

233
00:16:10,680 --> 00:16:14,610
code die u een bericht bewerkt en voeg dat nieuwe ding.

234
00:16:14,610 --> 00:16:21,450
Een kader als deze zal veel van dat tussen-layer communicatie verwijderen

235
00:16:21,450 --> 00:16:28,280
dat maakt uw code complex en moeilijk te handhaven.

236
00:16:28,280 --> 00:16:31,170
>> Er is een klein beetje over uitzicht ook.

237
00:16:31,170 --> 00:16:35,960
Ik ga het grootste deel van dit over te laten aan Billy omdat ze technisch niet erg moeilijk.

238
00:16:35,960 --> 00:16:43,540
Gebruik jQuery voor uw standpunten. Het is bijna als een noodzaak op dit punt.

239
00:16:43,540 --> 00:16:46,290
Het maakt alles zo veel makkelijker.

240
00:16:46,290 --> 00:16:48,290
Er zijn veel bibliotheken.

241
00:16:48,290 --> 00:16:49,970
Als je user-interface-elementen zijn ingewikkeld,

242
00:16:49,970 --> 00:16:57,250
als je wilt een auto-complete ding of van een van die chique multi-selectors -

243
00:16:57,250 --> 00:17:04,790
als je zoiets wilt, moet je waarschijnlijk gewoon zoeken rond

244
00:17:04,790 --> 00:17:08,130
en je kunt een goede bibliotheek die zal doen wat je wilt vinden.

245
00:17:08,130 --> 00:17:11,579
Billy zal meer uitleg geven over het eigenlijk moeilijk delen van standpunten.

246
00:17:11,579 --> 00:17:17,530
Ook, zoals een kanttekening, Backbone heeft een aantal functies voor het maken van visie geven

247
00:17:17,530 --> 00:17:22,800
mooi met modellen - kijk naar de documentatie voor al deze bibliotheken, eigenlijk.

248
00:17:22,800 --> 00:17:28,270
Kijk maar naar de docs. Ze zijn zeer goed geschreven en gemakkelijk te volgen.

249
00:17:28,270 --> 00:17:33,890
In het algemeen kun je vrijwel alleen Google als je problemen hebt.

250
00:17:33,890 --> 00:17:36,370
Er zijn een heleboel mensen gebruik van maken.

251
00:17:36,370 --> 00:17:42,020
Ik denk dat dit als een laatste opmerking.

252
00:17:42,020 --> 00:17:48,770
>> Er zijn ook enkele meer geavanceerde dingen die je kunt doen

253
00:17:48,770 --> 00:17:53,400
als u op zoek bent naar uw web-app extra awesome.

254
00:17:53,400 --> 00:17:59,760
U kunt dit doen - de nieuwe HTML5-specificatie heeft een heleboel mooie dingen die je kunt doen.

255
00:17:59,760 --> 00:18:05,780
Lokale opslag - die u kunt opslaan van gegevens in de browser -

256
00:18:05,780 --> 00:18:09,470
in plaats van terug te gaan en kennisnemen van de server voor alles,

257
00:18:09,470 --> 00:18:12,470
je kunt er wat van op de client te houden en dat ook laat mensen -

258
00:18:12,470 --> 00:18:20,850
in sommige gevallen zelfs kan laten u de webpagina offline te gebruiken.

259
00:18:20,850 --> 00:18:26,980
Er is dit ding heet WebSockets die een ander soort netwerk communicatie zijn

260
00:18:26,980 --> 00:18:30,930
waar in plaats van dat je een verzoek doen, antwoord krijg je en je bent klaar,

261
00:18:30,930 --> 00:18:35,240
je blijft een verbinding met de server te openen en dus kun je dingen doen, zoals

262
00:18:35,240 --> 00:18:37,240
real-time updates.

263
00:18:37,240 --> 00:18:42,020
Dus, als je probeert om een ​​praatje app te maken, je kon WebSockets gebruiken

264
00:18:42,020 --> 00:18:43,790
om heen en weer te communiceren, zodat je niet zou moeten blijven aanvragen,

265
00:18:43,790 --> 00:18:48,410
"Oh, server, heeft iemand stuur me een praatje? ' elke 10 seconden of zo.

266
00:18:48,410 --> 00:18:55,620
Er is ook een interessante HTML5 functie waar je kunt laten lijken

267
00:18:55,620 --> 00:18:58,340
de URL van de pagina verandert, zonder ooit te hebben om daadwerkelijk te herladen.

268
00:18:58,340 --> 00:19:03,230
U kunt back gebruiken en knoppen doorsturen zonder het doen van een stelletje netwerk verzoeken.

269
00:19:03,230 --> 00:19:14,660
Dat soort dingen is erg handig in termen van het maken van het snelle maar ook werken als een web app zou moeten.

270
00:19:14,660 --> 00:19:17,680
>> Er is ook dit ding heet CoffeeScript.

271
00:19:17,680 --> 00:19:24,450
CoffeeScript is een andere taal, in feite, dat compileert omlaag naar JavaScript.

272
00:19:24,450 --> 00:19:30,080
Je zou al uw code te schrijven in CoffeeScript, en dan heb je deze compiler draaien,

273
00:19:30,080 --> 00:19:33,300
en hij spuugt een JavaScript-bestand dat u kunt opnemen in uw webpagina.

274
00:19:33,300 --> 00:19:38,860
De reden dat CoffeeScript is leuk is omdat het zich ontdoet van een groot deel van de

275
00:19:38,860 --> 00:19:44,760
rare gevallen dat JavaScript heeft waar gelijk gelijken,

276
00:19:44,760 --> 00:19:51,130
en is gelijk gelijken doen verschillende dingen, of willen -

277
00:19:51,130 --> 00:19:55,740
het heeft mooiere syntax voor het omgaan met arrays en functies.

278
00:19:55,740 --> 00:20:00,460
Dit is een klein fragment van CoffeeScript dat een lijst van alle pleinen produceert

279
00:20:00,460 --> 00:20:04,900
10 ^ 2 naar 1 ^ 2 in omgekeerde volgorde.

280
00:20:04,900 --> 00:20:08,410
Zoals u kunt zien, CoffeeScript laat vaak je uitdrukken in 1 lijn

281
00:20:08,410 --> 00:20:10,890
wat 5 regels JavaScript zou nemen.

282
00:20:10,890 --> 00:20:13,230
Het kan dingen een stuk makkelijker maken.

283
00:20:13,230 --> 00:20:15,390
Het is een beetje van nieuwe syntax te leren op het eerste,

284
00:20:15,390 --> 00:20:18,010
maar het is zeker een hogere productiviteit op de lange termijn zal maken.

285
00:20:18,010 --> 00:20:22,050
>> U kunt ook gebruik maken van andere talen op de server dan PHP -

286
00:20:22,050 --> 00:20:27,570
talen zoals Ruby, Python, of er is zelfs een project genaamd Node.js

287
00:20:27,570 --> 00:20:31,450
dat laat je JavaScript gebruiken op de server.

288
00:20:31,450 --> 00:20:34,700
Persoonlijk ben ik echt een hekel aan PHP.

289
00:20:34,700 --> 00:20:38,310
Ik heb gewoon niet genieten van het werken met het.

290
00:20:38,310 --> 00:20:43,450
Als je ook denken dat het een vreselijke cluge van een taal,

291
00:20:43,450 --> 00:20:46,160
dan kun je in plaats daarvan gebruik van een van deze.

292
00:20:46,160 --> 00:20:54,780
In het algemeen, als je iets wilt doen en je weet niet echt hoe je het zou doen,

293
00:20:54,780 --> 00:20:56,780
gewoon zoeken op het internet.

294
00:20:56,780 --> 00:20:59,990
Er zijn tonnen en tonnen van middelen vooral op -

295
00:20:59,990 --> 00:21:03,260
StackOverflow is een geweldig.

296
00:21:03,260 --> 00:21:06,400
Het is deze website waar programmeurs elkaar vragen.

297
00:21:06,400 --> 00:21:09,690
Je zou kunnen hebben tegenkomen als je problemen hadden met het op CS50 probleem sets.

298
00:21:09,690 --> 00:21:16,820
En er zijn vele bibliotheken voor vrijwel alles wat je zou willen doen.

299
00:21:16,820 --> 00:21:21,710
Als je iets wilt doen en je weet niet hoe dat te doen,

300
00:21:21,710 --> 00:21:23,710
ga er niet vanuit dat het onmogelijk is.

301
00:21:23,710 --> 00:21:26,160
Gewoon rond te kijken en je zou een aantal goede middelen te vinden.

302
00:21:26,160 --> 00:21:29,280
>> Als algemene wrap up,

303
00:21:29,280 --> 00:21:33,650
de belangrijkste afhaalrestaurants zijn dingen eenvoudig te houden.

304
00:21:33,650 --> 00:21:36,010
Hoe complexer uw code is aan het begin

305
00:21:36,010 --> 00:21:40,370
en hoe meer je probeert te doen fancy dingen,

306
00:21:40,370 --> 00:21:43,300
hoe langer het duurt om iets daadwerkelijk functioneel te krijgen

307
00:21:43,300 --> 00:21:46,480
en hoe moeilijker het zal zijn om later te veranderen.

308
00:21:46,480 --> 00:21:49,580
Dus, doe dingen eerst de domme, gemakkelijke manier.

309
00:21:49,580 --> 00:21:51,720
Om mee te gaan met dat,

310
00:21:51,720 --> 00:21:59,070
wees niet bang voor het weggooien van oude code of op te ruimen veel.

311
00:21:59,070 --> 00:22:05,320
In het algemeen, als je eigenlijk iets werken,

312
00:22:05,320 --> 00:22:09,640
het is veel makkelijker om na te denken over dan wanneer je nog in de beginfase

313
00:22:09,640 --> 00:22:12,610
hoe zet ik dit allemaal samen.

314
00:22:12,610 --> 00:22:17,500
Het beste is om de domste mogelijke ontwerp dat werkt maken

315
00:22:17,500 --> 00:22:22,270
en te verbeteren vervolgens iteratief dan te proberen om alles goed te krijgen de eerste keer.

316
00:22:22,270 --> 00:22:28,330
In termen van client-server-divisie, proberen en houd je server heel eenvoudig -

317
00:22:28,330 --> 00:22:33,030
slechts een databank en een aantal authenticatie en geen harde werk daar doen.

318
00:22:33,030 --> 00:22:37,540
Doe al je ingewikkelde dingen op de client in de browser

319
00:22:37,540 --> 00:22:40,650
in JavaScript zoveel als je kunt.

320
00:22:40,650 --> 00:22:43,420
Kijk rond voor bibliotheken die u het leven aangenamer te maken.

321
00:22:43,420 --> 00:22:46,850
Altijd beter om code te gebruiken die iemand anders heeft geschreven

322
00:22:46,850 --> 00:22:49,850
als u - en niet om het zelf te schrijven.

323
00:22:49,850 --> 00:22:57,560
Er is een heleboel dingen op het internet. Google is je beste vriend.

324
00:22:57,560 --> 00:22:59,560
Google is de beste vriend van de programmeur.

325
00:22:59,560 --> 00:23:07,620
Ja, zeker niet bang om rond te kijken naar spullen.

326
00:23:07,620 --> 00:23:11,860
Oke. En over Billy.

327
00:23:11,860 --> 00:23:14,600
>> [Billy] Eigenlijk, voordat ik begin met een aantal ontwerp spullen,

328
00:23:14,600 --> 00:23:17,250
Heeft iemand enig vragen voor Ben over alles wat hij sprak over?

329
00:23:17,250 --> 00:23:20,290
Oke, goed.

330
00:23:20,290 --> 00:23:22,220
Nogmaals, laat het ons weten als er iets niet duidelijk is

331
00:23:22,220 --> 00:23:25,420
of als u wilt dat wij gaan over iets een beetje meer.

332
00:23:25,420 --> 00:23:30,330
Ik ga een stap terug een beetje en praten over de meer fundamentele onderdelen van het ontwerp.

333
00:23:30,330 --> 00:23:34,840
Ben hebben het model genaamd - sorry, het model controller view systeem

334
00:23:34,840 --> 00:23:38,520
dat is een soort van het technische aspect, dus ik ga kijken naar uitzicht specifiek,

335
00:23:38,520 --> 00:23:42,930
en ik ga beginnen met hoe je zou het ontwerpen van een standpunt dat er mooi uitziet.

336
00:23:42,930 --> 00:23:50,540
Hier is wel een heel basic template voor onze Cat Facebook.

337
00:23:50,540 --> 00:23:54,190
Ik denk dat er een aantal basisvoorwaarden in moderne UI-ontwerp

338
00:23:54,190 --> 00:23:56,190
die de moeite waard oppakken zijn.

339
00:23:56,190 --> 00:23:58,210
Je kunt merken dat er veel witte ruimte over de hele pagina,

340
00:23:58,210 --> 00:24:00,790
voldoende ruimte voor de dingen.

341
00:24:00,790 --> 00:24:02,580
Niet het gevoel dat je dingen squash in een pagina.

342
00:24:02,580 --> 00:24:06,700
U wilt veel ruimte open te laten, en als je naar vrijwel elke moderne website

343
00:24:06,700 --> 00:24:08,380
je zult zien dat er overal wit.

344
00:24:08,380 --> 00:24:10,380
Er is wit in plaatsen je niet zou verwachten.

345
00:24:10,380 --> 00:24:14,570
Je hebt dit kleurenpalet, en het is verstandig in het begin

346
00:24:14,570 --> 00:24:17,880
een kleurenpalet dat je gaat om te werken met en te ontwikkelen kiezen.

347
00:24:17,880 --> 00:24:22,250
U kunt ook - het helpt om een ​​lettertype kiezen, en op die manier je soort van werken met

348
00:24:22,250 --> 00:24:24,450
deze concrete fundamenten van het ontwerp.

349
00:24:24,450 --> 00:24:26,910
Je hebt je type, heb je je kleuren, en dan kan je soort van

350
00:24:26,910 --> 00:24:29,380
past alles in als dat nodig is.

351
00:24:29,380 --> 00:24:37,710
Dus, zoals ik al zei, met uw kleurenschema dat u wilt de bolder kleuren van uw kleurenschema gebruiken

352
00:24:37,710 --> 00:24:40,320
spaarzaam. Headers zijn mooi. Knoppen zijn mooi om echt te groot, flashy kleuren hebben.

353
00:24:40,320 --> 00:24:43,710
Maar in het algemeen, als je een website die kleuren heeft overal,

354
00:24:43,710 --> 00:24:47,250
alle staren je in het gezicht, het ziet er gewoon rommelig, en het is niet goed.

355
00:24:47,250 --> 00:24:50,430
U wilt het algemeen gebruik van lichte kleuren.

356
00:24:50,430 --> 00:24:52,890
Probeer, opnieuw, kies een mooi samenhangend kleurenschema.

357
00:24:52,890 --> 00:24:56,640
U kunt deze kleine spatten van veel kleur hebben -

358
00:24:56,640 --> 00:25:00,240
die kan kijken vrij aardig, maar je wilt ze vrij spaarzaam gebruiken.

359
00:25:00,240 --> 00:25:04,270
>> Zoals ik al zei, je wilt minimaal. Minder is bijna altijd meer.

360
00:25:04,270 --> 00:25:07,430
Als je iets kunt weergeven of niet weergeven iets,

361
00:25:07,430 --> 00:25:10,230
en je bent soort van onzeker of alles moet er standaard -

362
00:25:10,230 --> 00:25:13,400
Waarschijnlijk kun je het beste het verlaten van het uit. U kunt altijd in later.

363
00:25:13,400 --> 00:25:16,620
Ja, de dingen eenvoudig te houden.

364
00:25:16,620 --> 00:25:19,510
Maar belangrijker nog, u wilt meerdere ontwerpen te overwegen.

365
00:25:19,510 --> 00:25:23,520
Denk niet dat als je een site te maken, heb je het in je hoofd dat je gaat

366
00:25:23,520 --> 00:25:26,310
maken van de site op een bepaalde manier, en het gaat om te kijken precies zo.

367
00:25:26,310 --> 00:25:29,830
Het gaat om de blauwe balk aan de bovenkant en de blauwe kant bar

368
00:25:29,830 --> 00:25:32,670
en dan de gele sub-header ding.

369
00:25:32,670 --> 00:25:34,670
U wilt meerdere sjablonen te maken.

370
00:25:34,670 --> 00:25:37,350
U kunt - als je goed met Photo Shop bent, u kunt openen die op en soort

371
00:25:37,350 --> 00:25:39,600
het ontwerpen van een website als je het leuk om te kijken.

372
00:25:39,600 --> 00:25:41,680
Zo niet, kunt u gewoon gebruik maken van pen en papier,

373
00:25:41,680 --> 00:25:44,000
maar krassen meerdere ontwerpen.

374
00:25:44,000 --> 00:25:47,000
U wilt in principe een set-up waar je veel verschillende designs,

375
00:25:47,000 --> 00:25:50,810
en als men eindigt werken, dan is dat geweldig.

376
00:25:50,810 --> 00:25:53,370
Als men uiteindelijk niet, dan heb je altijd een ander te wenden tot.

377
00:25:53,370 --> 00:25:57,960
In het algemeen, niet het gevoel dat je moet worden beperkt

378
00:25:57,960 --> 00:26:00,830
naar wat ontwerp dat u in eerste instantie beslissen over.

379
00:26:00,830 --> 00:26:04,420
Ontwerpen zijn zeer variabel, en een deel van het belang van het model

380
00:26:04,420 --> 00:26:09,480
controller view systeem is dat je kunt wisselen in en uit verschillende weergaven die u wilt.

381
00:26:09,480 --> 00:26:13,510
U kunt de gegevens zwaaien op een manier, en dan beslissen, oh, eigenlijk, dat die goed werkt niet.

382
00:26:13,510 --> 00:26:19,190
Ik denk dat het soort van te ingewikkeld of er is hier een rol die niet echt werkt,

383
00:26:19,190 --> 00:26:22,150
dus ik ga gewoon steek te laten, dit standpunt en swap in een totaal nieuwe.

384
00:26:22,150 --> 00:26:24,790
We kunnen nog steeds gebruik maken van de oude modellen en de oude controllers.

385
00:26:24,790 --> 00:26:27,490
We kunnen alles doen op de server en client als we zou eerder.

386
00:26:27,490 --> 00:26:32,850
Maar de werkelijke golf van de gegevens weergegeven zal iets anders zijn.

387
00:26:32,850 --> 00:26:35,840
>> Voor zover daadwerkelijk de uitvoering van het ontwerp dat u wilt,

388
00:26:35,840 --> 00:26:39,330
als je eenmaal een paar ontwerpen geschetst op papier of op Photo Shop of wat dan ook,

389
00:26:39,330 --> 00:26:42,120
er zijn een aantal hulpmiddelen die voor u beschikbaar zijn gemaakt.

390
00:26:42,120 --> 00:26:45,700
De eerste je bent zeer vertrouwd met wat je HTML, PHP, of wat dan ook

391
00:26:45,700 --> 00:26:48,990
taal die u gebruikt alleen de statische pagina's op uw website te coderen.

392
00:26:48,990 --> 00:26:51,990
Je hebt veel gewerkt met HTML welk soort geeft u deze tags

393
00:26:51,990 --> 00:26:57,820
dat je dingen in kunt zetten, en eigenlijk is het een manier van het organiseren van uw inhoud.

394
00:26:57,820 --> 00:27:00,990
Bijvoorbeeld, je hebt de header daar, dus je gaat naar een header-tag hebben,

395
00:27:00,990 --> 00:27:05,770
en het gaat om wat tekst erin die waarschijnlijk gaat worden in een andere tag hebben.

396
00:27:05,770 --> 00:27:08,380
Dan heb je een zijbalk misschien met een aantal verschillende schakels,

397
00:27:08,380 --> 00:27:10,160
en die gaan allemaal in tags te scheiden.

398
00:27:10,160 --> 00:27:13,870
Dus, eigenlijk HTML bij zijn hart is een manier van het verdelen van de pagina hoe

399
00:27:13,870 --> 00:27:16,980
je uiteindelijk wilt formatteren.

400
00:27:16,980 --> 00:27:18,980
Dus nogmaals, heb jou eerder gezien.

401
00:27:18,980 --> 00:27:20,540
Je bent behoorlijk comfortabel met het werken met het nu

402
00:27:20,540 --> 00:27:23,120
gezien het feit dat je de laatste pset hopelijk heb gedaan,

403
00:27:23,120 --> 00:27:26,150
dus dat moet geen probleem zijn.

404
00:27:26,150 --> 00:27:31,280
>> Dan heb je CSS die in feite behandelt alle van het ontwerp statische aspecten.

405
00:27:31,280 --> 00:27:35,320
Het zou alle kleuren, alle positionering van verschillende elementen te behandelen,

406
00:27:35,320 --> 00:27:36,840
waar ze gaan ten opzichte van elkaar,

407
00:27:36,840 --> 00:27:41,530
hoe groot ze zijn, de verschillende soorten positioneringen die u zou hebben -

408
00:27:41,530 --> 00:27:46,030
in andere woorden, je kunt dingen vast, zodat wanneer je naar beneden scrollt ze blijven,

409
00:27:46,030 --> 00:27:48,700
of kun je dingen ten opzichte van andere elementen hebben.

410
00:27:48,700 --> 00:27:50,730
Al dat soort dingen is in CSS.

411
00:27:50,730 --> 00:27:54,630
Bovendien kunt u verschillende decoraties doen, kunt u tekst kleuren hebben,

412
00:27:54,630 --> 00:27:56,630
teksteffecten, al dat soort dingen.

413
00:27:56,630 --> 00:28:00,360
Ben gaf een echt goede seminar over dit afgelopen weekend,

414
00:28:00,360 --> 00:28:04,450
en dus zou ik zeker dat nagaan als je van plan een aantal mooie dingen te doen met CSS.

415
00:28:04,450 --> 00:28:09,850
CSS3 is eigenlijk de nieuwste versie van CSS, en het kan allerlei echt leuke dingen te doen.

416
00:28:09,850 --> 00:28:14,750
Het kan verlopen doen, je kunt mooie, afgeronde hoeken hebben, je kunt allerlei dingen doen

417
00:28:14,750 --> 00:28:17,940
om uw website kijken meer modern en fancy.

418
00:28:17,940 --> 00:28:22,150
>> Het volgende gereedschap is JavaScript en jQuery die Ben praatte een beetje over,

419
00:28:22,150 --> 00:28:24,150
maar ik zal een beetje verder te krijgen in.

420
00:28:24,150 --> 00:28:28,100
JavaScript, als je hebt gewerkt met het een beetje, of op zijn minst gezien in collegezaal,

421
00:28:28,100 --> 00:28:31,870
is een soort van een manier van dynamisch dingen doen in HTML.

422
00:28:31,870 --> 00:28:35,950
HTML, zoals u weet, is statisch, dus zodra je HTML kunt u deze niet wijzigen.

423
00:28:35,950 --> 00:28:40,050
Maar JavaScript, in sommige opzichten, is een manier om te kunnen om HTML te wijzigen.

424
00:28:40,050 --> 00:28:44,520
Dus u kunt dat doen, en dat is geweldig, maar Javascript is echt een pijn om mee te werken.

425
00:28:44,520 --> 00:28:49,050
Het is zo lang en stompe en zelfs de eenvoudigste dingen te doen

426
00:28:49,050 --> 00:28:51,630
vergt veel van de lijnen van de webbrowser.

427
00:28:51,630 --> 00:28:55,410
Dus, jQuery is eigenlijk een bibliotheek voor JavaScript dat al die vereenvoudigt.

428
00:28:55,410 --> 00:28:59,880
Het zegt, oke, als je wilt een vierkante doos van links komen hebben

429
00:28:59,880 --> 00:29:03,980
en verdwijnen in de pagina, zodat het in het midden, in JavaScript, dat zou duren -

430
00:29:03,980 --> 00:29:06,340
Ik weet het niet, een honderd regels te doen, en het zou een pijn,

431
00:29:06,340 --> 00:29:10,540
en je komt uit het haten van alles over web programmeren.

432
00:29:10,540 --> 00:29:15,380
JQuery je in principe het element-dot-fade-in, of iets dergelijks.

433
00:29:15,380 --> 00:29:18,580
Dus, zeer, zeer eenvoudige functies die zal u laten doen allerlei leuke animaties

434
00:29:18,580 --> 00:29:20,580
en dat soort dingen.

435
00:29:20,580 --> 00:29:23,300
Het andere ding dat deze 2 zijn echt goed voor is gewoon dynamische dingen te doen

436
00:29:23,300 --> 00:29:25,300
met de website.

437
00:29:25,300 --> 00:29:28,370
Dus, in plaats van alleen het hebben van uw HTML-pagina - die eigenlijk een aantal gegevens worden weergegeven, maar niet

438
00:29:28,370 --> 00:29:32,130
alles doen - zal Javascript en jQuery laten heb je knoppen waarop u kunt klikken op,

439
00:29:32,130 --> 00:29:37,960
en u kunt elementen en re-order te slepen en sorteren, en hebben nieuwe elementen

440
00:29:37,960 --> 00:29:40,500
toegevoegd of verwijderd. U kunt toevoegen-delete, dat soort dingen.

441
00:29:40,500 --> 00:29:44,570
Dus, jQuery doet ton leuke dingen.

442
00:29:44,570 --> 00:29:48,840
En Vipul is eigenlijk het geven van een seminar op het vandaag, geloof ik, bij 5-uur,

443
00:29:48,840 --> 00:29:51,220
dus als je rond kunt vasthouden zo lang, dat zou - 5 of 4?

444
00:29:51,220 --> 00:29:54,930
Four. Sorry. Het is eigenlijk direct na deze, dus ik zou aanraden

445
00:29:54,930 --> 00:29:56,680
om te blijven als je kunt.

446
00:29:56,680 --> 00:30:00,180
JQuery is super, super handig, en je zult in staat zijn om veel echt leuke dingen mee doen

447
00:30:00,180 --> 00:30:03,460
voor vrijwel elke web development project.

448
00:30:03,460 --> 00:30:06,200
>> Nu ga ik om in vorm van een onderscheid.

449
00:30:06,200 --> 00:30:08,210
Ik heb eigenlijk het over user interface.

450
00:30:08,210 --> 00:30:11,510
Gebruikersinterface is enkel het ontwerp van de site.

451
00:30:11,510 --> 00:30:13,780
Maar er is een soort van een ander concept dat is user experience.

452
00:30:13,780 --> 00:30:15,900
De twee zijn zeer verschillend.

453
00:30:15,900 --> 00:30:19,440
Interface is zeker een deel van de ervaring.

454
00:30:19,440 --> 00:30:21,340
Met andere woorden, wanneer je naar een site, je kijkt naar de interface.

455
00:30:21,340 --> 00:30:22,960
Dat is een deel van de manier waarop u de site ervaart.

456
00:30:22,960 --> 00:30:24,960
Maar gebruikerservaring is meer dan dat.

457
00:30:24,960 --> 00:30:29,910
User experience is over wat de indruk dat de gebruiker krijgt van uw site is.

458
00:30:29,910 --> 00:30:31,910
Dus uiteraard interface is een onderdeel van.

459
00:30:31,910 --> 00:30:35,340
En het is zeker een noodzakelijk onderdeel, maar het is niet voldoende.

460
00:30:35,340 --> 00:30:38,790
Met andere woorden, als je een mooie interface, en het is mooi en kleurrijk en dat alles,

461
00:30:38,790 --> 00:30:43,650
dat is geweldig, maar als de gebruiker naar uw site, ziet een mooie lay-out en het is in de war door

462
00:30:43,650 --> 00:30:47,060
alles, heeft geen idee hoe om iets te doen, dan is het duidelijk dat je een echt gemaakt

463
00:30:47,060 --> 00:30:48,930
slechte website.

464
00:30:48,930 --> 00:30:50,930
Dat is een soort van waar gebruikerservaring komt inch

465
00:30:50,930 --> 00:30:54,570
Ik ga een beetje praten over UX design - UX is een afkorting voor user experience -

466
00:30:54,570 --> 00:30:58,050
en een soort van hoe kunt u ervoor zorgen dat u een goede gebruikerservaring.

467
00:30:58,050 --> 00:31:04,330
Het eerste punt is dat je een website kan ontwerpen waar een gebruiker iets kan doen

468
00:31:04,330 --> 00:31:06,820
die gebruiker mogelijk wil.

469
00:31:06,820 --> 00:31:08,940
Maar als de gebruiker niet kan achterhalen hoe die dingen te doen -

470
00:31:08,940 --> 00:31:12,850
in andere woorden, als de gebruiker niet beschikt over een goed idee wanneer ze naar uw site van,

471
00:31:12,850 --> 00:31:17,660
"O, als ik wil mijn profiel aanpassen, dan heb ik op deze knop klikt, of als ik wil posten op

472
00:31:17,660 --> 00:31:20,850
muur van een ander, dan ga ik naar hun muur en klik op een doosje. "

473
00:31:20,850 --> 00:31:24,410
Als de gebruiker niet weet dat, dan heb je effectief eigenlijk niet

474
00:31:24,410 --> 00:31:27,080
geïmplementeerd die functionaliteit correct.

475
00:31:27,080 --> 00:31:30,900
Een deel van de uitvoering van een functie is dat de gebruikers daadwerkelijk in staat zijn om het te gebruiken.

476
00:31:30,900 --> 00:31:34,810
En het zou frustrerend zijn - je zou een site te maken, en het kan alle soorten doen

477
00:31:34,810 --> 00:31:37,810
prachtige dingen, maar dan moet je mensen testen en zeggen: "Het kan dit niet doen.

478
00:31:37,810 --> 00:31:39,770
Waarom kan het niet doen? 'En je komt terug tot hen zeggen:

479
00:31:39,770 --> 00:31:44,420
"Nou ja, het kan. Je moet gewoon naar de 7e drop-down menu te gaan op deze obscure

480
00:31:44,420 --> 00:31:48,470
pagina die alleen wordt gevonden door een link onderaan-rechtse hoek "of iets.

481
00:31:48,470 --> 00:31:50,430
Uiteraard wil je niet dat.

482
00:31:50,430 --> 00:31:53,420
Je wilt dat het duidelijk aan uw gebruikers wat ze moeten doen,

483
00:31:53,420 --> 00:31:56,240
en het moet eenvoudig en intuïtief voor hen.

484
00:31:56,240 --> 00:32:01,180
>> Een ander ding dat je wilt proberen te doen is, als iemand gaat naar uw site

485
00:32:01,180 --> 00:32:05,520
en 9 van de 10 keer doen actie A, en 1 van de 10 keer doen actie B,

486
00:32:05,520 --> 00:32:08,950
wilt u waarschijnlijk hun ervaring over de actie A. richten

487
00:32:08,950 --> 00:32:12,240
Met andere woorden, je wilt het heel, heel duidelijk hoe A. doen

488
00:32:12,240 --> 00:32:15,980
A moet voor-en-centrum - ga naar de site, zie het, oh, het is daar.

489
00:32:15,980 --> 00:32:20,850
Overwegende B natuurlijk je wil duidelijk zijn, maar je kunt het een beetje meer te verlaten

490
00:32:20,850 --> 00:32:22,850
op de achtergrond.

491
00:32:22,850 --> 00:32:24,640
David geeft een goed voorbeeld van deze in collegezalen,

492
00:32:24,640 --> 00:32:26,640
die de Boston T systeem.

493
00:32:26,640 --> 00:32:29,440
Als je naar de Boston T en u wilt een kaartje kopen,

494
00:32:29,440 --> 00:32:32,700
je moet krijgen in 5 menu's voordat je daadwerkelijk kunt een kaartje kopen

495
00:32:32,700 --> 00:32:37,130
voor een $ 2, $ 2,50 waarde, dat is hoeveel het kost om de metro

496
00:32:37,130 --> 00:32:39,130
in een richting.

497
00:32:39,130 --> 00:32:41,600
Dat is een probleem omdat de meeste mensen die het rijden van de metro

498
00:32:41,600 --> 00:32:44,880
waarschijnlijk gewoon wilt gaan naar een plek, kopen hun kaartje, krijgen meteen.

499
00:32:44,880 --> 00:32:47,550
Het heeft geen zin dat ze moeten gaan door veel verschillende menu's

500
00:32:47,550 --> 00:32:49,550
om er te komen.

501
00:32:49,550 --> 00:32:51,760
Een betere gebruikerservaring zou een sneltoets op de eerste pagina worden

502
00:32:51,760 --> 00:32:54,760
dat gewoon zegt: 'koop een one-way ticket,' en dat zou zetten in alle standaard

503
00:32:54,760 --> 00:32:58,550
standaardwaarden, en dan als iemand wil een ander kaartje dan die kopen,

504
00:32:58,550 --> 00:33:01,690
ze nog steeds, natuurlijk, hebben de mogelijkheid om, maar je hebt geoptimaliseerd voor

505
00:33:01,690 --> 00:33:04,080
het common-use case die is echt belangrijk.

506
00:33:04,080 --> 00:33:06,830
U kunt voorbeelden van te zien op Facebook, toch?

507
00:33:06,830 --> 00:33:09,410
Als je naar Facebook en u wilt een stand te plaatsen,

508
00:33:09,410 --> 00:33:11,710
het is vlak aan de top en dat is wat je vaak wilt doen.

509
00:33:11,710 --> 00:33:14,730
Zodra u de pagina invoert, kunt u de meest voorkomende dingen doen die

510
00:33:14,730 --> 00:33:16,730
je wilt doen.

511
00:33:16,730 --> 00:33:17,550
Wilt u iets meer ingewikkelde dingen doen zoals,

512
00:33:17,550 --> 00:33:21,070
zeggen dat ik wil naar de muur van mijn vriend en post een foto op het -

513
00:33:21,070 --> 00:33:24,810
die ik zal willen vaak doen, maar niet zo vaak als het plaatsen van status updates -

514
00:33:24,810 --> 00:33:28,200
dus in dat geval, ik hun naam te typen in het vak bovenaan, klik op hun profiel,

515
00:33:28,200 --> 00:33:31,680
en dan nog, het is juist aan de top er eens ik heb gekregen om hun profiel.

516
00:33:31,680 --> 00:33:38,240
Nogmaals, ik heb geoptimaliseerd prioriteit voor de meest voorkomende use cases.

517
00:33:38,240 --> 00:33:41,800
>> Een ander belangrijk ding is dat vaak mensen zullen soort proberen om dit te omzeilen

518
00:33:41,800 --> 00:33:44,890
door te zeggen, oke, dus ik heb de site gemaakt en de mensen vinden het verwarrend,

519
00:33:44,890 --> 00:33:46,110
en dat is een probleem, toch?

520
00:33:46,110 --> 00:33:49,210
Uiteraard wil ik niet dat mensen te verwarren door de inhoud van mijn site.

521
00:33:49,210 --> 00:33:53,210
Maar de manier op te lossen, dat is niet om iets pop-up te zeggen,

522
00:33:53,210 --> 00:33:55,290
hey, ik ga je leren hoe je deze site te gebruiken.

523
00:33:55,290 --> 00:33:58,130
Stap 1 - Klik op deze knop. Stap 2 - ga hier.

524
00:33:58,130 --> 00:34:03,080
Tuurlijk, dat is een weg omheen - het is een manier dat je mensen kunt vertellen wat te doen, maar het is

525
00:34:03,080 --> 00:34:05,080
echt niet de optimale manier.

526
00:34:05,080 --> 00:34:07,420
Als ik naar een website en opeens ben ik gebombardeerd met deze tutorial die vertelt me

527
00:34:07,420 --> 00:34:11,739
wat te doen en waar te gaan en dat alles, dat is niet leuk voor mij.

528
00:34:11,739 --> 00:34:13,739
Het is niet een goede ervaring voor mij.

529
00:34:13,739 --> 00:34:17,130
Het is een soort van een pijn. Ik wil gewoon beginnen met het doen van dingen.

530
00:34:17,130 --> 00:34:19,449
Mensen gaan sluiten uit hun dialoogvenster

531
00:34:19,449 --> 00:34:23,580
of uit de tutorial, niet weten wat te doen, en dan klagen omdat

532
00:34:23,580 --> 00:34:25,580
je hebt ze niet verteld wat te doen.

533
00:34:25,580 --> 00:34:29,530
De manier om dit op te lossen is niet door het geven van enige vorm van tutorial of richtingen -

534
00:34:29,530 --> 00:34:31,530
iets dergelijks.

535
00:34:31,530 --> 00:34:33,719
Zo veel als je het kunt vermijden, je echt wilt om de gebruiker te laten zien wat je moet doen

536
00:34:33,719 --> 00:34:36,429
alleen door de aard van hoe de website wordt aangelegd.

537
00:34:36,429 --> 00:34:39,090
Met andere woorden, als ik naar Facebook zonder aan te melden,

538
00:34:39,090 --> 00:34:40,920
het eerste wat ik zie op de hoofdpagina -

539
00:34:40,920 --> 00:34:44,480
het is een beetje login box. Dus, duh. Ik moet loggen Het is daar.

540
00:34:44,480 --> 00:34:48,030
Overwegende dat, als ik naar Facebook en ik moest op een kleine link onderaan

541
00:34:48,030 --> 00:34:51,920
dat zei 'inloggen' en de rest van de pagina is het gewoon een soort van beeld of iets,

542
00:34:51,920 --> 00:34:54,820
Ik zou niet echt weten wat te doen, toch? Ik zou verwarren.

543
00:34:54,820 --> 00:34:58,590
Dus, zou het me vertellen om daar beneden te gaan en klik op de knop om in te loggen,

544
00:34:58,590 --> 00:35:01,080
of de log in knop zou gelijk kunnen hebben op de top waar ik ga om het te zien.

545
00:35:01,080 --> 00:35:04,780
U wilt altijd met de gebruiker wat te doen,

546
00:35:04,780 --> 00:35:06,750
en dat zou inherent zijn aan de pagina zelf.

547
00:35:06,750 --> 00:35:09,880
>> Als u denkt over het ontwerpen en het bespotten van verschillende manieren van

548
00:35:09,880 --> 00:35:13,810
uiten van uw site, wil je echt nadenken over wat de gebruikers gaan

549
00:35:13,810 --> 00:35:19,380
moeten doen en hoe je ze kunt laten zien wat je moet doen.

550
00:35:19,380 --> 00:35:23,530
Een laatste ding is testen is echt heel belangrijk.

551
00:35:23,530 --> 00:35:27,400
Het is geweldig om iemand - krijgen een vriend, iemand die je niet eens kennen -

552
00:35:27,400 --> 00:35:30,420
die nog nooit van de site heeft gezien voordat de site te gebruiken.

553
00:35:30,420 --> 00:35:33,650
Omdat je hebt gewerkt op de site voor uren, je hebt staren,

554
00:35:33,650 --> 00:35:36,670
en je weet precies wat te doen natuurlijk je gaat het testen van de

555
00:35:36,670 --> 00:35:39,520
dingen die je hebt gewerkt en dat je weet werk.

556
00:35:39,520 --> 00:35:42,680
Maar als iemand anders komt langs en maakt gebruik van de site die nog nooit eerder heeft gebruikt,

557
00:35:42,680 --> 00:35:46,880
dat is een unieke ervaring, omdat je iemand die geen voorkennis hebben

558
00:35:46,880 --> 00:35:51,530
van de site in te gaan op het, dus ze gaan te hebben effectief geen idee wat te doen

559
00:35:51,530 --> 00:35:54,890
of wat voor soort use cases voor hen aanwezig zijn.

560
00:35:54,890 --> 00:36:00,930
Dat is geweldig. Dat is uniek omdat ze in wezen een persoon met een blanco voor een geest.

561
00:36:00,930 --> 00:36:03,750
Zij kunnen u vertellen als er iets is verwarrend of onduidelijk.

562
00:36:03,750 --> 00:36:07,580
Zij kunnen u een idee van precies wat de gebruikerservaring van uw site is te geven.

563
00:36:07,580 --> 00:36:10,630
Het kan heel moeilijk zijn om te vertellen dat jezelf, dus zeker ik wil u aanmoedigen

564
00:36:10,630 --> 00:36:13,640
als je de ontwikkeling van uw projecten - al doe je web-based projecten -

565
00:36:13,640 --> 00:36:18,290
om mensen die de site zo vroeg als je een soort van functionele demo.

566
00:36:18,290 --> 00:36:25,330
>> Nu ga ik een beetje over hoe je een web development project te beheren praten.

567
00:36:25,330 --> 00:36:28,900
We hebben laten zien hoe je de technische back-end kant kan doen,

568
00:36:28,900 --> 00:36:31,050
hoe je een echt goede website kan ontwerpen,

569
00:36:31,050 --> 00:36:34,150
en dat is geweldig als je werkt door jezelf, maar -

570
00:36:34,150 --> 00:36:37,300
zelfs als je werkt door jezelf en vooral als je werkt in een team,

571
00:36:37,300 --> 00:36:39,580
projectmanagement wordt een groot probleem.

572
00:36:39,580 --> 00:36:42,340
Je hebt een soort gehoord over projectmanagement in verschillende vormen sinds

573
00:36:42,340 --> 00:36:45,410
basisschool wanneer u groepswerk verteld.

574
00:36:45,410 --> 00:36:46,820
Je moet samenwerken, communiceren, dat allemaal.

575
00:36:46,820 --> 00:36:49,620
Dat geldt allemaal nog hier, maar er zijn enkele unieke omstandigheden met

576
00:36:49,620 --> 00:36:54,910
informatica die u wilt op de hoogte van, en wilt u ervoor zorgen dat u goed omgaan.

577
00:36:54,910 --> 00:36:58,050
Ik ga eerst een beetje praten over het team dat je in inch

578
00:36:58,050 --> 00:37:03,280
Het is erg belangrijk om de juiste grootte van een team te werken op te halen,

579
00:37:03,280 --> 00:37:05,890
en in uw uiteindelijke project Ik denk dat je de mogelijkheid om te kiezen

580
00:37:05,890 --> 00:37:08,610
tussen de 1 en 4 personen als ik het goed heb.

581
00:37:08,610 --> 00:37:12,050
U wilt ervoor zorgen dat je niet alleen het kiezen van het aantal mensen

582
00:37:12,050 --> 00:37:14,950
dat je wilt werken, omdat ze zijn je vrienden.

583
00:37:14,950 --> 00:37:18,170
U wilt een team dat is een goede maat kiezen en dat zal de klus te klaren.

584
00:37:18,170 --> 00:37:22,700
Er is een afweging in het hebben van meer mensen versus minder mensen.

585
00:37:22,700 --> 00:37:25,320
Als u nog meer mensen, kan uiteraard meer werk worden gedaan

586
00:37:25,320 --> 00:37:28,450
want je hebt veel mensen, veel code, veel ideeën,

587
00:37:28,450 --> 00:37:29,870
en dat is allemaal geweldig.

588
00:37:29,870 --> 00:37:32,590
Maar het vereist ook veel meer het beheer en veel meer communicatie.

589
00:37:32,590 --> 00:37:34,720
Met andere woorden, als je 4 mensen die werken aan hetzelfde project

590
00:37:34,720 --> 00:37:39,200
en ze zijn allemaal bewerkt dezelfde code, meer of minder ze allerlei behoefte om te weten

591
00:37:39,200 --> 00:37:40,920
wat er aan de hand dus het u vereist -

592
00:37:40,920 --> 00:37:44,580
als je nog wat nieuwe functie toe te voegen u soort hebben om mensen te vertellen - ik ben het toevoegen van deze,

593
00:37:44,580 --> 00:37:48,510
Ik verander dit op deze manier - vooral als je in het echt diep spul

594
00:37:48,510 --> 00:37:52,730
als de modellen en de controllers die daadwerkelijk gaan beïnvloeden hoe de site werkt.

595
00:37:52,730 --> 00:37:54,500
Het hele team moet zich bewust zijn van het,

596
00:37:54,500 --> 00:37:58,140
dus je moet ervoor zorgen dat je niet de keuze te groot een team dat zal moeilijk zijn

597
00:37:58,140 --> 00:37:59,970
om die communicatie te maken.

598
00:37:59,970 --> 00:38:02,930
Je wilt ook niet een klein genoeg team dat je niet gaat om te kiezen

599
00:38:02,930 --> 00:38:06,250
kunnen communiceren, want het is alleen jij.

600
00:38:06,250 --> 00:38:11,270
>> Een ander ding om te overwegen is het saldo van waar de vaardigheden van mensen zijn.

601
00:38:11,270 --> 00:38:14,350
Het is geweldig als je echt goed programmeurs.

602
00:38:14,350 --> 00:38:17,050
Maar als je alle back-end mensen, dan is uw website is niet van plan heel goed te kijken

603
00:38:17,050 --> 00:38:20,860
want je hebt deze grote databank, en het doet supersnel zoekopdrachten -

604
00:38:20,860 --> 00:38:26,130
wat geweldig is - maar als je naar het, het is als een site van 1990 met rode en blauwe

605
00:38:26,130 --> 00:38:30,370
overal, en dat is ook niet goed.

606
00:38:30,370 --> 00:38:34,210
Merk op dat Ben en ik werken als een team zijn erg leuk, want ik ben een soort meer

607
00:38:34,210 --> 00:38:38,030
in de front-end, we zowel interactie in het midden-einde, en Ben is echt goed met back-end spul,

608
00:38:38,030 --> 00:38:43,550
zodat werkt echt goed, omdat we een site kunnen ontwerpen en in principe de gaten

609
00:38:43,550 --> 00:38:47,580
in die site die moeten worden opgevuld kan worden ingevuld door een van ons, of misschien beide.

610
00:38:47,580 --> 00:38:50,210
U wilt ervoor zorgen dat er geen gaten in je team.

611
00:38:50,210 --> 00:38:51,180
Het is oke als er een beetje overlap.

612
00:38:51,180 --> 00:38:53,670
Met andere woorden, als je 2 mensen die zowel goed met back-end zijn,

613
00:38:53,670 --> 00:38:57,250
dat kan goed zijn maar ook omdat ze elkaar kunnen helpen met problemen

614
00:38:57,250 --> 00:38:58,820
dat ze hebben.

615
00:38:58,820 --> 00:39:02,590
Het kan een probleem zijn als je alleen maar 1 persoon die verantwoordelijk is voor een bepaald ding

616
00:39:02,590 --> 00:39:06,650
en ze lopen in een probleem, dus je wilt wel een beetje overlap hebben

617
00:39:06,650 --> 00:39:10,760
maar je vooral wilt u ervoor zorgen dat alle mogelijke gaten gevuld.

618
00:39:10,760 --> 00:39:17,550
>> Het laatste wat - en dit zou duidelijk moeten zijn, maar het is vaak niet.

619
00:39:17,550 --> 00:39:19,550
Wil je echt te hebben plezier.

620
00:39:19,550 --> 00:39:23,360
Het punt van dit laatste project in CS50 en vaak het punt van web ontwikkeling in het algemeen

621
00:39:23,360 --> 00:39:26,360
is niet om gewoon een baan, want het moet doen.

622
00:39:26,360 --> 00:39:29,140
Wil je echt plezier te hebben, en je wilt te maken van iets

623
00:39:29,140 --> 00:39:31,180
dat is het motiveren u om eraan te werken.

624
00:39:31,180 --> 00:39:33,650
Als alles wat je maakt is een pijn om te gaan zitten en te werken aan,

625
00:39:33,650 --> 00:39:35,650
dan ben je niet kiezen van het juiste project.

626
00:39:35,650 --> 00:39:37,730
U wilt iets dat je interessant vindt te kiezen,

627
00:39:37,730 --> 00:39:41,150
je echt wilt om het resultaat te zien, je opgewonden bent wanneer u een nieuw idee over te krijgen

628
00:39:41,150 --> 00:39:44,700
iets wat je zou kunnen doen - dus er is allerlei projecten daar dat ik ben er zeker van

629
00:39:44,700 --> 00:39:47,290
u kunt vinden - iedereen heeft iets dat hen echt zou intrigeren

630
00:39:47,290 --> 00:39:49,290
als ze doen een web-based project.

631
00:39:49,290 --> 00:39:52,210
Ik zal het nogmaals zeggen op dit moment.

632
00:39:52,210 --> 00:39:54,520
Als uw project lijkt een pijn en je niet wilt werken,

633
00:39:54,520 --> 00:39:57,260
kiezen voor een ander project. Kies iets dat je echt inspireert.

634
00:39:57,260 --> 00:40:00,260
>> Ben vermeld dit concept van iteratie een beetje, en ik wil gaan over het een beetje.

635
00:40:00,260 --> 00:40:08,250
Het is echt belangrijk om te werken in spurts waar je iets functioneel te krijgen.

636
00:40:08,250 --> 00:40:13,420
Het kan geweldig zijn als u dit plan voor een website die gaat doen A, B, en C,

637
00:40:13,420 --> 00:40:16,000
en uiteindelijk zal het er te komen.

638
00:40:16,000 --> 00:40:18,600
Maar je vastzit in deze fase waar je mee bezig en aan het werken,

639
00:40:18,600 --> 00:40:23,330
maar er is niets gedaan krijgen. Je hoeft niet alles te zien en een tastbaar, functioneel ding.

640
00:40:23,330 --> 00:40:27,940
Wat je echt wilt doen zo veel als het lijkt soort van een pijn soms

641
00:40:27,940 --> 00:40:32,300
werken aan iets en dan soort van dop het af, zodat het in ieder geval op een stabiel, hardlopen

642
00:40:32,300 --> 00:40:34,910
versie zelfs als het niet alle functies die u wilt heeft.

643
00:40:34,910 --> 00:40:37,690
En misschien zijn er een aantal functies die je echt wilt toevoegen, maar je kan het gewoon niet

644
00:40:37,690 --> 00:40:41,830
want je wilt deze site te krijgen om een ​​functioneel oogpunt.

645
00:40:41,830 --> 00:40:44,400
En dus je wilt soort hebt de hele ontwikkelingsproces uitzien.

646
00:40:44,400 --> 00:40:47,810
U wilt ergens functionele starten - of in wezen beginnen met niets -

647
00:40:47,810 --> 00:40:49,890
maar je ergens erg basic en functioneel te krijgen.

648
00:40:49,890 --> 00:40:54,940
En dan weer, maak een soort van jump en krijg weer ergens functioneel.

649
00:40:54,940 --> 00:40:59,190
Je zult langzaam opbouwen, en het misschien een beetje trager dan het zou anders gaan,

650
00:40:59,190 --> 00:41:03,000
maar op de lange termijn als je voortdurend vast in deze middenweg fase waarin je

651
00:41:03,000 --> 00:41:06,380
niet daadwerkelijk iets werkt, kan het een echt grote frustratie

652
00:41:06,380 --> 00:41:09,970
te werken aan uw project, omdat je altijd zo dicht bij het krijgen van het werken,

653
00:41:09,970 --> 00:41:12,130
en het is nooit echt werkt.

654
00:41:12,130 --> 00:41:14,810
U wilt werken in deze functionele spurts,

655
00:41:14,810 --> 00:41:17,950
en u wilt ook enige reflectie doen na elk een.

656
00:41:17,950 --> 00:41:21,260
Met andere woorden, zodra je op een punt waar de site nu werkt -

657
00:41:21,260 --> 00:41:24,790
het niet alles wat je wilt hebben, maar het doet sommige dingen -

658
00:41:24,790 --> 00:41:28,870
wilt u misschien denken, oke, is deze site het realiseren van de doelstelling die ik uiteengezet te doen?

659
00:41:28,870 --> 00:41:33,410
Met andere woorden, als de site gaat X doen, is wat ik werkzaam richting X?

660
00:41:33,410 --> 00:41:36,450
Zijn alle functionaliteiten die ik daar wilde?

661
00:41:36,450 --> 00:41:39,340
En bovendien is het dienen van het algemene doel dat ik wil?

662
00:41:39,340 --> 00:41:43,200
Als je het vinden dat uw site begint te neigen in een andere richting

663
00:41:43,200 --> 00:41:47,330
of misschien dingen gewoon soort zijn niet uit te werken, kan het tijd om te schakelen een beetje zijn.

664
00:41:47,330 --> 00:41:51,700
Met andere woorden, het is het overwegen waard - het is de moeite waard gooien ideeën indien nodig

665
00:41:51,700 --> 00:41:57,950
en gezien ben ik echt aan het werk in de richting van wat ik wil zijn.

666
00:41:57,950 --> 00:42:00,760
>> Ik geloof dat mijn volgende punt. Wees niet bang om ideeën te verlaten.

667
00:42:00,760 --> 00:42:03,750
Gewoon omdat je besteed veel uren werken aan een functie

668
00:42:03,750 --> 00:42:07,890
en eindelijk het werkt, maar het is echt niet zo goed gaat -

669
00:42:07,890 --> 00:42:12,690
alsof het niet zo nuttig of gebruikers problemen hebben met het gebruik ervan - dat soort dingen -

670
00:42:12,690 --> 00:42:15,300
wees niet bang om weg te gooien.

671
00:42:15,300 --> 00:42:17,650
Het zuigt dat je veel tijd hebt besteed aan het werken,

672
00:42:17,650 --> 00:42:21,870
maar uiteindelijk ga je niet een site die soort in elkaar zit door deze stukken willen dat

673
00:42:21,870 --> 00:42:25,380
soort werk, maar zijn niet zo goed bediend.

674
00:42:25,380 --> 00:42:27,990
Ook moet je niet bang zijn voor nieuwe ideeën.

675
00:42:27,990 --> 00:42:30,050
Als iemand komt langs en zegt: hey, die site ziet er echt cool, maar

676
00:42:30,050 --> 00:42:32,290
zou het niet eens geweldig zijn als het dit ook deden?

677
00:42:32,290 --> 00:42:36,220
Gewoon omdat dat is iets dat je niet van plan was en iets dat niet in uw

678
00:42:36,220 --> 00:42:37,900
specs, iets dat je niet te doen hebben uiteengezet,

679
00:42:37,900 --> 00:42:40,860
wees niet bang om het op te nemen en dan werken.

680
00:42:40,860 --> 00:42:43,680
Omdat vaak de ideeën die u uitvoert met de hele loop van de ontwikkeling

681
00:42:43,680 --> 00:42:47,630
uiteindelijk wordt het echt coole functies van de website.

682
00:42:47,630 --> 00:42:49,630
>> Ik heb dit al eerder gezegd. Ik zeg het nogmaals.

683
00:42:49,630 --> 00:42:51,630
Testers zijn super, super handig.

684
00:42:51,630 --> 00:42:56,350
Proberen om mensen die nog nooit van de site hebben eerder gezien om in te loggen en te zien wat er aan de hand te krijgen

685
00:42:56,350 --> 00:42:59,080
omdat ze niet alleen het nut van de site en de gebruikerservaring kan testen,

686
00:42:59,080 --> 00:43:02,070
maar ze kunnen ook de functionaliteit te testen op een manier die je niet kunt.

687
00:43:02,070 --> 00:43:06,430
Als u enkele functie die een bepaald ding maakt

688
00:43:06,430 --> 00:43:11,620
en je weet dat het gaat om dat zelfde ding goed te doen elke keer, dat is geweldig.

689
00:43:11,620 --> 00:43:16,610
Maar het kan vaak moeilijk zijn om rekening te houden hoek gevallen waarin een gebruiker kan

690
00:43:16,610 --> 00:43:19,500
Typ iets dat je niet verwacht - juist omdat u hebt gedefinieerd

691
00:43:19,500 --> 00:43:21,500
de functies zelf.

692
00:43:21,500 --> 00:43:23,730
Dus, om iemand komen op die geen idee heeft hoe de site te gebruiken

693
00:43:23,730 --> 00:43:26,840
en gewoon breken in welke manieren ze kunnen doen is erg handig omdat je

694
00:43:26,840 --> 00:43:30,340
een idee vanuit een heel ander perspectief van wat op uw site werkt

695
00:43:30,340 --> 00:43:33,300
en wat moet worden gerepareerd.

696
00:43:33,300 --> 00:43:37,070
>> Eindelijk, ik ga praten over een aantal algemene goede praktijken,

697
00:43:37,070 --> 00:43:42,470
en je hebt veel van deze gezien in CS50, maar ze ook echt, echt passen in een project omgeving.

698
00:43:42,470 --> 00:43:47,600
Een is opmerkingen. Comment altijd uw code vooral als je werkt aan een groot team.

699
00:43:47,600 --> 00:43:51,230
Het kan zo vervelend om gewoon een gigantische blok code dat iemand geschreven zijn

700
00:43:51,230 --> 00:43:54,230
en misschien werkt het, misschien niet, maar je hebt geen idee wat het doet,

701
00:43:54,230 --> 00:43:58,010
dus je hebt geen idee of het nuttig is of niet of dat het er moet zijn of niet,

702
00:43:58,010 --> 00:44:00,200
en als je werkt aan iets anders is het zelfs mogelijk dat je bezig bent

703
00:44:00,200 --> 00:44:06,590
hetzelfde, dus gewoon heel, heel voorzichtig rekening met uw collega's te zijn

704
00:44:06,590 --> 00:44:09,710
en code schrijven dat is goed gedocumenteerd.

705
00:44:09,710 --> 00:44:13,580
Je hoeft niet zo ver gaan om de hele zaak waar leuk vinden als je verhogen doen

706
00:44:13,580 --> 00:44:16,620
een teller hebben een reactie die zegt, ik ben het toevoegen van 1 tot deze teller.

707
00:44:16,620 --> 00:44:20,450
Het hoeft niet dat gedetailleerd te zijn, maar voor elke functie die u ooit aan het schrijven bent

708
00:44:20,450 --> 00:44:23,160
moet je wat documentatie van wat die functie precies doet hebben,

709
00:44:23,160 --> 00:44:25,140
wat de ingangen zijn, en wat het zou moeten terugkeren.

710
00:44:25,140 --> 00:44:27,800
Op die manier kunt u andere onderdelen van de site die mensen gebruiken

711
00:44:27,800 --> 00:44:31,990
en je kunt werken aan het opbouwen van iets groots.

712
00:44:31,990 --> 00:44:34,100
>> Een ander belangrijk ding is dat je wilt regelmatig schoon-ups doen.

713
00:44:34,100 --> 00:44:40,490
Code krijgt rommelig. Voel je niet slecht als je code is gewoon helemaal onleesbaar en een gigantische puinhoop.

714
00:44:40,490 --> 00:44:42,770
Dat gebeurt in web ontwikkeling altijd.

715
00:44:42,770 --> 00:44:46,530
Je bent het toevoegen van nieuwe functies, het verwijderen van oude. Spul gaat om daar te zijn dat niet zou moeten zijn.

716
00:44:46,530 --> 00:44:49,330
Dat is prima, maar je wilt er zeker van om regelmatig te gaan met dat.

717
00:44:49,330 --> 00:44:53,430
Je wilt niet te laten bouwen tot het punt waar je gewoon niets vinden

718
00:44:53,430 --> 00:44:56,430
in je code, en je hebt geen idee wat iets doet.

719
00:44:56,430 --> 00:44:58,430
Dat is het geval met HTML.

720
00:44:58,430 --> 00:44:59,490
Soms zul je eindigen met voorwerpen die niets bevatten,

721
00:44:59,490 --> 00:45:01,320
en je wilt om zich te ontdoen van die.

722
00:45:01,320 --> 00:45:04,610
In CSS, kunt u verwijzen naar elementen die er niet zijn meer,

723
00:45:04,610 --> 00:45:06,340
dus je wilt om zich te ontdoen van die code.

724
00:45:06,340 --> 00:45:09,900
In JavaScript, zou je iets uit de HTML hebt verwijderd.

725
00:45:09,900 --> 00:45:13,150
Dus, wilt u ervoor zorgen dat je altijd opruimen, het maken van dingen vrij

726
00:45:13,150 --> 00:45:17,450
zo veel als je kan op een regelmatige basis.

727
00:45:17,450 --> 00:45:21,060
>> Een ander echt nuttig ding dat ik denk niet dat is zeer geschetst in CS50

728
00:45:21,060 --> 00:45:23,430
maar het is de moeite waard om in is versie controle.

729
00:45:23,430 --> 00:45:27,180
Het idee van versiebeheer is wanneer je eigenlijk bent het bijhouden van alle vooruitgang

730
00:45:27,180 --> 00:45:30,820
je hebt gemaakt naar uw site en als u op enig moment realiseer je je, oh, dit werkte

731
00:45:30,820 --> 00:45:35,220
een tijdje geleden, maar het werkt niet meer, kunt u teruggaan naar de vorige versies

732
00:45:35,220 --> 00:45:37,720
en zien wat er is veranderd sinds die tijd en dat soort dingen.

733
00:45:37,720 --> 00:45:41,670
De belangrijkste manier om dat te doen is met Git, en Git is dit hele soort systeem dat

734
00:45:41,670 --> 00:45:46,390
Ik denk dat Tommy MacWilliam gaf een seminar over het afgelopen jaar.

735
00:45:46,390 --> 00:45:51,520
Als je in de CS50 seminars voor 2011, kunt u zijn seminar op dat zien.

736
00:45:51,520 --> 00:45:57,070
Het idee van Git is eigenlijk dat op gezette tijden je het maken van deze toezeggingen

737
00:45:57,070 --> 00:46:01,430
die manieren om te zeggen de site is in een vrij stabiele versie nu bent zo

738
00:46:01,430 --> 00:46:05,910
Ik ben het verpakken en verzenden van het weg aan een server, en dan kun je naar die server

739
00:46:05,910 --> 00:46:07,910
en kijken naar alle vorige versies van uw code en zien hoe het vorderde

740
00:46:07,910 --> 00:46:12,210
en al dat soort goede dingen.

741
00:46:12,210 --> 00:46:14,210
Dus, dat is eigenlijk het.

742
00:46:14,210 --> 00:46:17,870
Voor zover web ontwikkeling, we zijn blij om te blijven en beantwoorden alle

743
00:46:17,870 --> 00:46:20,570
vragen wat onze presentatie.

744
00:46:20,570 --> 00:46:22,900
Dat is het. Bedankt. >> [Ben] Bedankt.

745
00:46:22,900 --> 00:46:28,480
[Applaus]

746
00:46:28,480 --> 00:46:30,950
>> [Billy] Personeel, heeft iemand nog vragen hebben over dingen die we hebben behandeld

747
00:46:30,950 --> 00:46:33,950
of dingen die we niet hebben behandeld dat ze hoopten we zouden dekken?

748
00:46:33,950 --> 00:46:35,950
We zouden blij zijn om die te beantwoorden. Iedereen?

749
00:46:35,950 --> 00:46:50,360
[Toeschouwer] Wat zijn de voors en tegens van het gebruik van Ruby of Python?

750
00:46:50,360 --> 00:46:58,660
[Ben] De vraag was, wat zijn de voor-en nadelen van het gebruik van Ruby of Python

751
00:46:58,660 --> 00:46:59,900
in plaats van zoals PHP.

752
00:46:59,900 --> 00:47:11,340
De pluspunten zijn dat Ruby en Python zijn veel beter talen dan PHP.

753
00:47:11,340 --> 00:47:14,920
Althans in mijn mening, en ik denk dat in veel van de adviezen van andere mensen ook.

754
00:47:14,920 --> 00:47:20,990
Ze waren meer voor het doen van complexe dingen ontworpen,

755
00:47:20,990 --> 00:47:25,380
en minder voor elkaar meppen webpagina's heel snel met

756
00:47:25,380 --> 00:47:28,400
een beetje van dynamische inhoud.

757
00:47:28,400 --> 00:47:35,180
De nadelen zijn dat er een klein beetje - er is meer van een leercurve

758
00:47:35,180 --> 00:47:37,220
om hen opzetten.

759
00:47:37,220 --> 00:47:41,010
Dat is, net als in PHP, kunt u gewoon een HTML-bestand en je minder-dan schrijven,

760
00:47:41,010 --> 00:47:43,060
vraagteken, en dan schrijf je een code, en vervolgens vraagteken je schrijft,

761
00:47:43,060 --> 00:47:45,700
groter-dan, en dan ben je klaar.

762
00:47:45,700 --> 00:47:50,300
In andere talen zoals Ruby of Python,

763
00:47:50,300 --> 00:47:56,810
je moet gaan door een beetje meer werk om de eerste site draaiend te krijgen.

764
00:47:56,810 --> 00:48:02,730
Er is ook - althans vroeger het geval te zijn - dat er meer documentatie

765
00:48:02,730 --> 00:48:05,480
beschikbaar voor PHP, alleen maar omdat er meer mensen die het gebruiken.

766
00:48:05,480 --> 00:48:09,370
Ik denk dat het niet zo veel van een probleem meer.

767
00:48:09,370 --> 00:48:12,520
Er is zeker een zeer goede documentatie voor dingen zoals Ruby on Rails

768
00:48:12,520 --> 00:48:16,080
of Django voor Python is het equivalent.

769
00:48:16,080 --> 00:48:25,910
PHP is degene die iedereen is al gebruikt voor jaren, en je weet hoe het werkt.

770
00:48:25,910 --> 00:48:28,460
Ruby en Python zijn een beetje minder volwassen.

771
00:48:28,460 --> 00:48:33,130
>> [Toeschouwer] Als je moet kiezen tussen een van hen om te leren of pick-up,

772
00:48:33,130 --> 00:48:36,130
wat zou je het liefst?

773
00:48:36,130 --> 00:48:38,870
Eerlijk gezegd, ik denk dat afhankelijk van de persoon.

774
00:48:38,870 --> 00:48:45,450
Het spijt me. De vraag was welke zou je kiezen voor iemand om te leren?

775
00:48:45,450 --> 00:48:50,230
Ik vind Python de mooiste persoonlijk.

776
00:48:50,230 --> 00:48:55,360
Er zijn een heleboel mensen die - ik heb mijn eerste web dev project in Python en Django.

777
00:48:55,360 --> 00:49:00,300
Er zijn een heleboel mensen die graag Ruby on Rails ook.

778
00:49:00,300 --> 00:49:02,650
Waarschijnlijk meer mensen die Ruby on Rails weten.

779
00:49:02,650 --> 00:49:05,270
Eerlijk gezegd, zou ik gewoon gaan met wat de mensen om je heen weten

780
00:49:05,270 --> 00:49:09,680
zodat je mensen om vragen te stellen.

781
00:49:19,640 --> 00:49:24,170
>> De vraag was - op gedeelde servers is het een beetje moeilijk om te werken aan Python?

782
00:49:24,170 --> 00:49:26,170
Dat hangt af van uw hosting.

783
00:49:26,170 --> 00:49:29,400
Er zijn een aantal web hosts die Python spul zal posten.

784
00:49:29,400 --> 00:49:31,400
Webfaction doet dat, toch?

785
00:49:31,400 --> 00:49:34,400
Webfaction is er een die Billy en ik heb gebruikt voor een aantal projecten.

786
00:49:34,400 --> 00:49:37,750
Ze zijn echt geweldig. Ze ondersteunen de meeste talen.

787
00:49:37,750 --> 00:49:40,020
Maar het is waar dat PHP is veel meer breed gedragen.

788
00:49:40,020 --> 00:49:45,210
Dus, als je vast zit op een webhost die alleen doet PHP, dat is een goede reden om PHP te gebruiken.

789
00:49:45,210 --> 00:49:56,010
>> [Toeschouwer] Ik ben net in het leren hoe je query sommige databases,

790
00:49:56,010 --> 00:50:00,680
en ik weet dat mijn SQL is all over the place, maar ik kreeg onlangs blootgesteld aan -

791
00:50:00,680 --> 00:50:04,470
en je erop gewezen. Je ziet JSON en uitbreidbaar databases.

792
00:50:04,470 --> 00:50:14,580
Mijn SQL is nog steeds all over the place. Hoe ziet u dat gebeuren?

793
00:50:14,580 --> 00:50:21,330
Komt er een groeiende tendens voor meer uitbreidbaar (onhoorbaar) zijn?

794
00:50:21,330 --> 00:50:30,100
De vraag was - ik denk dat er gaat een trend naar niet-SQL databases.

795
00:50:30,100 --> 00:50:33,850
Bijvoorbeeld, zoals MongoDB. Ik denk dat is zeker waar.

796
00:50:33,850 --> 00:50:38,730
Mijn advies was vooral hier MySQL-gerelateerde alleen omdat MySQL is

797
00:50:38,730 --> 00:50:40,950
industriestandaard.

798
00:50:40,950 --> 00:50:45,950
Persoonlijk heb ik veel liever databases die niet schemos zoals MongoDB hebben

799
00:50:45,950 --> 00:50:49,520
waar je niet het probleem van hebben, oh, ik moet nog een kolom toe te voegen.

800
00:50:49,520 --> 00:50:51,600
Wee mij, als wat moet ik doen?

801
00:50:51,600 --> 00:50:55,840
Het is heel moeilijk om dat te doen op MySQL, maar als je iets als Mongo hebben

802
00:50:55,840 --> 00:50:57,840
het is veel mooier.

803
00:50:57,840 --> 00:51:03,780
Het andere leuke van Mongo is dat uw administratie zijn eigenlijk JavaScript-objecten.

804
00:51:03,780 --> 00:51:10,110
Er is geen soort van conversie stap waar je nodig hebt om deze databank rijen nemen

805
00:51:10,110 --> 00:51:13,140
en zet ze in een JavaScript-object en vervolgens stuur ze over de draad.

806
00:51:13,140 --> 00:51:20,290
Ik denk dat soort dingen gaat zeer, zeer nuttig te zijn voor een snelle web-ontwikkeling in de toekomst.

807
00:51:20,290 --> 00:51:23,060
>> [Billy] Iets wat ik zou toevoegen dat is gewoon een algemeen punt is dat

808
00:51:23,060 --> 00:51:26,580
niet het gevoel dat u alle talen die we hebben besproken moeten hebben geleerd

809
00:51:26,580 --> 00:51:28,580
van ons seminar.

810
00:51:28,580 --> 00:51:30,560
Uiteraard is het punt is om u een idee van wat er daar te geven,

811
00:51:30,560 --> 00:51:33,450
en als je geïntrigeerd door een van de dingen die we hebben vermeld je kunt ze googlen

812
00:51:33,450 --> 00:51:35,830
en lezen over hen.

813
00:51:35,830 --> 00:51:38,750
En zoals ik al zei, zijn er een paar seminars die zich bezighouden met juist deze dingen.

814
00:51:38,750 --> 00:51:41,660
Er zijn nog meer seminars die ik niet heb genoemd die waarschijnlijk krijgen in

815
00:51:41,660 --> 00:51:43,660
dit spul ook.

816
00:51:43,660 --> 00:51:46,610
Het idee is dat als je wilt werken aan iets, hier zijn de tools tot uw beschikking.

817
00:51:46,610 --> 00:51:51,630
Voel je niet overweldigd als je niet echt weet wat deze tools precies doen,

818
00:51:51,630 --> 00:51:54,830
maar weten dat ze er zijn en dat je kan ruim gebruik maken van hen

819
00:51:54,830 --> 00:51:56,830
door Google.

820
00:51:56,830 --> 00:51:59,960
>> [Toeschouwer] Wat voor dingen heb je nodig om te doen om te zorgen dat uw website te maken

821
00:51:59,960 --> 00:52:02,530
ziet er goed uit op mobiele apparaten?

822
00:52:02,530 --> 00:52:05,590
[Billy] Mobiele apparaten zijn een beetje hard.

823
00:52:05,590 --> 00:52:07,590
Er zijn 2 manieren waarop u kunt benaderen.

824
00:52:07,590 --> 00:52:11,500
De eerste manier is dat je eigenlijk een mobiele website.

825
00:52:11,500 --> 00:52:14,660
Met andere woorden, je een soort van detectie uitvoeren begin

826
00:52:14,660 --> 00:52:18,830
wanneer de browser is die het verzoek om uw website, die ofwel zegt

827
00:52:18,830 --> 00:52:25,240
terug deze visie - die het uitzicht voor desktop of laptop browsers zal zijn -

828
00:52:25,240 --> 00:52:27,710
en deze andere weergave voor mobiele apparaten.

829
00:52:27,710 --> 00:52:33,090
Dat is een plaats waar de uitzichten zijn heel mooi in dat u kunt vrij veel swap de

830
00:52:33,090 --> 00:52:37,580
twee uit en hebben een interface die echt mooi werkt op mobiele apparaten

831
00:52:37,580 --> 00:52:40,770
en hebben een totaal andere die goed werkt op browser apparaten.

832
00:52:40,770 --> 00:52:43,770
Het probleem met dat is het duurt een lange tijd, omdat het betekent codering

833
00:52:43,770 --> 00:52:47,060
een totaal andere interface.

834
00:52:47,060 --> 00:52:49,720
De andere manier dat je het kunt doen is -

835
00:52:49,720 --> 00:52:55,250
veel moderne telefoons zullen websites weer te geven en probeer ze te maken als een browser zou doen,

836
00:52:55,250 --> 00:52:57,680
en ze doen hun best.

837
00:52:57,680 --> 00:53:04,340
U kunt soort proberen licht te blijven op de hoogte van jQuery JavaScript u gebruikt

838
00:53:04,340 --> 00:53:07,360
die de neiging heeft te zijn waar dingen mis kan gaan een beetje.

839
00:53:07,360 --> 00:53:13,430
Dit is een soort van de weg die je moet gebruiken als je niet zo heel veel tijd.

840
00:53:13,430 --> 00:53:18,540
Als je wel de tijd om te werken aan een mobiele interface, dat is natuurlijk de beste optie.

841
00:53:18,540 --> 00:53:23,320
>> Ik denk dat in het algemeen voor CS50 projecten, je gaat te willen om een ​​of het ander te kiezen.

842
00:53:23,320 --> 00:53:27,990
Met andere woorden, je wilt een mobiele app te maken of wilt u een desktop website te maken.

843
00:53:27,990 --> 00:53:32,200
En dat soort bepaalt waar je met dat.

844
00:53:32,200 --> 00:53:35,360
Maar als je wilt later uit te breiden uit, waarschijnlijk uw beste weddenschap is

845
00:53:35,360 --> 00:53:37,360
naar een andere interface voor de andere te maken.

846
00:53:51,650 --> 00:53:56,340
Ik heb een beetje ervaring in het ontwikkelen WordPress-gebaseerde sites.

847
00:53:56,340 --> 00:53:58,670
Ik organiseerde een persoonlijke website op WordPress voor een tijdje.

848
00:53:58,670 --> 00:54:02,310
Dat soort kaders kan leuk zijn net zo zeer fundamentele dingen.

849
00:54:02,310 --> 00:54:07,050
Vaak zul je alleen nog maar in een veel aanpasbaarheid kwesties wel.

850
00:54:07,050 --> 00:54:10,940
U wilt iets kijken op een bepaalde manier of zijn op een bepaalde manier

851
00:54:10,940 --> 00:54:14,510
en je kan het gewoon niet, want het is hard-wired in het systeem dat

852
00:54:14,510 --> 00:54:17,480
dit is hoe je dingen die een beetje een probleem kan zijn doen.

853
00:54:17,480 --> 00:54:22,020
Sindsdien heb ik soort is meer geneigd om te werken met sites uit de grond omhoog.

854
00:54:22,020 --> 00:54:26,840
Voor zaken als blog databases en dat soort dingen het is echt niet zo moeilijk om een ​​kader op te bouwen.

855
00:54:26,840 --> 00:54:29,970
Als je echt uitgerekt voor tijd, kunt u natuurlijk gebruik maken van iets als WordPress

856
00:54:29,970 --> 00:54:33,120
of dat soort dingen voor een blog.

857
00:54:33,120 --> 00:54:38,790
Het soort dingen die blogs op te slaan en te doen zijn niet echt hard genoeg dat

858
00:54:38,790 --> 00:54:41,500
als je loopt in een van dat soort dingen, ben je waarschijnlijk het beste gewoon om

859
00:54:41,500 --> 00:54:43,500
maken van een in-house versie.

860
00:54:43,500 --> 00:54:48,350
>> Ik denk dat is het zo'n beetje, dus nogmaals bedankt voor het komen.

861
00:54:48,350 --> 00:54:51,960
We hebben echt genoten van het praten met jullie en hopen dat u sommige dingen geleerd.

862
00:54:51,960 --> 00:54:55,350
[Ben] We zijn blij om te praten - we moeten gaan, maar we zijn blij om meer buiten te praten

863
00:54:55,350 --> 00:55:01,650
Als u een andere vraag. Nogmaals bedankt. [Applaus]

864
00:55:03,750 --> 00:55:06,000
[CS50.TV]