1
00:00:00,000 --> 00:00:02,910
>> [Musika jotzen]

2
00:00:02,910 --> 00:00:04,850

3
00:00:04,850 --> 00:00:07,275
>> NEEL Mehta: Hemen doa.

4
00:00:07,275 --> 00:00:11,070
>> Beno, denek, den web ongietorria
dituzten etorkizuneko aplikazioak erreakzionatu.

5
00:00:11,070 --> 00:00:11,870
Hau CS50 da.

6
00:00:11,870 --> 00:00:12,930
Nire izena Neel da.

7
00:00:12,930 --> 00:00:17,689
TA naiz CS50 eta sophomore bat
Harvard College eta oso, oso at

8
00:00:17,689 --> 00:00:18,730
sutsua web garatzaileak.

9
00:00:18,730 --> 00:00:20,730
Beraz, oso zirraragarria naiz
gaur zaituzte,

10
00:00:20,730 --> 00:00:24,550
Oraindik hemen edo etxean duzun ala ez
behaketa, buruz erreakzionatzen, hau da, berriro

11
00:00:24,550 --> 00:00:27,270
esan nuen, web aplikazioak etorkizuna gisa.

12
00:00:27,270 --> 00:00:29,055
>> Beraz erreakzionatu web esparru bat da.

13
00:00:29,055 --> 00:00:30,930
Eta ez dut izan den bezala kontatzea
pertsona batzuk hemen,

14
00:00:30,930 --> 00:00:33,400
esparru bat besterik ez da
tresnak erabili ahal izango dituzu ezarri

15
00:00:33,400 --> 00:00:35,770
egituratzeko eta zure web app eraikitzeko.

16
00:00:35,770 --> 00:00:39,010
Eta web aplikazioak dira, berriro, webguneak
direla Facebook bezalako interaktiboa,

17
00:00:39,010 --> 00:00:42,330
Twitter.com, Instagram.com, edozein dela ere.

18
00:00:42,330 --> 00:00:45,590
>> Beraz, Facebook web esparrua da
Hori Facebook garatu zen

19
00:00:45,590 --> 00:00:48,060
Pare bat urte back-- erreakzionatu da.

20
00:00:48,060 --> 00:00:50,830
Honez geroztik erabili izan da
Facebook beraien aplikazioak mugikorrean

21
00:00:50,830 --> 00:00:52,460
eta web aplikazio, Instagram.

22
00:00:52,460 --> 00:00:56,350
Khan Academy beste bat
destacados goiz erreakzionatu adopter.

23
00:00:56,350 --> 00:00:58,630
>> Orain, benetan lortzean
oso ezaguna.

24
00:00:58,630 --> 00:01:03,420
Inoiz Angeluen edo gauzak bezala erabiltzen baduzu
Backbone, hau familia berekoa da,

25
00:01:03,420 --> 00:01:05,830
baina urrun geroztik ditu
Bere ospea ditik.

26
00:01:05,830 --> 00:01:06,890
Beroa gauza berria da.

27
00:01:06,890 --> 00:01:09,590
Benetan, benetan izugarria da.

28
00:01:09,590 --> 00:01:13,470
>> Eta horrela erreakzionatu da ona, ez besterik gisa
Web eraikin interfazeak egiteko esparru.

29
00:01:13,470 --> 00:01:16,020
It web interfazeak eraikitzeko ona da.

30
00:01:16,020 --> 00:01:18,350
Ez da, gainera, gauza bat
izeneko erreakzionatu Native bertan

31
00:01:18,350 --> 00:01:22,200
lets interfazeak eraikitzeko duzu
Android eta iOS

32
00:01:22,200 --> 00:01:26,390
eta etorkizunean, agian, beste plataforma
besterik JavaScript kodea bera erabiliz.

33
00:01:26,390 --> 00:01:31,130
Zehatza bera erabili ahal izango duzu
JavaScript kodea webguneak errenderizatzeko,

34
00:01:31,130 --> 00:01:33,040
Android aplikazioak eta iOS aplikazioak erakustea.

35
00:01:33,040 --> 00:01:35,000
>> Denbora oso, oso zirraragarria da.

36
00:01:35,000 --> 00:01:37,070
Benetan, oso cool aukera bat da.

37
00:01:37,070 --> 00:01:42,020
Benetan web unibertsal bat
interface garapen tresna,

38
00:01:42,020 --> 00:01:44,420
beraz, oso, oso
Garrantzitsuena da jakitea.

39
00:01:44,420 --> 00:01:46,949
Eta, I pertsona kontatzea zen bezala
aurretik, hau da, uste dut,

40
00:01:46,949 --> 00:01:48,990
nola ez dugu aldatuko
web aplikazioak eraikitzeko betiko.

41
00:01:48,990 --> 00:01:55,820
Beraz, agian, pixka hiperbole bat, baina ez dut
Nik uste gauza nahiko ona da jakitea da.

42
00:01:55,820 --> 00:01:57,580
>> Ados, beraz, zer da erreakzionatzen?

43
00:01:57,580 --> 00:02:01,020
Erreakzionatu esparru bat da izango duzu
interfazeak eraikitzeko erabili.

44
00:02:01,020 --> 00:02:03,240
Interfaze bat da, berriz ere,
Web orri bat da, ezta?

45
00:02:03,240 --> 00:02:06,340
Hortaz, hona hemen Instagram.com, erabilerak erreakzionatu.

46
00:02:06,340 --> 00:02:08,740
>> Erreakzionatu gainean eraikitako
osagaiak ideia.

47
00:02:08,740 --> 00:02:11,900
Osagaia da HTML da
elementu esteroideak,

48
00:02:11,900 --> 00:02:14,470
beraz HTML elementu bat botoi bat bezalakoa da.

49
00:02:14,470 --> 00:02:15,250
Paragrafo bat da.

50
00:02:15,250 --> 00:02:17,500
Goiburu bat da, ezta?

51
00:02:17,500 --> 00:02:22,740
Eta Instagram horiek erabili ahal izango da, baina
halaber erreakzionatu osagaiak erabiliko du.

52
00:02:22,740 --> 00:02:25,740
>> Erreakzionatu osagaiak dira
souped-up HTML elementu

53
00:02:25,740 --> 00:02:28,100
Hori norberaren jokabidea dute
bertan jasotako.

54
00:02:28,100 --> 00:02:31,800
Beraz, adibide gisa, izan dugu
denbora elementu bat, denbora osagai bat,

55
00:02:31,800 --> 00:02:34,095
bertan egingo bezalako eduki
, denbora zigilua, badakizu

56
00:02:34,095 --> 00:02:37,170
Profil osagairik,
Profil irudia edukiko du

57
00:02:37,170 --> 00:02:38,820
eta pertsona baten izena.

58
00:02:38,820 --> 00:02:42,930
A bezalako kontraerasoan, izan daiteke bertan
gustatu zaie gehienen antzera zenbatu daitezke,

59
00:02:42,930 --> 00:02:45,610
eta gainean klik egiten baduzu, hura egingo
gustatu zaie kopurua handitzeko.

60
00:02:45,610 --> 00:02:48,200
Osagai bat besterik ez da
HTML kode sorta hori

61
00:02:48,200 --> 00:02:50,520
funtzionalitate batzuk
horren barruan bilduta.

62
00:02:50,520 --> 00:02:53,770
Beraz, HTML elementu bat bezala
esteroideak, lehen esan dudan bezala.

63
00:02:53,770 --> 00:02:56,270
Osagai hauek hartu ahal izango duzu,
eta haiekin batera jarri ahal izango duzu

64
00:02:56,270 --> 00:02:59,060
osagai berriak egiteko, in
Kasu honetan, post-osagai bat,

65
00:02:59,060 --> 00:03:00,505
bertan guzti hau dauka.

66
00:03:00,505 --> 00:03:04,050
Time edukiko luke, profila,
LikeCounter, agian iruzkina

67
00:03:04,050 --> 00:03:06,100
eta, agian, irudi bera.

68
00:03:06,100 --> 00:03:10,810
Eta beraz, web aplikazioak dira besterik hartuz eraiki
osagaiak eta horiek jarriz batera.

69
00:03:10,810 --> 00:03:15,620
Instagram iturria baino ez da
mezu mordo bat bata bestearen atzetik,

70
00:03:15,620 --> 00:03:19,032
Mezu bakoitza Time bezalako dauka,
Profila, LikeCounter, eta abar.

71
00:03:19,032 --> 00:03:20,490
Mota etxe bat eraikitzea bezala da.

72
00:03:20,490 --> 00:03:22,660
Zuk ez duzu eraikitzeko
goitik behera etxe.

73
00:03:22,660 --> 00:03:24,960
Hartu duzu osagaiak duzu
Komunera bezala hartu.

74
00:03:24,960 --> 00:03:28,320
Bedroom-- horiek makila hartu duzu
elkarrekin, eta osagai berri bat behar duzu.

75
00:03:28,320 --> 00:03:29,760
Etxearen zati berri bat behar duzu.

76
00:03:29,760 --> 00:03:32,860
>> Beraz erreakzionatu guztien inguruan eraikitako
osagaien ideia hori

77
00:03:32,860 --> 00:03:36,600
elkarreragileak dira, hori deklaratiboa dira.

78
00:03:36,600 --> 00:03:39,650
Zer bat esatea besterik ez duzu Like
Profil da, eta errendatzen du.

79
00:03:39,650 --> 00:03:40,600
Composable dira.

80
00:03:40,600 --> 00:03:43,880
Denbora bat eta profil bat hartu ahal izango duzu, jarri
Haiekin batera, egin zerbait hobea.

81
00:03:43,880 --> 00:03:47,770
Eta berrerabilgarriak ari dira, beraz baduzu
jatorrizko kodean izan post bat egiteko,

82
00:03:47,770 --> 00:03:49,440
edonon txertatzeko asmoz.

83
00:03:49,440 --> 00:03:53,160
>> Instagram bat kapsula dezakezu
Gauza zeure web orrian.

84
00:03:53,160 --> 00:03:56,830
Facebook-en ditzakezu txertatzeko, adibidez,
betiere, berak darabilen bezala erreakzionatu baita.

85
00:03:56,830 --> 00:04:00,360
Beraz osagaiak dira benetan, benetan, benetan
Eraikin web bloke indartsua

86
00:04:00,360 --> 00:04:04,180
edonon erabili ahal izango dira, eta jarri
elkarrekin eraikin bloke berria egiteko.

87
00:04:04,180 --> 00:04:07,159
Hori da, oso, oso
Maila handiko ikuspegi orokorra.

88
00:04:07,159 --> 00:04:09,200
Beraz, berriro ere, baldin baduzu
edozein unetan edozein zalantza argitzeko

89
00:04:09,200 --> 00:04:14,470
erreaktore, filosofia buruz
kodifikazioa, me gelditzeko, eta utzi naute.

90
00:04:14,470 --> 00:04:18,420
>> Ados, beraz, erreakzionatu delako cool
ezberdinak begiratzeko modu bat du

91
00:04:18,420 --> 00:04:19,870
Web aplikazioak nola eraiki duzu.

92
00:04:19,870 --> 00:04:23,620
Seguruenik duzu MVC, entzun
kontrolatzeko duzu eredu CS50 edo dena delakoa

93
00:04:23,620 --> 00:04:25,940
beste kraterrak klaseak erabili behar dituzu.

94
00:04:25,940 --> 00:04:29,000
Eta esparru gehienetan daude
MVC ideiaren inguruan eraiki.

95
00:04:29,000 --> 00:04:30,410
Erreakzionatu ez da.

96
00:04:30,410 --> 00:04:32,980
Erreakzionatu da ideiaren inguruan eraikitako
norabide bakarreko datuen fluxua

97
00:04:32,980 --> 00:04:36,510
ikusi taula honetan edo hemen grafiko gisa.

98
00:04:36,510 --> 00:04:38,260
>> Funtsean, Datu-iturri bat behar duzu.

99
00:04:38,260 --> 00:04:42,380
Eta datu-iturburua erabakiko du
nola atera osagai jakin batzuk finkatzeko.

100
00:04:42,380 --> 00:04:45,452
Eta osagaiak izango
gero, aldatu egiten dutenean,

101
00:04:45,452 --> 00:04:47,160
esango dute
Datu-iturri aldatu.

102
00:04:47,160 --> 00:04:49,350
>> Instagram erabili ahal izateko
Adibidez, baliteke duzu

103
00:04:49,350 --> 00:04:52,050
bezalako post objektuen zerrenda
base bat edo zerbait.

104
00:04:52,050 --> 00:04:53,310
Datu hori.

105
00:04:53,310 --> 00:04:57,600
Eta gero, gure post osagaiak
Datu hori hartuko du,

106
00:04:57,600 --> 00:05:01,830
eta erabili datu hori errendatu
pantailaren alde batetik gauza bat.

107
00:05:01,830 --> 00:05:04,300
Hori zer Gezia
Datu tik osagaia da,

108
00:05:04,300 --> 00:05:07,930
eta, ondoren, datu hori bera erabiltzen da
osagai mordo bat emateko.

109
00:05:07,930 --> 00:05:10,290
>> Facebook Messenger, for
Adibidez, hau da, erreakzionatu,

110
00:05:10,290 --> 00:05:13,410
zerrenda bat izan dezakezu
mezuak zure datuak iturri gisa.

111
00:05:13,410 --> 00:05:15,927
Eta hori ez lekarkiokeena
bakarrik mezuen zerrendan

112
00:05:15,927 --> 00:05:17,510
baina, aldi berean lagun zerrendatik duzu.

113
00:05:17,510 --> 00:05:19,200
Irakurri gabeko zenbatu behar duzu.

114
00:05:19,200 --> 00:05:23,330
Agian, halaber, Facebook gauza errendatu
Hori Facebook.com behealdeko da.

115
00:05:23,330 --> 00:05:25,610
Datu bera da bat
egiaren iturri bakar

116
00:05:25,610 --> 00:05:28,290
eta hori asko eragiten
osagaiak dira errendatzeko.

117
00:05:28,290 --> 00:05:30,290
Eta, betiere, horietako bat
osagai da aldatu,

118
00:05:30,290 --> 00:05:32,320
atzera egingo du eta
Datu-iturri aldatzen.

119
00:05:32,320 --> 00:05:33,460
>> Mezu bat bidaltzen duzunean, ezta?

120
00:05:33,460 --> 00:05:34,780
Datu-iturburu aldatzen.

121
00:05:34,780 --> 00:05:39,490
Zure mezuak irakurri,
beraz, 0 unread ezarri duzu.

122
00:05:39,490 --> 00:05:41,136
Datu-iturburu aldatzen.

123
00:05:41,136 --> 00:05:44,010
Eta konturatu bateko horien guztien
gezi atzera egingo datuak berera

124
00:05:44,010 --> 00:05:47,662
iturria, beraz, badakizu,
Datu multzo jakin bat,

125
00:05:47,662 --> 00:05:49,870
zehazki zer ezagutzen duzu
Orri da itxura.

126
00:05:49,870 --> 00:05:50,700
It determinista da.

127
00:05:50,700 --> 00:05:53,451
Badakizu, emandako datu batzuk, zer
Orri hau itxura.

128
00:05:53,451 --> 00:05:56,158
Jakin dezakezu nola da joan
jokatu eta gauzak nola joan

129
00:05:56,158 --> 00:05:57,650
denean elkarrekin jartzen ari dira lanera.

130
00:05:57,650 --> 00:06:00,410
>> Eta milioi bat osagai bat banu
Hemen, portaera litzateke, ezta?

131
00:06:00,410 --> 00:06:02,290
Ez litzateke duzu edozein
interkonexioak bitxi.

132
00:06:02,290 --> 00:06:04,120
Datu bat errendatzen milioi bat osagaiak.

133
00:06:04,120 --> 00:06:06,879
Milioi bat osagai Could
atzera egin eta datuak editatzeko.

134
00:06:06,879 --> 00:06:07,920
Eta, beraz, hau da, oso polita.

135
00:06:07,920 --> 00:06:10,870
Composable eraikitzen ari gara,
erraz eskalatu web aplikazioak.

136
00:06:10,870 --> 00:06:13,150
>> Datu-iturri bat behar duzu,
egiaren iturburua.

137
00:06:13,150 --> 00:06:15,790
Hori da zure osagaiak kontatzen
nola arautuko den orrialdean,

138
00:06:15,790 --> 00:06:18,190
eta osagaiak izango
elkarrekintza kudeatzeko.

139
00:06:18,190 --> 00:06:20,150
Eta aldatu nahi badute
Gauzak, besterik gabe atzera

140
00:06:20,150 --> 00:06:21,750
eta esango datuak iturburua aldatzeko.

141
00:06:21,750 --> 00:06:22,850
Zentzurik?

142
00:06:22,850 --> 00:06:26,010
Beraz erreakzionatu guztiak ulertzeko buruz da
nola osagai bat eraikitzeko

143
00:06:26,010 --> 00:06:29,540
eta nola zure osagai egiteko
kanpoko munduarekin elkarreragin.

144
00:06:29,540 --> 00:06:31,850
>> Osagai elkarreragin egitea
kanpoko munduarekin

145
00:06:31,850 --> 00:06:34,490
teknologiaren beste erabiltzen du
Flux izenekoa,

146
00:06:34,490 --> 00:06:36,872
esparru bat dela da
Erreakzio gainean gehitu.

147
00:06:36,872 --> 00:06:38,330
Ez dugu horri buruz hitz egingo da.

148
00:06:38,330 --> 00:06:42,990
Ari gara emandako buruz gehiago hitz egin dugu,
datuak, nola dezakezu osagai bat errendatu duzu?

149
00:06:42,990 --> 00:06:47,010
>> Eta horrela erreakzionatu da benetan cool duzulako
Erabili ahal duen back end nahi zurekin.

150
00:06:47,010 --> 00:06:50,480
A Python back end bezala badaukazu,
Zure Python datu batzuk txu bada,

151
00:06:50,480 --> 00:06:51,610
Erreakzionatu errendatu daiteke.

152
00:06:51,610 --> 00:06:54,700
Ez zara JS irteerak bada
Datuen erreakzionatzeko errendatzen.

153
00:06:54,700 --> 00:06:56,890
Ruby errailen sortu
datuak, erreakzionatu bihurtzen.

154
00:06:56,890 --> 00:07:01,860
>> Beraz erreakzionatu da, funtsean, web bat
osagaiekin frontend bat ikuspegian

155
00:07:01,860 --> 00:07:03,910
daturik iturritik ezgaitasunaren.

156
00:07:03,910 --> 00:07:07,145
Eta beraz, datuen iturritik joan
erreakzionatu osagaiak nahiko erraza da.

157
00:07:07,145 --> 00:07:08,770
Beste era joan apur bat zailagoa da.

158
00:07:08,770 --> 00:07:10,462
Hori erabiltzen Flux lehenago aipatu dudan bezala.

159
00:07:10,462 --> 00:07:11,420
Ez diogu hori hartzea.

160
00:07:11,420 --> 00:07:13,740
Gehiago zentratu dugu
Datu-to-osagaia alboko.

161
00:07:13,740 --> 00:07:15,880
Bide hau egin dezakezu
cool, fun web aplikazioak.

162
00:07:15,880 --> 00:07:19,870
Ezin izango da kanpoko mundua eraginik
oraingoz, baina hori beste istorio bat da.

163
00:07:19,870 --> 00:07:22,210
>> Ados, beraz, bada hemen bazina
Nire azken mintegia

164
00:07:22,210 --> 00:07:26,610
Ezagutzen dituzu kodea guztiek
Gaur egungo eztabaida da URL hau izango doa

165
00:07:26,610 --> 00:07:29,320
Hemen, barkatu, URL hau hemen.

166
00:07:29,320 --> 00:07:32,730
Eta, batez ere, ari gara joango
Lau urrats, agian bost bitartez,

167
00:07:32,730 --> 00:07:33,510
Seguru asko ez bost.

168
00:07:33,510 --> 00:07:37,300
Egingo lau urratsetan aurrera egin
lagin bat eraikitzeko erreakzionatu aplikazioa.

169
00:07:37,300 --> 00:07:39,550
Eta beraz, jatorrizko kodean guztiak
modu pauso bakoitzean

170
00:07:39,550 --> 00:07:42,216
hau da, hementxe izango da, hala badagokio,
you zehar jarraitzen du etxean ari,

171
00:07:42,216 --> 00:07:43,991
free kode hau peruse sentitzen.

172
00:07:43,991 --> 00:07:46,740
Honako batera bazabiltza hemen,
goazen erakutsiz egingo pantailan,

173
00:07:46,740 --> 00:07:47,739
beraz, ez kezkatu.

174
00:07:47,739 --> 00:07:50,930
Baina etxean zaudela bada, sentitzen
Free web hau bisitatu.

175
00:07:50,930 --> 00:07:56,400
Eta, bai, iristeko gai izan behar duzu
kode guztiek inoiz litzaidake hemen behar.

176
00:07:56,400 --> 00:08:01,380
Beraz Cheat xafla ona da baita
Zure etorkizuna abenturak erreakzionatu.

177
00:08:01,380 --> 00:08:04,490
Denek nor dagoen hemen Cool, hala bada,
eta zu etxean, nahiz eta,

178
00:08:04,490 --> 00:08:11,580
tira webgune honetan, is.gd/cs50react,
capital ez, azpimarra ez, ezer ez.

179
00:08:11,580 --> 00:08:15,849
>> Itxura orri bat ikusiko duzu
Hau atsegin pixka bat.

180
00:08:15,849 --> 00:08:17,140
Hau CodePen izeneko gauza bat da.

181
00:08:17,140 --> 00:08:20,030
CodePen hartze bat da
kodeketa ingurumena

182
00:08:20,030 --> 00:08:23,364
zeinarekin dut hemen kodea idatzi ahal izango dira, eta
bertan egingo automatikoki bidaliko.

183
00:08:23,364 --> 00:08:24,780
Eta era honetara, kodea idatzi ahal izango dut.

184
00:08:24,780 --> 00:08:26,920
Hemen I kodea exekutatu.

185
00:08:26,920 --> 00:08:33,470
>> Esate baterako, eta reloads-- ikusten badu,
Exekutatzen ari naiz JavaScript kodea orrialdean

186
00:08:33,470 --> 00:08:36,390
hementxe, eta bertan egingo
automatikoki errendatu web orri batean

187
00:08:36,390 --> 00:08:37,980
JavaScript kodea honekin.

188
00:08:37,980 --> 00:08:40,039
Eta, beraz, hau modu bat da
Gurekin probatzeko kodea

189
00:08:40,039 --> 00:08:43,089
Benetan azkarra da erabiltzeko beharrik gabe
Gure NAN edo gure tokiko makina erabili

190
00:08:43,089 --> 00:08:44,290
edo dena delakoa.

191
00:08:44,290 --> 00:08:47,670
To Mockup zuretzat modu oso polita egin da
eta kode mota ezberdinak probatzeko.

192
00:08:47,670 --> 00:08:50,560
>> Beraz noa hartu beharreko
Adibidez kodea, hemen jarriz.

193
00:08:50,560 --> 00:08:52,374
Bidez beharreko lanean ari gara.

194
00:08:52,374 --> 00:08:54,540
Eta etxean zaudela bada, zuk
Honen tira ahal baita.

195
00:08:54,540 --> 00:08:57,530
Eta nik dagoeneko instalatu
Erreakzionatu hemen, beraz, besterik gabe, ahal duzun

196
00:08:57,530 --> 00:09:00,770
idatzi zure kodea hemen, eta
saiatu zeure jolastoki gisa.

197
00:09:00,770 --> 00:09:04,940
>> Bai, denek nahi izanez gero
ireki, link honetan hemen.

198
00:09:04,940 --> 00:09:08,080
Mesedez eman dit koadro bat
behin irekita dituzunean eman.

199
00:09:08,080 --> 00:09:10,960

200
00:09:10,960 --> 00:09:13,770
Cool, cool cool.

201
00:09:13,770 --> 00:09:16,914
Ez dago ezer hemen oraingoz, baina
aldatu egingo dugu oso laster.

202
00:09:16,914 --> 00:09:21,250
>> Ados, beraz, erreakzionatu Javascript da
liburutegia, eta, esate baterako,

203
00:09:21,250 --> 00:09:24,480
Javascript ezagutzea eskatzen du,
bertan web programazio hizkuntza da.

204
00:09:24,480 --> 00:09:27,660
Eta hori beste gauza batzuk egiteko erabiltzen ari
orain ere, baina batik bat web garatzea

205
00:09:27,660 --> 00:09:32,040
hizkuntza, zara Ohituta bada orain
adierazten du, irakurtzeko JSforCats.com izeneko gune bat.

206
00:09:32,040 --> 00:09:32,700
Zoragarria da.

207
00:09:32,700 --> 00:09:34,240
Javascript ikas dezakezu
Ordu erdi batean.

208
00:09:34,240 --> 00:09:34,990
Sinestezina da.

209
00:09:34,990 --> 00:09:36,420
>> Beraz, ematen irakurtzeko.

210
00:09:36,420 --> 00:09:39,960
Halaber HTML asko dago irudirik delako
Web noski orrietan diseinatzen ari gara.

211
00:09:39,960 --> 00:09:43,890
Beraz, Ohituta bada
HTML, begiratu HTMLdog.com.

212
00:09:43,890 --> 00:09:46,520
Erreakzionatu dut ikasteko uste bat
milioi aldiz errazagoa Dagoeneko baduzu

213
00:09:46,520 --> 00:09:47,892
eraikin bloke jakin.

214
00:09:47,892 --> 00:09:50,600
Osagaiak badaukazu, da
Osagai handiago bat egiteko.

215
00:09:50,600 --> 00:09:51,860
Hori da hizkuntza erreakzionatu duzu.

216
00:09:51,860 --> 00:09:54,270
>> Anima zaitez eta eman
Gauza horiek irakurtzeko.

217
00:09:54,270 --> 00:09:55,070
Pausatu bideo honetan.

218
00:09:55,070 --> 00:09:57,440
Eman irakurri bazaude
Etxean ez bazaude

219
00:09:57,440 --> 00:10:00,794
HTML edo Javascript ezagutzen

220
00:10:00,794 --> 00:10:02,960
Ados, beraz, zer ari gara joan
ez da ari gara egiten joan

221
00:10:02,960 --> 00:10:06,470
Oso oinarrizko flashcard aplikazio bat erreakzionatu erabiliz.

222
00:10:06,470 --> 00:10:08,210
Flashcard bat izan behar gara.

223
00:10:08,210 --> 00:10:09,880
Txartela irauli dezakezu atzera eta aurrera.

224
00:10:09,880 --> 00:10:12,399
Eta, gainera, dugu zerrendarik
Karta guztiak dugula,

225
00:10:12,399 --> 00:10:14,190
eta guk sentitzen bada
asmo handiko, agian izan dugu

226
00:10:14,190 --> 00:10:17,060
den artean aldatzeko gai
bere gainean klik eginez autoak.

227
00:10:17,060 --> 00:10:20,360
>> Baina hau da, zure biluzi
hezurrak, oso erraza da erreakzionatu aplikazioa.

228
00:10:20,360 --> 00:10:22,560
Eta, beraz, hau da benetan
Ez trivial ezartzea,

229
00:10:22,560 --> 00:10:26,030
baina ari gara hori erakusteko, ez baduzu joan
hau da, oso, oso erraza da hori luzatzea

230
00:10:26,030 --> 00:10:27,680
jendeari lagundu baduzu berarekin.

231
00:10:27,680 --> 00:10:33,750
Beraz, lau urrats joan igaro
hutsetik hasita hau eraikitzeko.

232
00:10:33,750 --> 00:10:36,740
>> Ados, beraz, lau urratsak, dizkizugu
hasteko off lehen urratsa izan da.

233
00:10:36,740 --> 00:10:39,790
Lehen urratsa izango da
Zure lehen osagaia eraikitzen.

234
00:10:39,790 --> 00:10:44,830
Lehen esan dudan bezala, osagai bat erreakzionatu
besterik HTML esteroideak elementu bat da.

235
00:10:44,830 --> 00:10:49,660
HTML zehazten du
eta portaera batzuk, eta hura

236
00:10:49,660 --> 00:10:52,600
zenbat jende zehaztu dira
da nola elkarreragin dezake

237
00:10:52,600 --> 00:10:54,270
Barne-egoera izango litzateke.

238
00:10:54,270 --> 00:10:57,630
Like botoi bat zenbat atsegin jakin
aldiz izan da bertan klik adibidez,

239
00:10:57,630 --> 00:11:01,010
eta nola bera finkatzeko out jakin beharko da.

240
00:11:01,010 --> 00:11:04,430
>> Beraz, goazen aurrera eta eraikitzeko gure
Lehen osagaia Javascript-a erabiliz.

241
00:11:04,430 --> 00:11:09,711
Beraz, sintaxia itxura bitxi bada,
hori da, mota horretako dagoelako.

242
00:11:09,711 --> 00:11:11,710
Beraz, berriro ere, goazen
izeneko aldagai bat egiteko

243
00:11:11,710 --> 00:11:14,580
Aplikazio hitzarekin utzi erabiliz,
aldagai bat egiten du,

244
00:11:14,580 --> 00:11:18,210
utzi aplikazioa React.createClass berdinak.

245
00:11:18,210 --> 00:11:22,609
>> Erreakzionatu liburutegia bat da eta duela
klase funtzioa sortzea.

246
00:11:22,609 --> 00:11:24,400
Eta funtzio hori
kodea pixka bat duzula

247
00:11:24,400 --> 00:11:29,090
berri bat sortzeko erabili ahal
Erreakzio osagai mota.

248
00:11:29,090 --> 00:11:32,780
Eta beraz React.createClass
osagai bat egiten du,

249
00:11:32,780 --> 00:11:35,270
eta osagai hori izango
izan gauza egiteko gai.

250
00:11:35,270 --> 00:11:40,460
Gauza nagusia egin ahal izango da errendatu
zerbait, funtzio gisa errendatu.

251
00:11:40,460 --> 00:11:44,500
>> Berriz ere, indize hori ez da begi-bistakoa bada
duzu, JS bazoaz katuak gomendatzen dut

252
00:11:44,500 --> 00:11:45,682
eta begiratu bat.

253
00:11:45,682 --> 00:11:47,710
Handituta dagoela nahiko ondo?

254
00:11:47,710 --> 00:11:48,490
Cool.

255
00:11:48,490 --> 00:11:50,670
>> Beraz, osagai beharrak guztietan
errendatu funtzio bat izan.

256
00:11:50,670 --> 00:11:53,010
Errendatu funtzioa dio,
zer ez inprima pantailaren alde?

257
00:11:53,010 --> 00:11:54,760
Baina osagaia da
Ezertarako ez bada

258
00:11:54,760 --> 00:11:58,060
badakizu zer den pantailan inprimatu, beraz,
errendatu funtzio bat eduki behar duzu.

259
00:11:58,060 --> 00:12:01,904
>> Beraz in the errendatu gauza, zuk
HTML batzuk itzuli behar.

260
00:12:01,904 --> 00:12:03,820
Eta zer da cool da
izeneko gauza bat da

261
00:12:03,820 --> 00:12:08,660
JSX, bertan luzapen bat da
Duten moduan erabiltzen da JavaScript erreakzionatu.

262
00:12:08,660 --> 00:12:11,845
Dezagun barruan HTML idatzi duzun
Zure JavaScript, zein

263
00:12:11,845 --> 00:12:13,970
bitxi denean moduko soinuak
Horri buruz lehen uste duzu,

264
00:12:13,970 --> 00:12:15,553
baina zentzu asko egiten du ondoren.

265
00:12:15,553 --> 00:12:17,430
Beraz, hori egin ahal izango dugu.

266
00:12:17,430 --> 00:12:21,360
Oraindik HTML ezagutzen baduzu, badakit
Helburu orokor batekin div dugu

267
00:12:21,360 --> 00:12:22,790
stuff for edukiontzi.

268
00:12:22,790 --> 00:12:26,380
Div bat itzultzeko aukera izango dugu, eta barruan
div honetan, gauzak jarri ahal izango dugu.

269
00:12:26,380 --> 00:12:32,390
>> Beraz, esan dezagun besterik errendatu nahi dugu
oraingoz flashcard zuzen-up bat.

270
00:12:32,390 --> 00:12:34,890
Flashcard, esango nuke,
galdera eta erantzun beharko dute.

271
00:12:34,890 --> 00:12:37,530
Beraz div honen barruan, dezagun
paragrafo bat inprimatu

272
00:12:37,530 --> 00:12:42,155
Hori question-- Zer da dio
Bizitza erantzun ultimate, unibertsoa?

273
00:12:42,155 --> 00:12:47,640

274
00:12:47,640 --> 00:12:50,345
Eta gero erantzuna da
izan, noski, 42 joan.

275
00:12:50,345 --> 00:12:56,880

276
00:12:56,880 --> 00:12:59,730
>> Hori ez etorri eta guztietan.

277
00:12:59,730 --> 00:13:04,164
Bai, beraz, funtsean, benetan dezakezu
idatzi zure Javascript barruan HTML.

278
00:13:04,164 --> 00:13:06,330
Eta hau izango da
Pantailako inprimatutako sartu.

279
00:13:06,330 --> 00:13:08,250
Hargatik saiatu.

280
00:13:08,250 --> 00:13:09,520
>> Beraz, gure osagai behar dugu.

281
00:13:09,520 --> 00:13:12,210
Erreakzionatu jarri kontatu behar dugu
pantailan agertzen osagaia

282
00:13:12,210 --> 00:13:18,990
beraz React.render, beraz, nabarituko dugu
Aplikazio tratatzeko beste edozein elementu bezala.

283
00:13:18,990 --> 00:13:21,010
Bertan idatzi dugu HTML elementu bat izan zen bezala.

284
00:13:21,010 --> 00:13:25,100
Ordez img bezala esaten Like
Irudi edo p paragrafoan egiteko,

285
00:13:25,100 --> 00:13:28,120
aplikazioa idatzi duzu, beraz, aplikazioa da
HTML elementu bat bezala tratatu.

286
00:13:28,120 --> 00:13:30,380
Lehen esan dudan bezala, ez da
esteroideak elementu bat.

287
00:13:30,380 --> 00:13:32,870
>> Beraz aplikazioa errendatu duzu, eta zuk
leku bat da jarri emango da.

288
00:13:32,870 --> 00:13:37,170
Eta hau da, nola egin ahal izango dituzu
Esango non jarri behar.

289
00:13:37,170 --> 00:13:46,200
On div sinple bat sortu dut
Orri ID bat izeneko orria,

290
00:13:46,200 --> 00:13:48,300
eta hori da, non
elementua da joan doaz.

291
00:13:48,300 --> 00:13:49,841
>> Eta ez gabiltza HTML batera exekutatu.

292
00:13:49,841 --> 00:13:53,145
Funtsean hau da iritsi
Orri elementu horren barruan jarri

293
00:13:53,145 --> 00:13:54,270
pantailaren alde dugula.

294
00:13:54,270 --> 00:13:59,210
Beraz, kode hau exekutatzen da, eta honek marrazten da
Gauza pantailan, beraz, hemen gaude.

295
00:13:59,210 --> 00:14:01,770
Gure erreakzionatu lehen osagaia egin ditugu.

296
00:14:01,770 --> 00:14:08,000
>> Beraz, besterik laburpena gisa, poliki-poliki egin genuen
Osagai-mota berri bat da, ezta?

297
00:14:08,000 --> 00:14:10,145
Hori zer React.createClass du.

298
00:14:10,145 --> 00:14:12,680
Eta osagai hori ere, ez dugu
esan du zer egin behar da.

299
00:14:12,680 --> 00:14:15,590
Betiere osagai hau da
den pantailaren gainean inprimatutako,

300
00:14:15,590 --> 00:14:19,300
egingo dituzten div inprima ezazu
horren barruan bi atalei.

301
00:14:19,300 --> 00:14:24,460
>> Eta zer egin genuen, aplikazio berri bat egin dugu
xebroi aplikazioa idazkera erabiliz.

302
00:14:24,460 --> 00:14:27,160
Eta kontatu ditugu bertan jarri
Orri elementua barruan.

303
00:14:27,160 --> 00:14:29,867
Eta orain zer egin nuen, hura sortu
template duten aplikazio berri bat.

304
00:14:29,867 --> 00:14:31,200
Eta gero, errendatu egin esan nion.

305
00:14:31,200 --> 00:14:33,680
Beraz, esan ohi da OK, aplikazioa,
zer behar inprimatu dut?

306
00:14:33,680 --> 00:14:36,970
Aplikazioa dio, joan div bat inprimatu
horren barruan bi paragrafo batekin.

307
00:14:36,970 --> 00:14:40,420
Eta voila, ez gure batera div da
horren barruan bi paragrafo.

308
00:14:40,420 --> 00:14:43,180
Zentzurik orain arte?

309
00:14:43,180 --> 00:14:46,690
>> Beraz, berriro ere, erronkari osoan erreakzionatu
da besterik osagaiak nola egin jakitea.

310
00:14:46,690 --> 00:14:48,500
Nola egin du
osagaiak elkarrekin lan.

311
00:14:48,500 --> 00:14:51,780
Orain egin dugun gure lehenengo
osagaia, goazen atzera

312
00:14:51,780 --> 00:14:54,284
eta egiteko osagaiak pertsonalizagarria.

313
00:14:54,284 --> 00:14:56,700
Beraz HTML badakizu nola duzu
Zure botoiak klaseak eman ahal?

314
00:14:56,700 --> 00:14:59,146
Zure anchors eman dezakezu href du.

315
00:14:59,146 --> 00:15:00,770
Zure sarrera eman dezakezu mota bat da, ezta?

316
00:15:00,770 --> 00:15:04,740
Custom gehiago eman ahal izango duzu
zure elementu guztiak propietate

317
00:15:04,740 --> 00:15:06,490
interesgarri izan dadin.

318
00:15:06,490 --> 00:15:09,030
Eta egia esan, ezin dugu
gauza bera zehatza.

319
00:15:09,030 --> 00:15:17,500
>> Beraz, esan dezagun nahi dugu gure
Aplikazio duen txartela errendatu joan.

320
00:15:17,500 --> 00:15:19,630
Oraintxe besterik ez dugu
hardcoded txartel bat errendatzen.

321
00:15:19,630 --> 00:15:22,530
Badakigu ez duen bakarra da
txartela egin daiteke, beraz, ez gara

322
00:15:22,530 --> 00:15:25,960
saiatu eta beraz, aldaketa hau orain joan
besterik ezin dugu eman, txartel batzuk.

323
00:15:25,960 --> 00:15:27,410
Out inprimatu izango da txartela.

324
00:15:27,410 --> 00:15:29,380
>> Saiatu eta saiatu zara zure
osagaiak helburua oso orokorra da.

325
00:15:29,380 --> 00:15:31,654
Beraz, modu honetan, e-posta nezakeen
hau nire lagun eta antzekoak izan,

326
00:15:31,654 --> 00:15:33,820
edozein dela flashcard duzu,
besterik elikatu da hemen sartu,

327
00:15:33,820 --> 00:15:35,290
eta gauza bera egin beharko da, berez.

328
00:15:35,290 --> 00:15:37,650
Beste jarri dezakezu
Zeure aplikazioa ere gauzak.

329
00:15:37,650 --> 00:15:40,600
>> Baina lehen, dezagun apurtu honetan
bi osagai sartu arte,

330
00:15:40,600 --> 00:15:44,500
baina txartela banandu nahi dugu
inprimatzeko parte benetako aplikazioa lekutatik.

331
00:15:44,500 --> 00:15:46,660
Beraz, zer egin dezakegu dugu
aplikazioa aldatu dezakezu hau

332
00:15:46,660 --> 00:15:51,300
CardView nahi, besterik bat
Aplikazioa izen berria,

333
00:15:51,300 --> 00:15:54,450
eta berri bat egin ahal izango dugu
Osagai aplikazioa deitzen,

334
00:15:54,450 --> 00:15:56,336
ez zaharra aplikazioa nahastu behar.

335
00:15:56,336 --> 00:16:00,730
Lortu dugu createClass du,
eta HTML bezala,

336
00:16:00,730 --> 00:16:03,590
ahal habia erreakzionatu osagaiak
bata bestearen barruan.

337
00:16:03,590 --> 00:16:16,430
>> Errendatu funtzio honetan beraz,
funtzio bueltan CardView,

338
00:16:16,430 --> 00:16:18,234
eta honen zehatza gauza bera da.

339
00:16:18,234 --> 00:16:19,400
Ikusi zergatik gauza bera da?

340
00:16:19,400 --> 00:16:22,590
Horren ordez, besterik gabe aplikazioa ematearen dagoela
div eta uztartzea ere barruan ditu,

341
00:16:22,590 --> 00:16:26,194
Aplikazio pintatzen CardView du, eta
CardView div eta paragrafo bihurtzen duena.

342
00:16:26,194 --> 00:16:29,110
Beraz, hau da gure lehen adibidea da
bata bestearen barruan habia egiteko elementu.

343
00:16:29,110 --> 00:16:32,177
Ez duela zentzurik?

344
00:16:32,177 --> 00:16:33,760
Beraz, berriro ere, CardView elementu bat behar dugu.

345
00:16:33,760 --> 00:16:37,250
Aplikazio elementu daukagu
baino handiagoa dela.

346
00:16:37,250 --> 00:16:40,990
>> Ados, beraz, nahi dugu gure CardView-- baduzu
Epaileak txartel jakin bat emango CardView ona,

347
00:16:40,990 --> 00:16:43,370
inprimatu egingo out zuretzat, ezta?

348
00:16:43,370 --> 00:16:48,050
Beraz, lehenik eta behin, txartel bat egin behar dugu,
Hargatik egin txartela objektu bat.

349
00:16:48,050 --> 00:17:02,930
Hargatik nire txartela berdinak
Oraindik guztiak ezagutzen bada,

350
00:17:02,930 --> 00:17:05,260
hau besterik idazkera-hartzea da
Ikusteko Javascript-oposiziorako.

351
00:17:05,260 --> 00:17:09,280
Mota da egitura bat bezala
C, beraz, txartel bat egin genuen,

352
00:17:09,280 --> 00:17:15,920
eta beraz, orain txartel hau gainditu ahal izango dugu
Jabetza edo HTML atributu bat bezala

353
00:17:15,920 --> 00:17:17,290
Gure aplikazioa terminologia.

354
00:17:17,290 --> 00:17:20,210
Beraz, egin ahal izango dugu hau, aplikazioa
txartela berdinen myCard.

355
00:17:20,210 --> 00:17:23,200
>> Nola sarrerako ere, ez duzu ezagutzen duzu
Sarrera-mota testu edo botoi berdinen

356
00:17:23,200 --> 00:17:25,240
klase berdinen bootstrap for btn ,?

357
00:17:25,240 --> 00:17:29,500
Ideia bera, aplikazioa txartela berdin
Ohizko duzu giltza jarri hemen

358
00:17:29,500 --> 00:17:33,830
Aplikazioa txartela berdinen myCard, beraz hau
dioen txartela objektu hau dugu.

359
00:17:33,830 --> 00:17:39,149
Hura bezala pasatzen noa
Aplikazio osagaia den eraikina.

360
00:17:39,149 --> 00:17:41,440
Eta aplikazioa osagai hau izango
izan da sartzeko gai eta egin

361
00:17:41,440 --> 00:17:43,580
egiten dituzten gauza interesgarri.

362
00:17:43,580 --> 00:17:47,650
>> Beraz, gure aplikazioa izango da
txartel bat ematen, beraz, oraingoz,

363
00:17:47,650 --> 00:17:49,980
ditzagun aplikazioa besterik eman
CardView txarteleko

364
00:17:49,980 --> 00:17:53,110
bera bezalako aplikazioa ez dagoelako
berarekin zer egin jakin nahi du,

365
00:17:53,110 --> 00:17:54,850
beraz, besterik ez dugu eman CardView izateko.

366
00:17:54,850 --> 00:18:00,050
Beraz, egin dugu pasatzen dugu
Modu berean, txartela berdin,

367
00:18:00,050 --> 00:18:05,426
eta, beraz, osagai bakoitzaren sar daitezke
hori izan da emandako gauzak.

368
00:18:05,426 --> 00:18:07,800
Propietate sartu ahal izango dute
izan duen eman

369
00:18:07,800 --> 00:18:09,470
sintaxia hau erabiliz, this.props.card.

370
00:18:09,470 --> 00:18:12,010

371
00:18:12,010 --> 00:18:14,920
>> Beraz, zer gertatzen da hemen da
myCard objektuaren duzu.

372
00:18:14,920 --> 00:18:18,250
Handik igaro aplikazioa sartu zara
aplikazioa txartela erabiliz berdinen myCard.

373
00:18:18,250 --> 00:18:21,420
Txartela objektu hori zure aplikazioa emandako.

374
00:18:21,420 --> 00:18:24,400
Aplikazio sar daitezke
this.props.card bezala.

375
00:18:24,400 --> 00:18:28,780
Mota da irudi bat bezala
da iturburu-dena daki.

376
00:18:28,780 --> 00:18:31,972
>> Aplikazio honek badaki zer txartela da
da, eta gauzak egin ahal izango da berarekin.

377
00:18:31,972 --> 00:18:32,930
Konputurako egin ahal izango da.

378
00:18:32,930 --> 00:18:35,290
Oinarritutako off da erabakiak hartu ahal izango ditu.

379
00:18:35,290 --> 00:18:39,950
>> Oraingoz, pasatzeko nindoan
CardView kalera this.props.card.

380
00:18:39,950 --> 00:18:43,420
Zentzurik orain arte?

381
00:18:43,420 --> 00:18:45,210
Egingo du zentzu gehiago orain.

382
00:18:45,210 --> 00:18:46,990
>> Ados, beraz, orain ari CardView begiratzen dugu.

383
00:18:46,990 --> 00:18:51,719
Egun Gure CardView, txartela eman beharko lukete
inprimatu bere galdera eta erantzuna.

384
00:18:51,719 --> 00:18:54,510
Oraintxe besterik inprimatutako dugu batzuk
hardcoded galdera eta erantzunak.

385
00:18:54,510 --> 00:18:57,720
Out-- irudikatu behar dugu behar dugu
Epaileak txartel gaituen eman diren galdetzera

386
00:18:57,720 --> 00:19:01,360
zer galdera eta erantzuna da, eta
ondoren, inprimatu honek egindako pantailan sartu.

387
00:19:01,360 --> 00:19:02,470
>> Beraz, hemen hau egin ahal izango dugu.

388
00:19:02,470 --> 00:19:06,135
In errendatu begin-- lehen egin berdin.

389
00:19:06,135 --> 00:19:08,710

390
00:19:08,710 --> 00:19:13,050
Beraz, hemen zer egiten ari gara ezagutzen dugun hori
txartelak dira digute etxebizitza bat izateko,

391
00:19:13,050 --> 00:19:13,580
ezta?

392
00:19:13,580 --> 00:19:15,930
Sarrera gisa Jar Honez eman.

393
00:19:15,930 --> 00:19:19,440
Da ia bezala Like
funtzio bat argumentuak.

394
00:19:19,440 --> 00:19:22,810
Txartelak gehienez argumentu bat da
Ia CardView honetarako.

395
00:19:22,810 --> 00:19:25,239
>> Ateratzeko ikusiko dugu, eta jarri
Galdera aldagai sartu da.

396
00:19:25,239 --> 00:19:27,280
Ziurtatu erantzuna joan
erantzun aldakorra da.

397
00:19:27,280 --> 00:19:31,130
Galderen erantzun nahi ez duten txartela.

398
00:19:31,130 --> 00:19:35,072
Eta orain, horiek ditugula,
ordez inprimatzeko testu hori,

399
00:19:35,072 --> 00:19:37,030
inprimatu goaz
edozein dela ere eman dute.

400
00:19:37,030 --> 00:19:43,580
>> Beraz, hau stuff-- beraz goazen
kanpo jarri galderari erantzun.

401
00:19:43,580 --> 00:19:46,380
Ea, bada lan egiten utzi.

402
00:19:46,380 --> 00:19:52,800
Cool, beraz dezagun pausoz bidez
denbora gehiago besterik ez izan.

403
00:19:52,800 --> 00:20:00,470
>> Beraz, nire Txartel objektu da, eta guk
daude aplikazioa txarteleko hori emanez.

404
00:20:00,470 --> 00:20:04,790
Eta Aplikazioa hartu du
txartela eta eman CardView izateko.

405
00:20:04,790 --> 00:20:09,190
Eta CardView hau dio, baduzu
ematen dit edozein flashcard objektu,

406
00:20:09,190 --> 00:20:11,920
Inprimatu dut bere galderari
eta haren erantzuna, ezta?

407
00:20:11,920 --> 00:20:14,590
>> Beraz, zer egin izan dut, ezin dut
Kode hau bidali, lehena

408
00:20:14,590 --> 00:20:16,580
10 Nire kode lerro, nire laguna den bezala.

409
00:20:16,580 --> 00:20:18,820
Bertan txertatzeko ahal izan zuen ere
bere aplikazio izena.

410
00:20:18,820 --> 00:20:27,200
Eta gauza bera egin du, betiere zuen bezala,
atsegin CardView txartela berdin hau,

411
00:20:27,200 --> 00:20:30,580
betiere, CardView sortu zuen
eta informazio zuzena eman zion,

412
00:20:30,580 --> 00:20:31,987
bere txartela emango lizkioke zuen.

413
00:20:31,987 --> 00:20:34,320
Eta beraz, modu honetan, benetan bat da
eraikitzeko zuretzat modu cool

414
00:20:34,320 --> 00:20:35,906
bata bestearen erabili duten, eskuineko osagaiak?

415
00:20:35,906 --> 00:20:38,280
Txartel hau, argitaratzen nezakeen
CardView hau Interneten,

416
00:20:38,280 --> 00:20:39,790
eta jendeak erabiltzeko gai izango litzateke.

417
00:20:39,790 --> 00:20:45,070
Beraz, funtsean, da bat bezalakoa da
C liburutegi funtzioen estandarra.

418
00:20:45,070 --> 00:20:47,280
>> Funtzio bat, non da
Norbaitek idatzi zuen.

419
00:20:47,280 --> 00:20:48,419
Sarrerako jakin bat emango dizu.

420
00:20:48,419 --> 00:20:49,710
Irteera jakin bat ekoizteko izango da.

421
00:20:49,710 --> 00:20:50,890
Axola nola dabil barrutik.

422
00:20:50,890 --> 00:20:53,790
Betiere eskubidea eman duzun bezala
sarrera, eskuineko irteera egingo da.

423
00:20:53,790 --> 00:20:57,850
>> Eta osagai bat izan daiteke
Modu berean pentsatu.

424
00:20:57,850 --> 00:21:00,280
CardView hau bezalakoa da
liburutegi funtzio bat.

425
00:21:00,280 --> 00:21:03,400
Txartel batzuk eman behar baduzu
Jabetza gisa, dela egingo

426
00:21:03,400 --> 00:21:05,095
Epaileak txartel horren edukia inprimatu.

427
00:21:05,095 --> 00:21:16,820
Nire txartela aldatu nahi izanez Like
ordez zer da 5 plus 37 bezalakoa izan,

428
00:21:16,820 --> 00:21:19,210
horren arabera eguneratu ahal izango da.

429
00:21:19,210 --> 00:21:21,955
Beraz, besterik gabe, sarrerako aldatuz,
irteera jakin bat daukala.

430
00:21:21,955 --> 00:21:24,830
Beraz, ia osagai pentsa dezakezu
modu horretan, funtzioak, zein

431
00:21:24,830 --> 00:21:25,920
bildu dezakezu.

432
00:21:25,920 --> 00:21:29,440
Sarrera lortuko duzu, CardView honen antzeko
sarrera gisa, irteera lortuko duzu.

433
00:21:29,440 --> 00:21:31,900
Kasu honetan, irteera HTML da.

434
00:21:31,900 --> 00:21:34,404
Zentzurik orain arte?

435
00:21:34,404 --> 00:21:36,890
Cool, beraz, berriro ere, propietate dira
Informazio nola gainditu ahal izango duzu

436
00:21:36,890 --> 00:21:40,900
sartu eta osagaiak.

437
00:21:40,900 --> 00:21:42,740
>> Ados, beraz, egin dezagun hau
Gauza interaktiboa.

438
00:21:42,740 --> 00:21:44,450
Oraintxe aspergarria mota da.

439
00:21:44,450 --> 00:21:45,520
Zer da [INAUDIBLE]?

440
00:21:45,520 --> 00:21:48,210
Zenbait inprimatu ahal izango duzu,
baina hori guztia egin ahal izango da.

441
00:21:48,210 --> 00:21:51,550
>> Beraz, goazen atzealdera
Galdera zaharra besterik oraingoz.

442
00:21:51,550 --> 00:21:54,405
Ados, beraz, oraintxe osagai horiek
dira guztiak ere ez aspergarria,

443
00:21:54,405 --> 00:21:55,030
sarrera lortuko dute.

444
00:21:55,030 --> 00:21:56,100
Irteera, eskuinera egiten dute?

445
00:21:56,100 --> 00:21:57,049
Hori da, aspergarria mota.

446
00:21:57,049 --> 00:21:59,090
Gure izatea nahi dugu
osagaiak izan ahal izateko

447
00:21:59,090 --> 00:22:02,150
Barne-egoera mota batzuk,
bezala gogoratzen zerbait.

448
00:22:02,150 --> 00:22:05,320
>> Flashcard egin du,
Adibidez, zer egoera-mota

449
00:22:05,320 --> 00:22:07,550
baliteke duzu nahi
flashcard bat gogoratzen?

450
00:22:07,550 --> 00:22:09,740
Zer da aldi baterako status
Baliteke gogoratu nahi duzun

451
00:22:09,740 --> 00:22:12,491
flashcard aplikazio batean flashcard bat?

452
00:22:12,491 --> 00:22:13,990
Ikusleak: nik iraulita diren edo ez?

453
00:22:13,990 --> 00:22:14,990
NEEL Mehta: Bai, eskubidea.

454
00:22:14,990 --> 00:22:17,665
Beraz, agian gorde nahi duzun
jarraipena dira eman duzu aurpegia edo dira

455
00:22:17,665 --> 00:22:19,100
Ahuspez duzu txartela.

456
00:22:19,100 --> 00:22:23,420
Facebook-en, adibidez, zenituzkeen
gogoratzen non albiste jarioa nahi

457
00:22:23,420 --> 00:22:25,870
Zara edo gustuko duten soslaia
ari zaren oraintxe.

458
00:22:25,870 --> 00:22:30,127
>> Messenger, On zer testu gusta
Sarrera-koadroan idatzi, ezta?

459
00:22:30,127 --> 00:22:31,710
Orria eguneratu baduzu, urruntzen doan da.

460
00:22:31,710 --> 00:22:32,793
Baina, ez zaintzeko duzu.

461
00:22:32,793 --> 00:22:33,770
Besterik ez da behin-behinekoa da.

462
00:22:33,770 --> 00:22:34,548
Bai?

463
00:22:34,548 --> 00:22:36,152
>> Ikusleak: [INAUDIBLE]

464
00:22:36,152 --> 00:22:38,360
NEEL Mehta: flash bat Like
txartela, egon ikustea nahi duzu

465
00:22:38,360 --> 00:22:40,290
the question alboko edo erantzun aldean?

466
00:22:40,290 --> 00:22:41,070
>> Ikusleak: OK.

467
00:22:41,070 --> 00:22:43,270
>> NEEL Mehta: a Like
bi aldeko flashcard, ezta?

468
00:22:43,270 --> 00:22:46,370
Bai, beraz, nahi duzun
orain ideia hau izan

469
00:22:46,370 --> 00:22:50,370
Propietate izan dut, eta horrek Sarrerek bezalakoa da,
baina egoera, hau da, aldi baterako, uh,

470
00:22:50,370 --> 00:22:51,839
non zauden orrian, ezta?

471
00:22:51,839 --> 00:22:54,380
Berriz ere, Facebook nioen
Messenger, eta pertsona bezala daukat

472
00:22:54,380 --> 00:22:56,550
Facebook ikusten ari zarenean
edo nor profila, ezta?

473
00:22:56,550 --> 00:22:58,030
>> Hau da, behin-behinekoa.

474
00:22:58,030 --> 00:23:01,200
Garrantzitsua da erakusteko erabiltzailea
zer gertatzen den, baina orrialde freskatzeko.

475
00:23:01,200 --> 00:23:02,250
Ez da benetan axola.

476
00:23:02,250 --> 00:23:04,530
Beraz, aldi baterako egoera da,
beraz, dugun guztia da egoera.

477
00:23:04,530 --> 00:23:06,250
>> Beraz, berriro ere, ez egoera eta atrezzoa da.

478
00:23:06,250 --> 00:23:09,084
Atrezzo da sarrera eman
Zure datuen iturritik.

479
00:23:09,084 --> 00:23:10,250
Estatuko besterik lehenetsiak bezalakoa da.

480
00:23:10,250 --> 00:23:13,700
Besterik ez da gauza bezalakoa da hori
egiten gauza interaktiboa.

481
00:23:13,700 --> 00:23:17,720
>> Beraz, gure CardView-- ditzagun
Gure CardView-- hain polita izan zen.

482
00:23:17,720 --> 00:23:21,420
Zer ari gara hemen egin behar dugu, goazen
CardView eta bakarrik CardView ukitzeko.

483
00:23:21,420 --> 00:23:25,105
Eta beraz, nire lagun batek lortu honetan, dute
ez luke ezberdintasunik sumatu.

484
00:23:25,105 --> 00:23:27,230
Ez zutela izango den aldatu
beren kodea edozein,

485
00:23:27,230 --> 00:23:29,410
baina ikusi litzaidake dute beren
CardView got souped.

486
00:23:29,410 --> 00:23:31,270
Hori osagaiak buruz zati polita da.

487
00:23:31,270 --> 00:23:35,290
>> Ados, gure CardView beraz, dezagun saiatu eta
dugu fasea eman ala ez ari pista gorde

488
00:23:35,290 --> 00:23:36,560
edo ahoz behera.

489
00:23:36,560 --> 00:23:40,480
Erreakzio hori egiten dugu lehenengo arabera
hasierako egoera zehaztuz.

490
00:23:40,480 --> 00:23:42,070
Non hasten da txartela?

491
00:23:42,070 --> 00:23:48,480
>> Beraz getInitialState izeneko funtzio bat izan
funtzionatu, eta objektu bat itzuliko gara.

492
00:23:48,480 --> 00:23:53,310
Objektu hau estatu batzuk ditu, eta
egoera bat besterik gako-balio bikote bat da.

493
00:23:53,310 --> 00:23:56,950
Arauak bezala, gako bat eta bat duzu
balio, izan duzun bezala izen katea da.

494
00:23:56,950 --> 00:24:01,410
>> Kasu honetan, demagun aurrean egia da.

495
00:24:01,410 --> 00:24:03,760
Hau dio egoera bat dugula.

496
00:24:03,760 --> 00:24:06,570
Egoera osagai batek
aurrean izeneko atributu bat da.

497
00:24:06,570 --> 00:24:09,649
[INAUDIBLE], lehenetsita beraz,
Oraindik, txartelaren aurrean dugu,

498
00:24:09,649 --> 00:24:11,440
eta hau aldatzeko aukera izango dugu
txartela irauli dugu.

499
00:24:11,440 --> 00:24:13,380
Zentzurik?

500
00:24:13,380 --> 00:24:18,190
>> Ados, beraz, errendatu, oraintxe, ari gara
Galdera eta erantzuna erakutsiz.

501
00:24:18,190 --> 00:24:20,860
Orain zer egin behar dugu
galderari agertuko da

502
00:24:20,860 --> 00:24:24,370
Oraindik ez dugu txartelaren aurrealdean bada orain
Erantzuna txartelaren atzealdean dago.

503
00:24:24,370 --> 00:24:26,850
Hori da, zergatik egiten duzun guztia
txartelari interaktiboa.

504
00:24:26,850 --> 00:24:28,100
Hargatik saiatu eta hemen honetarako.

505
00:24:28,100 --> 00:24:31,600

506
00:24:31,600 --> 00:24:33,620
Beno, lehenik eta besterik ez egiteko aldagai bat.

507
00:24:33,620 --> 00:24:37,790
Orain galdetu diogu this.state.front.

508
00:24:37,790 --> 00:24:42,010
Estatuak dugu bera sartzeko dugu
sarbide atrezzoa, beraz this.state.front.

509
00:24:42,010 --> 00:24:45,870
>> Aurrean bagaude, orduan testua
this.props.card.question da.

510
00:24:45,870 --> 00:24:48,777

511
00:24:48,777 --> 00:24:51,360
Oraindik dugu aurreko aldean bada
txartela, ari gara eta saiatu grab joan

512
00:24:51,360 --> 00:24:52,485
txarteletik galderari.

513
00:24:52,485 --> 00:24:54,782

514
00:24:54,782 --> 00:24:57,240
Bestela, ez gara atzeko aldean bada
Txartelaren, zer egiten dugu?

515
00:24:57,240 --> 00:25:01,830

516
00:25:01,830 --> 00:25:02,750
>> Ikusleak: Erantzuna?

517
00:25:02,750 --> 00:25:05,041
>> NEEL Mehta: Bai, beraz, testua
berdinen this.props.card.answer.

518
00:25:05,041 --> 00:25:08,472

519
00:25:08,472 --> 00:25:10,930
Baina konturatu baduzu, erabiltzen ari gara
egoera erabaki bat egiteko

520
00:25:10,930 --> 00:25:14,420
orain osagaia delako
itxura ezberdina

521
00:25:14,420 --> 00:25:16,710
oinarritutako off horiek nola elkarreragin.

522
00:25:16,710 --> 00:25:20,355
Beraz inprimatzeko honen ordez,
besterik ez dugu inprimatu testua.

523
00:25:20,355 --> 00:25:25,270

524
00:25:25,270 --> 00:25:28,650
Cool, orain, beraz, ikusten duzun bezala,
Galdera bakarra ikusiko dugu.

525
00:25:28,650 --> 00:25:37,720
Eta egoera eskuz aldatzen badut hemen
aurrealdean faltsua da 42 bueltan.

526
00:25:37,720 --> 00:25:39,720
>> Beraz, berriro ere, osagai hau
bere egoera propioa du.

527
00:25:39,720 --> 00:25:43,440
Like botoi bat daki
Honez sakatu da edo ez,

528
00:25:43,440 --> 00:25:46,080
Gauza hau badaki zein den,
aurrealdean edo atzealdean.

529
00:25:46,080 --> 00:25:48,320
Besterik adierazi ezean, aurrealdean da.

530
00:25:48,320 --> 00:25:50,840
Eta gero, ez da aurreko aldean bada,
dugu, inprimatu egingo galderari.

531
00:25:50,840 --> 00:25:53,106
Da, atzeko aldean bada, dugu
inprimatu erantzuna.

532
00:25:53,106 --> 00:25:54,980
Beraz, berriro ere, informazioa
Emandako bera da.

533
00:25:54,980 --> 00:25:59,090
Itxura besterik ez da desberdina
oinarritutako nola programatu duzun.

534
00:25:59,090 --> 00:26:02,670
Beraz, adibidez, Facebook Messenger,
Datu-iturri beraren lortu baduzu ere,

535
00:26:02,670 --> 00:26:05,170
beste itxura zitekeen
egoera ezberdina da delako.

536
00:26:05,170 --> 00:26:08,421
You bat ikusten ari zara
hainbat pertsona mezua.

537
00:26:08,421 --> 00:26:10,930
>> Ados, beraz, hau da, guztiak ondo eta
ona da, baina, gaur egun, zer da benetan

538
00:26:10,930 --> 00:26:15,940
ahal digu, aldatu behar den ala ez dadin
Gure txartela aurrean edo atzean dagoen.

539
00:26:15,940 --> 00:26:19,010
Hau egin ahal izango dugu irauli gehituz
botoia, txartelera botoi bat

540
00:26:19,010 --> 00:26:22,950
txartela irauli egingo da, bada [INAUDIBLE].

541
00:26:22,950 --> 00:26:31,770
Hargatik gehitu botoi bat hemen, hau
botoia, eta botoi hau irauli esango du.

542
00:26:31,770 --> 00:26:35,650
>> Eta beraz, oraintxe, hura
ez du ezer egin.

543
00:26:35,650 --> 00:26:37,075
Itxura besterik ez da polita.

544
00:26:37,075 --> 00:26:43,650
Zer egin dezakegu klik bat gehitu ahal izango dugu
kudeatzailea, OnClick berdinen this.flip,

545
00:26:43,650 --> 00:26:44,820
eta zehaztu egingo dugu irauli geroago.

546
00:26:44,820 --> 00:26:47,120
Baina, batez ere, OnClick
funtzio bat dela

547
00:26:47,120 --> 00:26:48,675
lortzen izeneko erabiltzaileak klik egiten duenean.

548
00:26:48,675 --> 00:26:52,330
>> Beraz botoia jakin
denean, bertan klik egin dira.

549
00:26:52,330 --> 00:26:54,750
Joan zen, bertan klik egin da,
txartela irauli egingo da.

550
00:26:54,750 --> 00:26:58,382
Mota da It zure like
pizza entrega lasaia.

551
00:26:58,382 --> 00:27:01,590
Bezala ari zara, eskubidea, betiere, norbait
deitzen dit, pizza entregatu dut, ezta?

552
00:27:01,590 --> 00:27:03,420
>> Entzulearen hori erregistratu.

553
00:27:03,420 --> 00:27:04,530
Gertaera baten entzungo duzu.

554
00:27:04,530 --> 00:27:07,657
Izeneko lortuko duzu, eta, orduan,
Gertaera gertatzen, zerbait egin behar dituzu.

555
00:27:07,657 --> 00:27:08,240
Pizza lortu ahal izango dituzu.

556
00:27:08,240 --> 00:27:11,480
Kasu honetan, ez zara
klik, txartela irauli duzu.

557
00:27:11,480 --> 00:27:14,560
>> Eta beraz bat zehaztu behar dugu
Funtzio hori txartela irauli egingo,

558
00:27:14,560 --> 00:27:17,930
beraz, eskubide hori idatzi dugu
Hemen, irauli funtzioa.

559
00:27:17,930 --> 00:27:20,850

560
00:27:20,850 --> 00:27:23,680
Eta beraz, zer uste duzu irauli egingo duzue?

561
00:27:23,680 --> 00:27:27,180
Berriz ere, hori lortzen denean izeneko
klik dugu irauli botoia.

562
00:27:27,180 --> 00:27:29,406
Zer funtzio irauli egin behar duzu?

563
00:27:29,406 --> 00:27:34,136
>> Ikusleak: Aldatu this.state.front
Egia from faltsuak, faltsua egia dira.

564
00:27:34,136 --> 00:27:38,420
>> NEEL Mehta: Bai, beraz, edozein dela ere hartu
this.front is-- aurrealdeko egoera da.

565
00:27:38,420 --> 00:27:40,930
Hartu aurrean egoera, bada
egia da, berau faltsuak egiteko.

566
00:27:40,930 --> 00:27:42,530
Faltsua bada, beraz, eta egia da, ezta?

567
00:27:42,530 --> 00:27:45,330
Hargatik saiatu direla.

568
00:27:45,330 --> 00:27:48,240
>> Ezin duzu egoera aldatu
besterik this.state eginez.

569
00:27:48,240 --> 00:27:50,380
Ezin duzu hori egin.

570
00:27:50,380 --> 00:27:52,030
Ezin duzu hori egiten.

571
00:27:52,030 --> 00:27:55,810
Funtzio bat erabili behar duzu
this.setState deitzen.

572
00:27:55,810 --> 00:28:03,230
>> Beraz aurrean this.setState esan dezakezu
colon non honek, berriz ere, harridura

573
00:28:03,230 --> 00:28:04,330
Puntu kontrakoa esan.

574
00:28:04,330 --> 00:28:07,420
Asmatzen honetan badut. state.front
Egia da, faltsu txanda izango da.

575
00:28:07,420 --> 00:28:09,170
Beraz, egoera ezarri beharko dugu
Egia from faltsua da.

576
00:28:09,170 --> 00:28:11,430
Faltsua bada, zaitugu
ezarri faltsua egia da.

577
00:28:11,430 --> 00:28:17,210
>> Just nabarituko ezarri eta zertxobait dugun
ezberdinean, eta beraz, saia gaitezen honekin.

578
00:28:17,210 --> 00:28:18,675
Bada Bing, hau begiratu.

579
00:28:18,675 --> 00:28:21,810
Flip botoia orain
Aurrealdean egoera itzultzeko.

580
00:28:21,810 --> 00:28:24,990
>> Eta beraz, hemen non a ikusiko duzu
Erreakzio magia pixka.

581
00:28:24,990 --> 00:28:28,420
Like dugu inoiz esan egiten da berriro errendatzeko.

582
00:28:28,420 --> 00:28:30,910
Inoiz esan dugu ezer marraztu da.

583
00:28:30,910 --> 00:28:32,630
Duzu hau egiten ari bada
gabe erreakzionatu, dituzu

584
00:28:32,630 --> 00:28:34,588
izan zaie gustatzen denean
flip botoia sakatzen,

585
00:28:34,588 --> 00:28:37,290
kontatzeko behar duzuna
eskuz berriro errendatu, ezta?

586
00:28:37,290 --> 00:28:43,050
>> Erreakzionatu benetan freskoa ere bazara
egoera eta propietate jakin bat ematen diote,

587
00:28:43,050 --> 00:28:45,760
Beti errendatuko da
gauza bera zehatza.

588
00:28:45,760 --> 00:28:48,690
Eta beraz, inoiz aldatuko dugu dugu
egoera eta propietate,

589
00:28:48,690 --> 00:28:50,819
gauza osoa erreakzionatu besterik berriro bihurtzen duena.

590
00:28:50,819 --> 00:28:52,860
Daki da, ez dagoela bat
korrespondentzia bat-bateko

591
00:28:52,860 --> 00:28:57,270
egoera eta parametro eta HTML artean.

592
00:28:57,270 --> 00:29:00,110
Beraz, betiere horiek bai
Multzo egoera baten bidez aldaketak,

593
00:29:00,110 --> 00:29:03,750
aldatu egingo da nola egin
soldata da berriro errendatuko dira.

594
00:29:03,750 --> 00:29:06,650
Eta, beraz, funtsean, erreakzionatu bezalakoa da
aldatu zain.

595
00:29:06,650 --> 00:29:09,870
>> Bakoitzean zerbait aldatzen da,
da izango berriro errendatu orri osoa.

596
00:29:09,870 --> 00:29:12,480
Eta eraginkorra soinuak badu,
da delako litzateke,

597
00:29:12,480 --> 00:29:15,050
baina erreakzionatzeko gauza erabiltzen
Itzala DOM bat deitzen.

598
00:29:15,050 --> 00:29:19,950
Horren ordez orrialde zuzenean marrazketa, hura
HTML birtual zuhaitz mantentzen oroimenez.

599
00:29:19,950 --> 00:29:23,620
>> Ba al dakizu, HTML zuhaitz bat bezalakoa da,
Datuen egitura hierarkiko bat bezala.

600
00:29:23,620 --> 00:29:28,990
Zuhaitz faltsu bat gordetzen du, memoria,
eta, betiere orria eguneratu,

601
00:29:28,990 --> 00:29:31,940
Mitxel beste marrazteko egingo da
zuhaitz eta kalkulatu ahal izango da

602
00:29:31,940 --> 00:29:35,120
zer aldatu egin behar da
Orri bi zuhaitzen berdina egiteko.

603
00:29:35,120 --> 00:29:38,540
Beraz, funtsean, ia
asko re-errendatzen.

604
00:29:38,540 --> 00:29:41,540
Eta gero, bakarrik nahi aldatzen du
Tweaks txikian orria behar bezala,

605
00:29:41,540 --> 00:29:44,240
beraz, oso, oso, oso eraginkorra da.

606
00:29:44,240 --> 00:29:46,970
>> Beraz, funtsean erreakzionatu
betiere, zerbait aldatuz gero,

607
00:29:46,970 --> 00:29:49,010
Egingo berriro errendatu orritik ia.

608
00:29:49,010 --> 00:29:52,830
Irudikatu beharko da zer egin behar dut
aldatzeko benetako orria islatu egiteko

609
00:29:52,830 --> 00:29:55,602
orrialdearen birtualean, eta hori egingo da.

610
00:29:55,602 --> 00:29:56,560
Hori DOM birtual da.

611
00:29:56,560 --> 00:29:59,350
Da handienetako bat
ezaugarriak erreakzionatu.

612
00:29:59,350 --> 00:30:00,880
>> Ez duela zentzurik?

613
00:30:00,880 --> 00:30:01,540
Galderarenbat?

614
00:30:01,540 --> 00:30:02,040
Bai?

615
00:30:02,040 --> 00:30:05,568

616
00:30:05,568 --> 00:30:08,969
>> Ikusleak: Nola egiten du
alderatu oraindik MVC izateko

617
00:30:08,969 --> 00:30:10,760
buruz hitz egiten dugun
bezalako baliabideen aurretik.

618
00:30:10,760 --> 00:30:13,527
>> NEEL Mehta: Bai, galdera
da, nola ez konparatu MVC da?

619
00:30:13,527 --> 00:30:14,610
Galdetu al baliabideak buruz.

620
00:30:14,610 --> 00:30:16,445
Beno, hitz egin, nola funtzionatzen duen inguru utzi.

621
00:30:16,445 --> 00:30:18,190
>> MVC, eredua eguneratu litzaidake.

622
00:30:18,190 --> 00:30:20,560
Kasu honetan litzaidake txartela eredu bat behar dugu.

623
00:30:20,560 --> 00:30:24,540
Ikuspegiak izango luke
flip botoia, eta kontrola

624
00:30:24,540 --> 00:30:26,310
irauli funtzioa izango luke.

625
00:30:26,310 --> 00:30:28,450
Beraz ikuspegia esango luke
controller irauli irauli.

626
00:30:28,450 --> 00:30:30,370
Flip esango luke
eredua aldatzea, ezta?

627
00:30:30,370 --> 00:30:33,915
>> Eta beraz, MVC bat, zuk ez duzu
entzun eredua aldatzea,

628
00:30:33,915 --> 00:30:37,150
eta berriro errendatu ikuspegi horren arabera duzu.

629
00:30:37,150 --> 00:30:39,210
Edo, besterik ez duzu nahi
kontroladorea dute.

630
00:30:39,210 --> 00:30:42,418
Itxaron eredua aldatzea, eta, ondoren,
jaso eta gauza bat bezalakoa zati bat aukeratu

631
00:30:42,418 --> 00:30:44,032
aldatu.

632
00:30:44,032 --> 00:30:45,740
Hemen gauza bat egin behar dugu,
baina aplikazioa handi batean,

633
00:30:45,740 --> 00:30:48,510
Gustatzen gogoratu zer egin behar duzu
leku bakarra behin-aldaketa,

634
00:30:48,510 --> 00:30:50,290
beraz, apur bat gogaikarriak.

635
00:30:50,290 --> 00:30:53,670
Eta horrela erreakzionatu da polita
Itzala Dom bat duelako da.

636
00:30:53,670 --> 00:30:56,040
Besterik ez da ordaindu ahal
berridatzi gauza osoa.

637
00:30:56,040 --> 00:30:58,680
Ez daukazu selektibo
bezala asmatzen zer den egunera.

638
00:30:58,680 --> 00:31:02,186
>> Facebook, nahi baduzu
Mezu berri bat lortzeko, MVC ere,

639
00:31:02,186 --> 00:31:04,060
Gogoratu behar duzuna,
Ados, gauzak aldatzeko

640
00:31:04,060 --> 00:31:06,260
du goialdean
orrialdea, mezuaren ikonoa.

641
00:31:06,260 --> 00:31:08,290
Leiho berri bat irekiko Era behealdean.

642
00:31:08,290 --> 00:31:10,070
Honetaz gain, leiho hori beste gauza bat.

643
00:31:10,070 --> 00:31:11,060
Era berean, soinu bat.

644
00:31:11,060 --> 00:31:13,150
>> Hori gauza handia da
Kanpora joan, aldi berean.

645
00:31:13,150 --> 00:31:15,320
Eta ez hain baduzu
Itzala Dom bat dute, dituzu

646
00:31:15,320 --> 00:31:18,740
Eskuz delako egin dute
ezin duzu orri osoa kentzeko.

647
00:31:18,740 --> 00:31:21,430
Ezin duzu DESOREKATU, beraz, behar duzu
Gauza bakoitza eskuz aldatu,

648
00:31:21,430 --> 00:31:23,990
hau da, benetan MVC gogaikarriak.

649
00:31:23,990 --> 00:31:27,640
>> Beraz izateko izan
gastatu dute, selektibo

650
00:31:27,640 --> 00:31:30,750
orria eguneratu, hau da,
eraginkorra da, baina, era berean, gogaikarriak.

651
00:31:30,750 --> 00:31:34,002
Erreakzionatu, baita Itzala
Dom, bi gauza lortuko duzu doan.

652
00:31:34,002 --> 00:31:35,710
Da eraginkorragoa delako
Itzala Dom du.

653
00:31:35,710 --> 00:31:37,210
Botila orrialde eguneratzen ari da.

654
00:31:37,210 --> 00:31:40,292
Ez da zuhaitz manipulazioa egiten.

655
00:31:40,292 --> 00:31:41,250
Eraginkortasuna lortu ahal izango dituzu.

656
00:31:41,250 --> 00:31:45,420
Halaber, erabilera erraza delako lortuko duzu
duzu orri osoa berridatzi bada besterik,

657
00:31:45,420 --> 00:31:48,970
baina badakizu, eskubidea, gauzak
dira nonbait orriko izango da.

658
00:31:48,970 --> 00:31:51,180
Beste leku bat izan zitekeen, baina
Honez orrian izango, ezta?

659
00:31:51,180 --> 00:31:52,860
Beraz, zuk besterik berriro errendatuko
ia osoa gauza,

660
00:31:52,860 --> 00:31:55,540
eta pare bat egin dezakezu
Orri beraren aldaketak.

661
00:31:55,540 --> 00:31:57,850
>> Beraz, berriro ere, MVC duzu
aukeratu behar luke

662
00:31:57,850 --> 00:32:01,840
erabilera eta eraginkortasuna erraztasuna artean,
eta erreakzionatu, biak lortzeko duzu.

663
00:32:01,840 --> 00:32:04,020
Beraz, hobe da.

664
00:32:04,020 --> 00:32:05,220
Zentzurik?

665
00:32:05,220 --> 00:32:06,676
Solidoa.

666
00:32:06,676 --> 00:32:12,080
>> Ados, beraz, ikus dezagun Hitz egin dezagun
4 urrats buruz pixka bat,

667
00:32:12,080 --> 00:32:14,740
nola osagaiak txertatzeko aukera izango dugu.

668
00:32:14,740 --> 00:32:16,260
Beraz, eskubide hori orain dugu.

669
00:32:16,260 --> 00:32:19,420
Gure cool apur botoia daukagu.

670
00:32:19,420 --> 00:32:23,157
Irauli ahal izango dugu atzera eta
dagozkio, eta hori da dena egiten du.

671
00:32:23,157 --> 00:32:24,990
Demagun nahi dugu
beste osagai bat dute.

672
00:32:24,990 --> 00:32:28,730
Demagun gure flashcard aplikazioa egin beharko lukete
Karta guztiak zerrenda bat eduki

673
00:32:28,730 --> 00:32:31,520
, dituzula beraz, horrek esan dugu
beste osagai bat izan beharko luke.

674
00:32:31,520 --> 00:32:32,970
Beno, agian zerrendan ikuspegi bat deitu du.

675
00:32:32,970 --> 00:32:36,200
Egin dezagun zerrendan ikuspegi hori
CardView elkarrekin bizi dira,

676
00:32:36,200 --> 00:32:39,680
eta zerrendan ikuspegi hau eta CardView
lana izango elkarrekin.

677
00:32:39,680 --> 00:32:43,190
Eta horiek konbinatu dezakezu
Gure aplikazioa egin dezakezu.

678
00:32:43,190 --> 00:32:45,160
>> Beraz, lehenik eta behin, dezagun bat
Bikote gehiago txartelak eskubidea.

679
00:32:45,160 --> 00:32:46,370
Demagun, zer txartelak?

680
00:32:46,370 --> 00:32:49,619

681
00:32:49,619 --> 00:32:51,910
Eta besterik ez, beraz, ez dut izan
aspertzeko idazten hasi zen,

682
00:32:51,910 --> 00:32:53,410
Besterik ez dut kopiatu, hemendik joan.

683
00:32:53,410 --> 00:33:01,664

684
00:33:01,664 --> 00:33:03,580
Eta orain noa ez
Epaileak txartel bakar bat emango da.

685
00:33:03,580 --> 00:33:06,910
Emateko karta sorta batekin noa.

686
00:33:06,910 --> 00:33:10,240
Beraz, lehenengo aplikazioak
oraingoz hautsi egingo da.

687
00:33:10,240 --> 00:33:14,717
Ondo da, beraz ari gara egiten joan
gai honi anitz txartelak kudeatzeko.

688
00:33:14,717 --> 00:33:17,800
Beraz, lehenik eta behin, ez gabiltza eman nahi ez joan,
besterik karta bat baina karta-sorta bat,

689
00:33:17,800 --> 00:33:18,700
txartelen zerrenda bat bezala.

690
00:33:18,700 --> 00:33:20,980
Eta, kasu honetan, horietako hiru behar dugu.

691
00:33:20,980 --> 00:33:27,280
>> Ondo da, beraz, aplikazioa da, beraz,
Zerrenda txartelak bat iritsi da,

692
00:33:27,280 --> 00:33:29,870
eta nik erabakitzen joan eta bertan
bata CardView erakusteko.

693
00:33:29,870 --> 00:33:33,740
CardView baino ezin
Epaileak txartel bat, baina aplikazioa errendatu

694
00:33:33,740 --> 00:33:37,610
Karta guztiak zerrenda bat lortzen da, ezta?

695
00:33:37,610 --> 00:33:40,820
>> Beraz, noiz irudikatu bat
txartelari CardView emateko,

696
00:33:40,820 --> 00:33:44,660
nola litzateke gai izatea asmatzen duzu
erabaki bat hartu behar duen txartela

697
00:33:44,660 --> 00:33:47,064
erakutsi?

698
00:33:47,064 --> 00:33:49,980
Iradokizun bat emateko, aldi baterako da
Zaizu txartela jakin bat ikustean.

699
00:33:49,980 --> 00:33:53,260
Orria eguneratu baduzu, ikusiko duzu
Joan besterik lehen txartela itzuli.

700
00:33:53,260 --> 00:33:55,464
Hori da, OK aldi baterako delako.

701
00:33:55,464 --> 00:33:56,630
Zer teknika erabil dezake?

702
00:33:56,630 --> 00:34:02,534

703
00:34:02,534 --> 00:34:08,760
>> Ikusleak: aldagai bat egin dezakezu
beraz aurrean izan duzun bezala.

704
00:34:08,760 --> 00:34:11,989
Hau da egia, ezin izan duzu
dute egungo txartela berdinen 1?

705
00:34:11,989 --> 00:34:14,150
>> NEEL Mehta: Bai, dugu, beraz,
Nahi egoera izan da, ezta?

706
00:34:14,150 --> 00:34:16,080
Egoera hau erabili beharko duzu ere
Osagai irudikatu nahi

707
00:34:16,080 --> 00:34:17,288
bertan txartela egin nahi dugu.

708
00:34:17,288 --> 00:34:19,290
Like zerrenda bat dugu
Karta guztiak, dizkizugu

709
00:34:19,290 --> 00:34:21,630
egoera erabili irudikatu nahi
lehen txartela bat,

710
00:34:21,630 --> 00:34:23,710
bigarren txartela, hirugarren txartela, eta abar.

711
00:34:23,710 --> 00:34:28,760
>> Beraz, aplikazio bat beraz, aplikazio bat iritsiko zaizu
getInitialState funtzioa dute,

712
00:34:28,760 --> 00:34:35,020
Funtzio getInitialState bueltan.

713
00:34:35,020 --> 00:34:39,929
Eta besterik ez dugu esango activeIndex 0.

714
00:34:39,929 --> 00:34:42,889
Beraz, gaur egun, gure aplikazioa da egungo egoera propioa du.

715
00:34:42,889 --> 00:34:47,179
>> Eta beraz, orain errendatuko, irudikatu
txartel bat, goazen besterik array

716
00:34:47,179 --> 00:34:49,969
eta har indize hartan gauza.

717
00:34:49,969 --> 00:34:53,580
Aukeratu txartela this.props.cards berdina
this.state.activeIndex.

718
00:34:53,580 --> 00:34:56,469

719
00:34:56,469 --> 00:35:00,162
Beraz, hemen ikusten duzun bezala, atrezzo eta
egoera benetan elkarrekin lan.

720
00:35:00,162 --> 00:35:08,990
Beraz, orain gure activeCard dugula,
bertan egingo dugu activeCard deitu,

721
00:35:08,990 --> 00:35:10,470
eta ikus dezagun lan egiten bada.

722
00:35:10,470 --> 00:35:20,320

723
00:35:20,320 --> 00:35:20,820
[INAUDIBLE]

724
00:35:20,820 --> 00:35:41,504

725
00:35:41,504 --> 00:35:44,900
>> Oh, hori testu akats bat egon da.

726
00:35:44,900 --> 00:35:45,400
Ah.

727
00:35:45,400 --> 00:35:51,420

728
00:35:51,420 --> 00:35:54,840
>> Cool, bai, beraz, orain itzuli ginen
non zeuden dugu, eskuinera?

729
00:35:54,840 --> 00:35:57,100
Same zahar programa ezik
orain onartzen dugu

730
00:35:57,100 --> 00:35:59,390
txartelen zerrenda bat, ez-txartel bakarrarekin.

731
00:35:59,390 --> 00:36:04,130
Eta orain, berriz ere, aldatzen baldin badugu
activeIndex, 0tik dezakegu 1 joateko,

732
00:36:04,130 --> 00:36:07,330
eta orain bigarren txartel hori,
eta, ondoren, joan 0 dugu.

733
00:36:07,330 --> 00:36:10,390
Beraz, hemen da berri bat
souped-up gure bertsio.

734
00:36:10,390 --> 00:36:16,000
>> Ados, beraz, gaur egun utzi dute zerrendan ikuspegi hori
programan karta guztiak erakusten ditu,

735
00:36:16,000 --> 00:36:19,980
beraz berri bat egin beharko dugu
Osagai Zerrenda-ikuspegia deitzen.

736
00:36:19,980 --> 00:36:22,155
Let Zerrenda-ikuspegia berdinen react.createClass.

737
00:36:22,155 --> 00:36:32,890

738
00:36:32,890 --> 00:36:38,800
Beraz desordenatuak ematera nahi dugu
zerrendako elementu bat txartela bakoitzean dagoen zerrendara.

739
00:36:38,800 --> 00:36:41,490
Eta beraz, karta-sorta bat dugu.

740
00:36:41,490 --> 00:36:44,990
Zerrendako elementu bat nahi dugu
Epaileak txartel bakoitzeko, ezta?

741
00:36:44,990 --> 00:36:47,490
Bat egin izan dugu begizta edo
Zerbait zerrendako elementu berri bat egin behar izan du.

742
00:36:47,490 --> 00:36:50,522
Baina bidea egiten duzu
Erreakzionatu, erabili mapa izeneko gauza bat.

743
00:36:50,522 --> 00:36:57,150
Mapa tresna bat edo erabiltzen duzun funtzioa da
duten elementu bakoitzerako, funtzio batzuk lantzen ditu,

744
00:36:57,150 --> 00:36:59,510
bueltan balioa hartzen du, eta
Atzera hori ematen dizu.

745
00:36:59,510 --> 00:37:06,310
>> Beraz, adibide gisa, array daukagu
1, 2, 3.map funtzio eta honek

746
00:37:06,310 --> 00:37:12,120
da bat takigrafia
funtzioa x gezi x aldiz x.

747
00:37:12,120 --> 00:37:16,110
Hau dio, zenbaki bakoitzean
1, 2, 3, hartu.

748
00:37:16,110 --> 00:37:17,800
Plazan bertan, eta eman atzera.

749
00:37:17,800 --> 00:37:22,090
Beraz, zer uste duzu 1,
2, 3.map x x aldiz doa

750
00:37:22,090 --> 00:37:25,480
x espalda eman duzu
Funtzio hau da,

751
00:37:25,480 --> 00:37:27,680
array duten elementu guztietan exekutatu.

752
00:37:27,680 --> 00:37:30,837

753
00:37:30,837 --> 00:37:32,190
>> Ikusleak: 1, 4 eta 9?

754
00:37:32,190 --> 00:37:35,709
>> NEEL Mehta: Yep, 1, 4, 9
1 aldiz 1 egiten duzulako.

755
00:37:35,709 --> 00:37:36,500
Hori bat ematen dizu.

756
00:37:36,500 --> 00:37:37,690
Hori lehen elementua da.

757
00:37:37,690 --> 00:37:38,530
>> 2 aldiz 2 4 da.

758
00:37:38,530 --> 00:37:39,570
Hori bigarren elementu bat da.

759
00:37:39,570 --> 00:37:40,310
3 aldiz 3 9 da.

760
00:37:40,310 --> 00:37:41,540
Hori hirugarren elementu bat da.

761
00:37:41,540 --> 00:37:42,640
Zentzurik?

762
00:37:42,640 --> 00:37:45,015
Beraz mapa teknika bat hartzen duzun bitartean
programatzaileak funtzionalean erabiltzea,

763
00:37:45,015 --> 00:37:48,090
estilo berri
zerbait egin behar programazio

764
00:37:48,090 --> 00:37:50,500
Zure zerrendan elementu bat behin.

765
00:37:50,500 --> 00:37:51,970
Eta, beraz, hau soinuak ezagutzen.

766
00:37:51,970 --> 00:37:53,370
Txartelen zerrenda bat daukagu.

767
00:37:53,370 --> 00:37:56,860
Zerrendako elementu bakoitzean lortu nahi dugu
bat, beraz, besterik ez dugu mapa erabili hemen.

768
00:37:56,860 --> 00:38:00,250
Esango dugu, zerrenda berdinen utzi
this.props, txartelak, mapa.

769
00:38:00,250 --> 00:38:10,580

770
00:38:10,580 --> 00:38:15,070
>> Eta, beraz, emandako txartel bat, ez gara
zerrendako elementu bat sortzen joan

771
00:38:15,070 --> 00:38:17,580
txartela duten edukiak albo batera.

772
00:38:17,580 --> 00:38:20,660
Dezagun esan out eman nahi dugu
Txartelak, beraz card.question zalantzan.

773
00:38:20,660 --> 00:38:24,990

774
00:38:24,990 --> 00:38:30,649
Beraz, zerrenda honetan daukan
LI edo Zerrenda elementuak sorta

775
00:38:30,649 --> 00:38:32,440
eta han zerrenda bat da
Epaileak txartel bakoitzean dagoen elementua,

776
00:38:32,440 --> 00:38:35,150
eta hori txartelak auzia dauka.

777
00:38:35,150 --> 00:38:37,640
Zentzurik?

778
00:38:37,640 --> 00:38:39,450
>> Cool, beraz, orain dezagun
benetan inprimatu dela.

779
00:38:39,450 --> 00:38:46,521
Beraz ul a itzultzeko aukera izango dugu.

780
00:38:46,521 --> 00:38:49,020
Orden gabeko zerrenda horren barruan,
besterik ez dugu makila zerrenda osoa

781
00:38:49,020 --> 00:38:49,890
eman dute hori.

782
00:38:49,890 --> 00:38:52,851

783
00:38:52,851 --> 00:38:53,350
Cool.

784
00:38:53,350 --> 00:38:56,060
>> Ondo da, beraz, gaur egun hau
zerrenda ikuspegian lan besterik aurkitu.

785
00:38:56,060 --> 00:38:59,842
Zerrendan ikuspegi buruzko edozein galdera?

786
00:38:59,842 --> 00:39:01,270
Karta-sorta bat duzu.

787
00:39:01,270 --> 00:39:02,800
Zerrendako elementu bat egiten duzun txartela egilea da.

788
00:39:02,800 --> 00:39:05,466
Eta horiek orden gabeko baten barruan jarri
zerrenda, eta emango dizu atzera.

789
00:39:05,466 --> 00:39:09,410
Beraz, gaur egun utzi jarduteko beraz txertatzen dugun
Gure app barruan honetan,

790
00:39:09,410 --> 00:39:14,310
beraz, hau egin ahal izango dugu, zerrenda ikuspegian.

791
00:39:14,310 --> 00:39:17,070
Zer argudioa ez ikuspegi zerrendara igaroko dugu?

792
00:39:17,070 --> 00:39:18,320
Zer propietate ez da gehiago?

793
00:39:18,320 --> 00:39:25,111

794
00:39:25,111 --> 00:39:26,860
Gogoratu, ematen bada
da karta-sorta bat,

795
00:39:26,860 --> 00:39:29,590
zerrenda egin beharko da
txartelak dituztenentzat ikusteko.

796
00:39:29,590 --> 00:39:32,267
Beraz, zer egingo pasatzen dugu
Hemen argumentu bezala?

797
00:39:32,267 --> 00:39:33,350
Ikusleak: txartelen zerrenda A?

798
00:39:33,350 --> 00:39:37,130
NEEL Mehta: Bai, txartelen orain
this.props.cards berdin, ezta?

799
00:39:37,130 --> 00:39:39,850

800
00:39:39,850 --> 00:39:44,370
Eta, beraz, arazo bakarra
da soilik duzula

801
00:39:44,370 --> 00:39:48,600
goi mailako elementu bat aktibatuta errendatu ere,
beraz, lortu duzun hura biltzeko div batean.

802
00:39:48,600 --> 00:39:49,100
Arraroa da.

803
00:39:49,100 --> 00:39:56,190

804
00:39:56,190 --> 00:39:57,530
Hargatik ikusten badu horrek.

805
00:39:57,530 --> 00:40:09,790

806
00:40:09,790 --> 00:40:10,560
Duten lan?

807
00:40:10,560 --> 00:40:29,774

808
00:40:29,774 --> 00:40:31,030
>> Bai, ez duzu joan.

809
00:40:31,030 --> 00:40:33,700
Beraz, orain zerrenda bat dugu
behealdean txartelak,

810
00:40:33,700 --> 00:40:36,180
eta, ondoren, gure daukagu
CardView bera gainean,

811
00:40:36,180 --> 00:40:40,486
eta haren arteko irauli egingo
Bi txartel aldeetan.

812
00:40:40,486 --> 00:40:42,610
Orain ez du zentzurik hori nola egin nuen?

813
00:40:42,610 --> 00:40:45,165

814
00:40:45,165 --> 00:40:46,790
Bai, beraz, berriro, bi osagai behar dugu.

815
00:40:46,790 --> 00:40:49,666
Lehenengo osagaia grabatuak
egindako zerrendako txartel bakoitzean.

816
00:40:49,666 --> 00:40:50,540
Hori zerrenda ikuspegian da.

817
00:40:50,540 --> 00:40:54,770
Eta bigarren osagai
inprimatzen txartela besterik ez dela.

818
00:40:54,770 --> 00:40:58,840
Epaileak txartel jakin bat ematen baduzu, bertan egingo
Epaileak txartel horri buruzko informazio inprimatu

819
00:40:58,840 --> 00:41:01,870
eta utzi atzera eta aurrera irauli duzu.

820
00:41:01,870 --> 00:41:05,850
>> Beraz, nahi badugu, saiatu eta eztabaida dezakegu
ezaugarri berri batzuk gehituz horri buruz.

821
00:41:05,850 --> 00:41:09,482
Bestela, pixka bat gehiago hitz egin ahal izango dugu
erreaktore abiaduraren buruz,

822
00:41:09,482 --> 00:41:11,190
edo erantzun ahal izango dugu
galdera izan ditzakezu

823
00:41:11,190 --> 00:41:15,050
dira horiek delako core zati guztiak
ren erreakzionatu buruz hitz egin nahi dut.

824
00:41:15,050 --> 00:41:16,540
Aurrera joan ahal izango dugu.

825
00:41:16,540 --> 00:41:17,590
Galderei erantzun ahal izango dugu.

826
00:41:17,590 --> 00:41:18,560
Nahi duzuna.

827
00:41:18,560 --> 00:41:21,694

828
00:41:21,694 --> 00:41:24,205
>> Publikoa: Ezin duzu erabili
JSX Javascript normal batean?

829
00:41:24,205 --> 00:41:27,150
Edo horrelako zerbait dela
[INAUDIBLE] etorri zen?

830
00:41:27,150 --> 00:41:30,760
>> NEEL Mehta: Galdera can da
JSX erabili duzu Javascript normal batekin?

831
00:41:30,760 --> 00:41:32,620
Erantzuna da bai.

832
00:41:32,620 --> 00:41:41,070
JSX besterik ez da modu bat, zure hartzen
Ikusteko Javascript-a duela HTML horren barruan,

833
00:41:41,070 --> 00:41:44,215
eta biltzen du JavaScript sartu da
ez du HTML dute, horren barruan.

834
00:41:44,215 --> 00:41:47,880
Beraz, konturatu -bere orain konturatu hemen.

835
00:41:47,880 --> 00:41:50,820
Badirudi div atsegin dute gusta
eta, horren barruan stuff duzu.

836
00:41:50,820 --> 00:41:54,970
>> Hori JavaScript to biltzen
bezalako gauza bera sortzen.

837
00:41:54,970 --> 00:41:59,590
Esaten dudana da asmatzen dut
JSX da besterik sintaktiko bat, hura bezala

838
00:41:59,590 --> 00:42:03,530
Javascript aurreprozesadorearen bat askoz
PHP bezalako HTML aurreprozesadorearen bat da.

839
00:42:03,530 --> 00:42:05,490
JSC aurreprozesadorearen da
Ikusteko Javascript-a egiteko aukera ematen dizu

840
00:42:05,490 --> 00:42:12,970
HTML jarri duzu zure Javascript-barrutik.

841
00:42:12,970 --> 00:42:16,425
Eta beraz, eskuineko transformatua baldin baduzu
bertan [INAUDIBLE] izeneko gauza bat da,

842
00:42:16,425 --> 00:42:17,300
bertan egingo eraldatzeko.

843
00:42:17,300 --> 00:42:19,360
Eskuineko aurreprozesadorearen,
hori egiten utzi egingo da.

844
00:42:19,360 --> 00:42:20,235
>> Ikusleak: [INAUDIBLE]

845
00:42:20,235 --> 00:42:23,026
NEEL Mehta: Normalean ez duzu
HTML jarri Javascript-barrutik

846
00:42:23,026 --> 00:42:24,110
Erreakzio zure kulpa ezean.

847
00:42:24,110 --> 00:42:27,146
Baina hala ere egin dezakezu.

848
00:42:27,146 --> 00:42:27,645
Bai?

849
00:42:27,645 --> 00:42:29,353
>> Ikusleak: duzula uste dut
deskribatu zuen erreakzionatu

850
00:42:29,353 --> 00:42:31,970
programing hizkuntza funtzional gisa.

851
00:42:31,970 --> 00:42:35,646
Izan ikasteko ditugu C CS50.

852
00:42:35,646 --> 00:42:38,032
Da, halaber, C lengoaia funtzional bat?

853
00:42:38,032 --> 00:42:39,990
NEEL Mehta: Beraz, galdera
funtzionala ingurukoa da

854
00:42:39,990 --> 00:42:43,010
izeneko beste gauza versus
inperatibo edo prozedura-programazioa.

855
00:42:43,010 --> 00:42:44,820
Bi programa herrikoi mota dago.

856
00:42:44,820 --> 00:42:48,550
One izeneko prozedura-, bertan
guztiak commands egiten bezalakoa da, gutxi gorabehera,

857
00:42:48,550 --> 00:42:51,510
eta inork dabil, eta hori guztia
funtzio izatea eta beharrik buruz

858
00:42:51,510 --> 00:42:52,930
sarrera eta horien irteera.

859
00:42:52,930 --> 00:42:55,930
Erreakzionatu paradigma funtzionala da.

860
00:42:55,930 --> 00:42:58,010
C oso prozedura-paradigma bat da.

861
00:42:58,010 --> 00:43:02,360
>> Eta adibide gisa, C adibidez,
ez baduzu, egin bide deklaratiboa honetan

862
00:43:02,360 --> 00:43:04,390
programan egiten, ezta?

863
00:43:04,390 --> 00:43:06,826
Esan behar duzu, inprimatu honetan.

864
00:43:06,826 --> 00:43:07,950
Datu egitura aldatu.

865
00:43:07,950 --> 00:43:08,530
Inprimatu honetan.

866
00:43:08,530 --> 00:43:10,160
Dena da komandoei buruz.

867
00:43:10,160 --> 00:43:12,640
>> Erreakzionatu, ez dago ez
komando asko.

868
00:43:12,640 --> 00:43:15,145
Guztiak izatea
osagaiak elkarrekin jartzen.

869
00:43:15,145 --> 00:43:16,300
Funtzio bezala ari dira.

870
00:43:16,300 --> 00:43:26,360
Funtzio bat bezala duzu
CardView deitzen,

871
00:43:26,360 --> 00:43:28,680
bertan funtzioa da
sarrera, irteera ditu,

872
00:43:28,680 --> 00:43:30,660
eta beraz, erreakzionatu guztiak
filosofia honi buruz

873
00:43:30,660 --> 00:43:32,700
gurekin having-- datuak duzu.

874
00:43:32,700 --> 00:43:34,910
Da hau pasatzen duzu
bildu, eta bertan egingo

875
00:43:34,910 --> 00:43:36,800
irteera HTML duzula
besterik orrialde inprimatuta,

876
00:43:36,800 --> 00:43:39,180
eta beraz, zuk
eraiki pieza pieza.

877
00:43:39,180 --> 00:43:42,800
>> Beraz, metafora bat marraztu zer
Lehen esan dudan, badakizu nola

878
00:43:42,800 --> 00:43:47,050
Facebook bada mezu bat lortuko duzu,
eta zer zati eguneratu aukeratu duzu,

879
00:43:47,050 --> 00:43:47,882
duten prozedurazko da.

880
00:43:47,882 --> 00:43:48,840
Da inperatibo da, ezta?

881
00:43:48,840 --> 00:43:49,806
Ados, mezu bat jaso nuen.

882
00:43:49,806 --> 00:43:50,930
Alda dezagun kontu han.

883
00:43:50,930 --> 00:43:52,110
>> Dezagun pop leiho bat hemen.

884
00:43:52,110 --> 00:43:52,780
Alda dezagun kontu han.

885
00:43:52,780 --> 00:43:53,700
Marraztu dezagun hau hemen.

886
00:43:53,700 --> 00:43:55,220
Hori prozedurazko hurbilketa bat da.

887
00:43:55,220 --> 00:44:00,240
>> Hau da, zer gauza Angeluen bezala,
Altza, Backbone, beste esparruak erabiltzea.

888
00:44:00,240 --> 00:44:01,200
Erreakzionatu funtzionala da.

889
00:44:01,200 --> 00:44:03,324
Oso bestelako modu bat da
ren gauzak pentsatzen.

890
00:44:03,324 --> 00:44:07,950
Ditzagun ideia hau hartzen du
funtzio algoritmorikerabiltzen izango duzula

891
00:44:07,950 --> 00:44:08,800
datuak ematen ditu.

892
00:44:08,800 --> 00:44:11,820
Txu egiten duzue zer da
izan behar du, eta ordenagailua

893
00:44:11,820 --> 00:44:13,490
arduratuko da egindako pisatzen.

894
00:44:13,490 --> 00:44:15,890
Zuk ez duzu kudeatzeko it yourself.

895
00:44:15,890 --> 00:44:18,470
Ez duela zentzurik pixka bat?

896
00:44:18,470 --> 00:44:18,970
Bai?

897
00:44:18,970 --> 00:44:24,180
>> Ikusleak: hizkuntza funtzional batean,
dena aldi berean gertatzen da?

898
00:44:24,180 --> 00:44:26,800
>> NEEL Mehta: Ez, gauzak ordenan gertatuko.

899
00:44:26,800 --> 00:44:29,320
Hemen bezala, ez da oraindik
aginduko, baina ez du

900
00:44:29,320 --> 00:44:32,390
ordenaren arabera gertatuko bezalako
Gommendatzen, komando, komandoa.

901
00:44:32,390 --> 00:44:36,459
Gertatzen diren ordenan It
funtzio irteera ematen dizu.

902
00:44:36,459 --> 00:44:37,750
Jarri duten funtzio beste.

903
00:44:37,750 --> 00:44:39,550
Jarri duten beste sartu
funtzioa, funtzio beste.

904
00:44:39,550 --> 00:44:41,470
>> Egin duzu CS51 bada, ikusiko duzu
programak funtzionala ikasi

905
00:44:41,470 --> 00:44:42,886
honen esparrutik kanpo apur bat.

906
00:44:42,886 --> 00:44:45,090
Baina, batez ere, zer egiten du
Erreakzionatu cool da bakarra

907
00:44:45,090 --> 00:44:46,840
Bat-modu datuen fluxua
eta Dom birtualean,

908
00:44:46,840 --> 00:44:48,700
baina, aldi berean, ideia hau
programazio funtzionala.

909
00:44:48,700 --> 00:44:51,720
Eta programazio funtzionala oso erraza da
konposatzen eta cool stuff egiteko daudelarik,

910
00:44:51,720 --> 00:44:53,844
eta oso erraza da pentsatzea
buruz arrazoirik buruz eta.

911
00:44:53,844 --> 00:44:55,450
Beraz, beste erreakzionatu zozketa ona da.

912
00:44:55,450 --> 00:44:58,489

913
00:44:58,489 --> 00:44:59,280
Edozein zalantza gehiago?

914
00:44:59,280 --> 00:45:02,650

915
00:45:02,650 --> 00:45:03,150
Bai?

916
00:45:03,150 --> 00:45:06,840
>> Ikusleak: Um, zergatik egiten duzun
erabiltzea var ez bezala?

917
00:45:06,840 --> 00:45:10,450
>> NEEL Mehta: Beraz, galdera da
zergatik ez var ordez utzi erabili duzu?

918
00:45:10,450 --> 00:45:13,220
Hau izeneko gauza bat da
ES6 edo ECMAScript 6.

919
00:45:13,220 --> 00:45:15,820
Ikusteko Javascript-a bertsio berri da.

920
00:45:15,820 --> 00:45:19,050
Ez dago arrazoi teknikorik sorta bat da,
Baina gatozen var bertsio hobea da.

921
00:45:19,050 --> 00:45:20,724
>> It aldagaiak deklaratzeko duzu.

922
00:45:20,724 --> 00:45:21,390
Utzi erabil dezakezu.

923
00:45:21,390 --> 00:45:22,140
Var erabili ahal izango duzu.

924
00:45:22,140 --> 00:45:23,825
Let tekniko mordo bat du
reasons-- horiek begiratu dezakezu

925
00:45:23,825 --> 00:45:25,610
geroago sortu zergatik hobe da.

926
00:45:25,610 --> 00:45:28,780
Funtsean, ES6 ditu polit batzuk
sintaxia, ezaugarri berri batzuk

927
00:45:28,780 --> 00:45:30,720
zaharra Javascript gainean.

928
00:45:30,720 --> 00:45:32,782
>> Beraz, bost minutu atsegin dugu.

929
00:45:32,782 --> 00:45:34,990
Nahi nuen buruz hitz egiteko
Gauza bat gehiago benetako azkar.

930
00:45:34,990 --> 00:45:36,450
Edozein zalantza izan ezkero,
horretaz hitz egin, honen ondoren utzi.

931
00:45:36,450 --> 00:45:38,366
Baina besterik ez, beraz, hau lortzen
kamera harrapatu, besterik ez dut

932
00:45:38,366 --> 00:45:41,550
nola buruz pixka bat hitz egin nahi
benetan erabili zure aplikazioak erreakzionatu.

933
00:45:41,550 --> 00:45:47,220

934
00:45:47,220 --> 00:45:58,640
>> Hemen joanez gero,
Facebook.GitHub.IO/react,

935
00:45:58,640 --> 00:46:03,320
honen etxeko erreakzionatu orria da, eta
benetan nola erabiltzen diren erakutsiko da

936
00:46:03,320 --> 00:46:05,320
Zure orrietan erreakzionatu.

937
00:46:05,320 --> 00:46:08,845
Funtsean, pixka bat da
konplikatua instalatzeko erreakzionatu nahian.

938
00:46:08,845 --> 00:46:12,300
Ez da erraza arrastatu bezala besterik ez duzu
eta askatu Javascript bat han ere.

939
00:46:12,300 --> 00:46:15,890
>> Zure transformatua izan behar duzu
sortu, hau da, aurretik egin bezala,

940
00:46:15,890 --> 00:46:18,120
Buelta zure JSX sartu
Javascript normala.

941
00:46:18,120 --> 00:46:21,030
Dute gauza izango duzula
konpilatu ES6 normaltasunera duzu.

942
00:46:21,030 --> 00:46:24,720
Javascript han mugitzen asko da
zati egin behar duzu, beraz, ez dago gauza bat da

943
00:46:24,720 --> 00:46:27,200
Yeoman, Yeoman.io deitzen.

944
00:46:27,200 --> 00:46:31,110
Eta honek komando lerroko tresna bat da, hori izango
taulatu duzu zure erreakzionatu laguntzeko

945
00:46:31,110 --> 00:46:32,380
proiektuen erraz.

946
00:46:32,380 --> 00:46:38,660
>> Beraz, honi buruz irakurri dezakezu
geroago, baina badaude tresna batzuk

947
00:46:38,660 --> 00:46:40,160
Yeoman hori eskaintzen.

948
00:46:40,160 --> 00:46:43,280
A erreakzionatu sortzen duzunean utzi egingo dute
eraikitako guztia aplikazioa.

949
00:46:43,280 --> 00:46:46,030
Eraiki egingo dute Like
ere, osagaiak eraikia.

950
00:46:46,030 --> 00:46:47,880
Ahal izango da zure transformatua eraikia.

951
00:46:47,880 --> 00:46:50,699
Cool asko izan dute
stuff eraiki automatikoki

952
00:46:50,699 --> 00:46:52,240
Gauza horiek generadoreak, esate baterako.

953
00:46:52,240 --> 00:46:54,620
>> Beraz honi buruz irakurri nahi izanez gero.

954
00:46:54,620 --> 00:46:59,110
Just Yeoman, Y-E-O-M-A-N, eta joan
Horrelako generadoreak aurkitu dezakezu.

955
00:46:59,110 --> 00:47:01,263
Eta atsegin sorgailuak
horiek, nahi besterik ez duzu bat

956
00:47:01,263 --> 00:47:03,010
pare komando lerroa komandoak.

957
00:47:03,010 --> 00:47:05,530
Taulatu egindako egingo da bat
osoa aplikazioa erreakzionatu duzu.

958
00:47:05,530 --> 00:47:10,470
Eskuzko hoditeria guztiak jasoko ditu,
eta zuretzat Grunt lan egin,

959
00:47:10,470 --> 00:47:13,010
eta hau dela eta, arreta jarri besterik ez duzu
besterik idazten erreakzionatzen.

960
00:47:13,010 --> 00:47:16,739
>> Beraz, funtsean eraikitzeko a
Erreakzionatu aplikazioa nontrivial da.

961
00:47:16,739 --> 00:47:19,530
Honez kable guztiak elkarrekin, baina ez dago
Hori da guk egingo dituzu tresnak dira.

962
00:47:19,530 --> 00:47:23,070
Beraz, egin nahi izanez gero bat erreakzionatu
Aplikazio, saiatu da bide hori egiten.

963
00:47:23,070 --> 00:47:26,360
Esperimentu besterik nahi ez badu,
CodePen hau erabili ahal izango duzu

964
00:47:26,360 --> 00:47:28,550
CodePen honetako duelako
guztiek erreakzionatu kableatuaren.

965
00:47:28,550 --> 00:47:30,240
Egin dut lan guztia zuretzat dagoeneko.

966
00:47:30,240 --> 00:47:34,610
>> Beraz, nahi bat bezala egin nahi baduzu
ekoizpen erreakzionatu aplikazioa askatzeko,

967
00:47:34,610 --> 00:47:37,220
saiatu generadoreak horietako bat.

968
00:47:37,220 --> 00:47:40,240
Jolastu besterik nahi ez baduzu
inguruan, askotan merezi besterik ez da

969
00:47:40,240 --> 00:47:44,490
atsegin saiatu inguruan jolasten hemen CodePen orrian.

970
00:47:44,490 --> 00:47:45,470
Soinu ona?

971
00:47:45,470 --> 00:47:45,970
Cool.

972
00:47:45,970 --> 00:47:47,890
>> Beraz, hori da dena daukat.

973
00:47:47,890 --> 00:47:52,470
Berriz ere, kode eta adibide guztiak dira
Web orri honetan izango da hemen.

974
00:47:52,470 --> 00:47:55,509
Beraz, berriro ere, ez genuen hitz egin
buruz erreakzionatu sintaxia askoz,

975
00:47:55,509 --> 00:47:57,550
baina horiek guztiak aurkitu
Xehetasun sintaktiko gutxi,

976
00:47:57,550 --> 00:48:00,320
hori guztia, eskuragarri izango da
Webgune hau hemen.

977
00:48:00,320 --> 00:48:02,660
>> Beraz, nahi nuke gomendatuko
lehen urratsa.

978
00:48:02,660 --> 00:48:06,277
Jarri da zure CodePen sartu.

979
00:48:06,277 --> 00:48:08,110
Saiatu dadin lanean
Bigarren urratsa da.

980
00:48:08,110 --> 00:48:11,310
Ez dago laugarren urrats bat da, eta besterik ez
Begira non horretatik lortuko duzu.

981
00:48:11,310 --> 00:48:14,840
>> Galdera gehiago, check
Orri horretan egindako edo bidali mezu bat.

982
00:48:14,840 --> 00:48:16,490
Hori da nire posta elektronikoa da.

983
00:48:16,490 --> 00:48:19,885
Baina lagundu nahi duen batera Maite nuen
baliteke buruzko galdera erreakzionatu.

984
00:48:19,885 --> 00:48:21,010
Beraz, bai, hori da dena daukat.

985
00:48:21,010 --> 00:48:23,410
Eskerrik asko guztioi asko egiteko
behaketa edo parte hartzeko.

986
00:48:23,410 --> 00:48:26,820
Eta edozein zalantza hartuko dut
honen ondoren baliteke daukate jada.

987
00:48:26,820 --> 00:48:29,140
Beraz, eskerrik asko guztia ikusten da.

988
00:48:29,140 --> 00:48:31,270