1
00:00:00,000 --> 00:00:02,910
>> [Daqq tal-mużika]

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

3
00:00:04,850 --> 00:00:07,275
>> Neel Mehta: Hawnhekk tmur.

4
00:00:07,275 --> 00:00:11,070
>> Well, kulħadd, merħba lill web
apps tal-ġejjieni ma 'React.

5
00:00:11,070 --> 00:00:11,870
Dan huwa CS50.

6
00:00:11,870 --> 00:00:12,930
Jisimni Neel.

7
00:00:12,930 --> 00:00:17,689
I'ma TA għat CS50 u sophomore
fil-Harvard College u ħafna, ħafna

8
00:00:17,689 --> 00:00:18,730
web iżviluppatur passjonat.

9
00:00:18,730 --> 00:00:20,730
Hekk jien eċċitanti ħafna li
jkun jitkellem lilek llum,

10
00:00:20,730 --> 00:00:24,550
jekk int hawn jew id-dar
jaraw, dwar Ikkummenta, li huwa, għal darb'oħra

11
00:00:24,550 --> 00:00:27,270
kif għidt, il-futur ta 'apps web.

12
00:00:27,270 --> 00:00:29,055
>> Allura Jirreaġixxu huwa qafas web.

13
00:00:29,055 --> 00:00:30,930
U kif stajt ġiet javżak
li xi nies hawn,

14
00:00:30,930 --> 00:00:33,400
qafas huwa biss
sett ta 'għodod tista' tuża

15
00:00:33,400 --> 00:00:35,770
biex jistrutturaw u jibnu app web tiegħek.

16
00:00:35,770 --> 00:00:39,010
U apps web huma, għal darb'oħra, websajts
li huma interattivi bħal Facebook,

17
00:00:39,010 --> 00:00:42,330
Twitter.com, Instagram.com, tkun xi tkun.

18
00:00:42,330 --> 00:00:45,590
>> Allura Facebook huwa qafas web
li ġie żviluppat mill Facebook

19
00:00:45,590 --> 00:00:48,060
ftit snin back-- jirreaġixxu hu.

20
00:00:48,060 --> 00:00:50,830
Huwa dakinhar ġiet użata fil
Facebook fuq apps mobbli tagħhom

21
00:00:50,830 --> 00:00:52,460
u l-web app, Instagram.

22
00:00:52,460 --> 00:00:56,350
Khan Akkademja hija ieħor
jadottahom bikrija prominenti ta jirreaġixxu.

23
00:00:56,350 --> 00:00:58,630
>> Huwa verament kien jkollna
popolari ħafna.

24
00:00:58,630 --> 00:01:03,420
Jekk inti qatt tuża affarijiet simili angolari jew
Sinsla, dan huwa ta 'l-istess familja,

25
00:01:03,420 --> 00:01:05,830
iżda peress ħafna
tiskorri popolarità tagħhom.

26
00:01:05,830 --> 00:01:06,890
Hu l-ħaġa ġdida sħun.

27
00:01:06,890 --> 00:01:09,590
Huwa tassew, tassew kbir.

28
00:01:09,590 --> 00:01:13,470
>> U għalhekk Jirreaġixxu hija tajba mhux biss bħala
qafas web għall-interkonnessjonijiet tal-bini.

29
00:01:13,470 --> 00:01:16,020
Huwa tajjeb għall-bini interfaces web.

30
00:01:16,020 --> 00:01:18,350
Hemm ukoll xi ħaġa
imsejħa Jirreaġixxu Native li

31
00:01:18,350 --> 00:01:22,200
ihallik tibni interfaces
għall Android u IOS

32
00:01:22,200 --> 00:01:26,390
u pjattaformi forsi oħra fil-futur
bl-użu biss l-istess kodiċi JavaScript.

33
00:01:26,390 --> 00:01:31,130
Inti tista 'tuża l-istess eżatt
Kodiċi JavaScript biex tirrendi websajts,

34
00:01:31,130 --> 00:01:33,040
sabiex tirrendi apps Android u IOS apps.

35
00:01:33,040 --> 00:01:35,000
>> Huwa żmien ħafna, ferm eċċitanti.

36
00:01:35,000 --> 00:01:37,070
Hija opportunità tassew, tassew jibred.

37
00:01:37,070 --> 00:01:42,020
Huwa tassew web universali
għodda ta 'żvilupp interface,

38
00:01:42,020 --> 00:01:44,420
hekk huwa ħafna, ħafna
Ħaġa importanti li tkun taf.

39
00:01:44,420 --> 00:01:46,949
U, kif kien tinforma lin-nies
qabel, dan, naħseb,

40
00:01:46,949 --> 00:01:48,990
se bidla kif aħna
jibnu apps web dejjem.

41
00:01:48,990 --> 00:01:55,820
Allura huwa forsi daqsxejn hyperbole, imma I
naħsibx li huwa ħaġa pjuttost tajba li tkun taf.

42
00:01:55,820 --> 00:01:57,580
>> OK, iva, liema huwa jirreaġixxu?

43
00:01:57,580 --> 00:02:01,020
Jirreaġixxu huwa qafas tista '
użu għall interfaces bini.

44
00:02:01,020 --> 00:02:03,240
Interface huwa, għal darb'oħra,
web page, right?

45
00:02:03,240 --> 00:02:06,340
Allura hawnhekk Instagram.com, użi jirreaġixxu.

46
00:02:06,340 --> 00:02:08,740
>> Jirreaġixxu hija mibnija fuq il-
idea ta 'komponenti.

47
00:02:08,740 --> 00:02:11,900
Komponent hija HTML
element fuq sterojdi,

48
00:02:11,900 --> 00:02:14,470
hekk element HTML huwa bħal buttuna.

49
00:02:14,470 --> 00:02:15,250
Huwa paragrafu.

50
00:02:15,250 --> 00:02:17,500
Huwa header, id-dritt?

51
00:02:17,500 --> 00:02:22,740
U Instagram se jużaw dawn, iżda
se tuża wkoll komponenti ta 'React.

52
00:02:22,740 --> 00:02:25,740
>> Jirreaġixxu komponenti huma
Elementi souped-up HTML

53
00:02:25,740 --> 00:02:28,100
li għandhom imġieba tagħhom stess
inkluża fihom.

54
00:02:28,100 --> 00:02:31,800
Għalhekk, bħala eżempju, jista 'jkollna
element żmien, komponent żmien,

55
00:02:31,800 --> 00:02:34,095
li se jkun fiha bħal
it-timbru ħin, tafu,

56
00:02:34,095 --> 00:02:37,170
komponent profil li
se jkun fiha l-immaġni profil

57
00:02:37,170 --> 00:02:38,820
u l-isem tal-persuna.

58
00:02:38,820 --> 00:02:42,930
Huwa jista 'jkollhom counter simili, li
jista 'joqgħod bħan-numru ta' jħobb,

59
00:02:42,930 --> 00:02:45,610
u jekk tikklikkja fuqha, dan ser
jiżdied in-numru ta 'ħwejjeġ bħal dawn.

60
00:02:45,610 --> 00:02:48,200
Komponent hija biss
mazz ta 'HTML code li

61
00:02:48,200 --> 00:02:50,520
għandha xi funzjonalità
mgeżwra ġewwa ta 'dan.

62
00:02:50,520 --> 00:02:53,770
Allura huwa simili element HTML
fuq sterojdi, kif għidt qabel.

63
00:02:53,770 --> 00:02:56,270
Tista 'tieħu dawn il-komponenti,
u inti tista 'tpoġġihom flimkien

64
00:02:56,270 --> 00:02:59,060
li jagħmlu komponenti ġodda, b'mod
F'dan il-każ, komponent post,

65
00:02:59,060 --> 00:03:00,505
li fih dan kollu Jittieħed.

66
00:03:00,505 --> 00:03:04,050
Ikun fiha Time, Profil,
LikeCounter, forsi l-kumment

67
00:03:04,050 --> 00:03:06,100
u forsi l-immaġni innifsu.

68
00:03:06,100 --> 00:03:10,810
U hekk apps web huma biss mibnija billi jittieħed
komponenti u jqiegħduhom flimkien.

69
00:03:10,810 --> 00:03:15,620
An għalf Instagram huwa xejn aktar minn
mazz ta 'postijiet wieħed wara l-oħra,

70
00:03:15,620 --> 00:03:19,032
kull post fih bħall-Time,
Profil, LikeCounter, u l-bqija.

71
00:03:19,032 --> 00:03:20,490
Huwa tip ta 'bħal bini ta' dar.

72
00:03:20,490 --> 00:03:22,660
Inti ma jibnu l
house mill-top down.

73
00:03:22,660 --> 00:03:24,960
Għandek tieħu components-- inti
jieħdu l-istess kamra tal-banju.

74
00:03:24,960 --> 00:03:28,320
Tieħu l-bedroom-- inti twaħħal minnhom
flimkien, u inti għandek komponent ġdid.

75
00:03:28,320 --> 00:03:29,760
Għandek parti l-ġdida tad-dar.

76
00:03:29,760 --> 00:03:32,860
>> Allura jirreaġixxu hija kollha mibnija madwar
din l-idea ta 'komponenti li

77
00:03:32,860 --> 00:03:36,600
huma interattivi, li huma ta 'dikjarazzjoni.

78
00:03:36,600 --> 00:03:39,650
Bħalek biss jgħidu dak
profil huwa, u dan tagħmlu.

79
00:03:39,650 --> 00:03:40,600
Huma komponibbli.

80
00:03:40,600 --> 00:03:43,880
Inti tista 'tieħu żmien u profil, tpoġġi
flimkien, jagħmlu xi ħaġa aħjar.

81
00:03:43,880 --> 00:03:47,770
U dawn qed jerġgħu jintużaw, hekk jekk inti
għandhom il-kodiċi tas-sors għal post,

82
00:03:47,770 --> 00:03:49,440
inti tista ssodata li kullimkien.

83
00:03:49,440 --> 00:03:53,160
>> Inti tista ssodata Instagram
ħaġa fuq il-websajt tiegħek stess.

84
00:03:53,160 --> 00:03:56,830
Tista 'ssodata fl Facebook, per eżempju,
sakemm juża jirreaġixxu ukoll.

85
00:03:56,830 --> 00:04:00,360
Allura komponenti huma tassew, tassew, tassew
blokki tal-bini qawwija ta 'l-internet

86
00:04:00,360 --> 00:04:04,180
li jistgħu jintużaw kullimkien u mqiegħda
flimkien biex jagħmlu blokki tal-bini ġodda.

87
00:04:04,180 --> 00:04:07,159
Dik hija l-ħafna, ħafna
ħarsa ġenerali ta 'livell għoli.

88
00:04:07,159 --> 00:04:09,200
Allura, għal darb'oħra, jekk għandek
xi mistoqsijiet fi kwalunkwe punt

89
00:04:09,200 --> 00:04:14,470
dwar il-filosofija ta 'reattur, il-
kodifikazzjoni, li tieqaf lili, u let me know.

90
00:04:14,470 --> 00:04:18,420
>> OK, so jirreaġixxu huwa jibred minħabba li
għandu mod differenti ta 'tħares

91
00:04:18,420 --> 00:04:19,870
lejn kif inti tibni apps web.

92
00:04:19,870 --> 00:04:23,620
You ħadthom probabbilment jinstemgħu ta MVC, a
mudell inti kontroll fil CS50 jew kwalunkwe

93
00:04:23,620 --> 00:04:25,940
klassijiet probing tuża ieħor.

94
00:04:25,940 --> 00:04:29,000
U ħafna oqfsa huma
mibnija madwar l-idea ta 'MVC.

95
00:04:29,000 --> 00:04:30,410
Jirreaġixxu mhuwiex.

96
00:04:30,410 --> 00:04:32,980
Jirreaġixxu hija mibnija madwar l-idea
tal-fluss data unidirezzjonali

97
00:04:32,980 --> 00:04:36,510
kif jidher minn din it-tabella jew grafika hawn.

98
00:04:36,510 --> 00:04:38,260
>> Bażikament, inti għandek sors ta 'data.

99
00:04:38,260 --> 00:04:42,380
U s-sors tad-data se tiddeċiedi
kif jistabbilixxu ċerti komponenti.

100
00:04:42,380 --> 00:04:45,452
U l-komponenti se
allura, meta dawn jinbidlu,

101
00:04:45,452 --> 00:04:47,160
dawn se jgħidulek l
sors ta 'data għall-bidla.

102
00:04:47,160 --> 00:04:49,350
>> Biex tuża l-Instagram
eżempju, inti jista 'jkollok

103
00:04:49,350 --> 00:04:52,050
lista ta 'oġġetti postali bħall
f'database jew xi ħaġa.

104
00:04:52,050 --> 00:04:53,310
Li d-dejta.

105
00:04:53,310 --> 00:04:57,600
U mbagħad komponenti post tagħna
se jieħdu dik id-data,

106
00:04:57,600 --> 00:05:01,830
u juża dak id-data li tirrendi
ħaġa fuq l-iskrin.

107
00:05:01,830 --> 00:05:04,300
Dak hu l-vleġġa
minn data li komponent huwa,

108
00:05:04,300 --> 00:05:07,930
u mbagħad hija użata l-istess data
li tirrendi mazz ta 'komponenti.

109
00:05:07,930 --> 00:05:10,290
>> Fil Facebook Messenger, għal
Eżempju, li huwa jirreaġixxu,

110
00:05:10,290 --> 00:05:13,410
inti jista 'jkollhom lista ta
messaġġi bħal għajn ta 'data tiegħek.

111
00:05:13,410 --> 00:05:15,927
U li jirrendi mhux
biss il-lista ta 'messaġġi

112
00:05:15,927 --> 00:05:17,510
iżda wkoll il-lista ta 'ħbieb għandek.

113
00:05:17,510 --> 00:05:19,200
Inti għandek l-għadd unread.

114
00:05:19,200 --> 00:05:23,330
Forsi tagħmlu wkoll ħaġa Facebook
dak l fil-qiegħ tal Facebook.com.

115
00:05:23,330 --> 00:05:25,610
L-istess data hija
sors wieħed ta 'verità

116
00:05:25,610 --> 00:05:28,290
u li tikkawża ħafna ta '
komponenti li għandhom jiġu mogħtija.

117
00:05:28,290 --> 00:05:30,290
U kull meta wieħed minn dawk
komponenti jinbidel,

118
00:05:30,290 --> 00:05:32,320
din tmur lura u
bidliet s-sors tad-data.

119
00:05:32,320 --> 00:05:33,460
>> Għandek tibgħat messaġġ, id-dritt?

120
00:05:33,460 --> 00:05:34,780
Li l-bidliet is-sors tad-data.

121
00:05:34,780 --> 00:05:39,490
Inti taqra messaġġi tiegħek,
sabiex tissettja unread għal 0.

122
00:05:39,490 --> 00:05:41,136
Li l-bidliet is-sors tad-data.

123
00:05:41,136 --> 00:05:44,010
U tinnota li dawn kollha ta 'wieħed
vleġġa tmur lura għall-istess data

124
00:05:44,010 --> 00:05:47,662
sors, sabiex inti tkun taf,
minħabba ċertu sett ta 'data,

125
00:05:47,662 --> 00:05:49,870
inti taf eżattament dak li l-
paġna se look like.

126
00:05:49,870 --> 00:05:50,700
Huwa deterministic.

127
00:05:50,700 --> 00:05:53,451
You know, ċerta data mogħtija, liema
il-paġna se look like.

128
00:05:53,451 --> 00:05:56,158
Inti jista 'jbassar kif li għaddej biex
iġibu ruħhom u kif l-affarijiet sejrin

129
00:05:56,158 --> 00:05:57,650
biex jaħdmu meta jkunu qed jitpoġġew flimkien.

130
00:05:57,650 --> 00:06:00,410
>> U jekk kelli miljun komponenti
hawnhekk, ikun jaġixxi l-istess, id-dritt?

131
00:06:00,410 --> 00:06:02,290
Inti ma jkollha ebda
interkonnessjonijiet stramb.

132
00:06:02,290 --> 00:06:04,120
Data Wieħed mogħtija miljun komponenti.

133
00:06:04,120 --> 00:06:06,879
A miljun komponenti jista
mur lura u jeditjaw l-informazzjoni.

134
00:06:06,879 --> 00:06:07,920
U għalhekk dan huwa sabiħ ħafna.

135
00:06:07,920 --> 00:06:10,870
Aħna bini komponibbli,
faċilment apps web skalabbli.

136
00:06:10,870 --> 00:06:13,150
>> Inti għandek sors ta 'data waħda,
is-sors tal-verità.

137
00:06:13,150 --> 00:06:15,790
Li tg komponenti tiegħek
kif jistabbilixxu l-paġna,

138
00:06:15,790 --> 00:06:18,190
u l-komponenti se
manku interazzjoni.

139
00:06:18,190 --> 00:06:20,150
U jekk trid tibdel
affarijiet, biss jmorru lura

140
00:06:20,150 --> 00:06:21,750
u għid s-sors tad-data għall-bidla.

141
00:06:21,750 --> 00:06:22,850
Jagħmel sens?

142
00:06:22,850 --> 00:06:26,010
Allura Jirreaġixxu hija dwar fehim
kif tibni komponent

143
00:06:26,010 --> 00:06:29,540
u kif jagħmlu komponent tiegħek
jinteraġixxu mal-dinja ta 'barra.

144
00:06:29,540 --> 00:06:31,850
>> Nagħmlu l-INTERACT komponent
mad-dinja esterna

145
00:06:31,850 --> 00:06:34,490
juża teknoloġija oħra
imsejħa Flux, li

146
00:06:34,490 --> 00:06:36,872
hija qafas li huwa
miżjud fuq is jirreaġixxu.

147
00:06:36,872 --> 00:06:38,330
Aħna mhux qed tmur biex jitkellmu dwar dan.

148
00:06:38,330 --> 00:06:42,990
Aħna qed tmur biex jitkellmu aktar dwar, minħabba
data, kif inti tista 'jirrendi komponent?

149
00:06:42,990 --> 00:06:47,010
>> U għalhekk Jirreaġixxu huwa verament jibred għaliex inti
tista 'tuża ma' kwalunkwe tarf ta 'wara trid.

150
00:06:47,010 --> 00:06:50,480
Jekk għandek bħal back aħħar Python,
jekk Python tiegħek jista bżiq out xi data,

151
00:06:50,480 --> 00:06:51,610
Jirreaġixxu jista 'jirrendi dan.

152
00:06:51,610 --> 00:06:54,700
Jekk inti l-ebda riżultati JS
ta 'data, Jirreaġixxu tagħmlu.

153
00:06:54,700 --> 00:06:56,890
Ruby binarji bi
data, Jirreaġixxu tagħmlu.

154
00:06:56,890 --> 00:07:01,860
>> Allura Jirreaġixxu hija bażikament web
view-- a tarf ta 'quddiem ma' komponenti

155
00:07:01,860 --> 00:07:03,910
għal kwalunkwe sors ta 'data tkun xi tkun.

156
00:07:03,910 --> 00:07:07,145
U hekk jmorru minn sors ta 'data li
jirreaġixxu komponenti hija pjuttost faċli.

157
00:07:07,145 --> 00:07:08,770
Going l-mod ieħor huwa ftit diffiċli.

158
00:07:08,770 --> 00:07:10,462
Li juża Flux kif semmejt qabel.

159
00:07:10,462 --> 00:07:11,420
Aħna mhux se jsibu rwieħhom li.

160
00:07:11,420 --> 00:07:13,740
Aħna ser tiffoka aktar fuq il-
-data to komponent ġenb.

161
00:07:13,740 --> 00:07:15,880
Dan il-mod inti tista 'tagħmel
jibred, web apps gost.

162
00:07:15,880 --> 00:07:19,870
Dan mhux se jaffettwa l-dinja ta 'barra
għal issa, iżda li storja oħra.

163
00:07:19,870 --> 00:07:22,210
>> OK, hekk jekk inti kienu hawn
għall-aħħar seminar tiegħi

164
00:07:22,210 --> 00:07:26,610
inti ser tkun taf li kollha ta 'l kodiċi għall
talk lum se tkun fuq dan il-URL

165
00:07:26,610 --> 00:07:29,320
hawn, sorry, dan il-URL hawn.

166
00:07:29,320 --> 00:07:32,730
U bażikament aħna qed tmur biex tmur
permezz ta 'erba passi, forsi ħames,

167
00:07:32,730 --> 00:07:33,510
probabbilment mhux ħamsa.

168
00:07:33,510 --> 00:07:37,300
Aħna ser jimxu permezz ta 'erba passi
ta 'bini ta' kampjun jirreaġixxu app.

169
00:07:37,300 --> 00:07:39,550
U hekk l-kodiċi sors
għal kull pass tal-mod

170
00:07:39,550 --> 00:07:42,216
se tkun dritt hawn, hekk jekk
int wara tul fid-dar,

171
00:07:42,216 --> 00:07:43,991
tħossok liberu li jaqraw b'attenzjoni dan il-kodiċi.

172
00:07:43,991 --> 00:07:46,740
Jekk int wara flimkien hawnhekk,
aħna ser tkun turi fuq l-iskrin,

173
00:07:46,740 --> 00:07:47,739
sabiex ma joqogħdu jinkwetaw dwar dan.

174
00:07:47,739 --> 00:07:50,930
Imma jekk int fid-dar, tħossok
liberu li żur dan is-sit.

175
00:07:50,930 --> 00:07:56,400
U, Yeah, inti għandek tkun kapaċi tikseb
l-kodiċi youd qatt bżonn hawn.

176
00:07:56,400 --> 00:08:01,380
Allura huwa iqarrqu folja tajba kif ukoll
għall-avventuri fil-futur tiegħek ma jirreaġixxu.

177
00:08:01,380 --> 00:08:04,490
Kessaħ, hekk jekk kulħadd li hawnhekk,
u anki jekk int fid-dar,

178
00:08:04,490 --> 00:08:11,580
pull up dan is-sit, is.gd/cs50react,
ebda kapital, l-ebda jenfasizzaw, l-ebda xejn.

179
00:08:11,580 --> 00:08:15,849
>> Int ser ikollok tara paġna li jistenna
ftit bħal dan.

180
00:08:15,849 --> 00:08:17,140
Din hija ħaġa imsejħa CodePen.

181
00:08:17,140 --> 00:08:20,030
CodePen huwa kollaborattiv
ambjent kodifikazzjoni

182
00:08:20,030 --> 00:08:23,364
li magħhom Kapaċi nikteb kodiċi hawn, u
dan ser jiġi awtomatikament mibgħuta lilek.

183
00:08:23,364 --> 00:08:24,780
U għal dan il-mod, Kapaċi nikteb kodiċi.

184
00:08:24,780 --> 00:08:26,920
I tista 'taħdem kodiċi hawn.

185
00:08:26,920 --> 00:08:33,470
>> Għal example-- u jekk reloads-- tara,
Niġri kodiċi JavaScript fuq il-paġna

186
00:08:33,470 --> 00:08:36,390
dritt hawn, u inneħħu
awtomatikament tirrendi paġna web

187
00:08:36,390 --> 00:08:37,980
ma dan il-kodiċi JavaScript.

188
00:08:37,980 --> 00:08:40,039
U għalhekk dan huwa mod
għalina biex jippruvaw kodiċi

189
00:08:40,039 --> 00:08:43,089
tassew mgħaġġla mingħajr ma jkollu jintuża
ID tagħna jew l-użu magna lokali tagħna

190
00:08:43,089 --> 00:08:44,290
jew ikun x'ikun.

191
00:08:44,290 --> 00:08:47,670
Huwa mod malajr ħafna għalik li mockup
u ttestjata l tipi differenti ta 'kodiċi.

192
00:08:47,670 --> 00:08:50,560
>> Hekk jien ser tkun qed tieħu
eżempju kodiċi, tqegħid hawnhekk.

193
00:08:50,560 --> 00:08:52,374
Aħna ser tkun qed taħdem permezz tiegħu.

194
00:08:52,374 --> 00:08:54,540
U jekk int fid-dar, inti
jistgħu jiġbdu dan up ukoll.

195
00:08:54,540 --> 00:08:57,530
U stajt diġà installat
Jirreaġixxu hawn, sabiex inti tista 'sempliċement

196
00:08:57,530 --> 00:09:00,770
jikteb il-kodiċi tiegħek stess hawn, u
jippruvaw dan bħala bitħa tiegħek stess.

197
00:09:00,770 --> 00:09:04,940
>> Yeah, jekk kulħadd biex
jiftħu din ir-rabta hawn.

198
00:09:04,940 --> 00:09:08,080
Jekk jogħġbok agħtini thumbs
up ladarba ikollok miftuħa.

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

200
00:09:10,960 --> 00:09:13,770
Kessaħ, berred jibred.

201
00:09:13,770 --> 00:09:16,914
M'hemm xejn hawn għal issa, iżda
aħna se bidla li malajr ħafna.

202
00:09:16,914 --> 00:09:21,250
>> OK, so Jirreaġixxu hija JavaScript
librerija, u bħala tali,

203
00:09:21,250 --> 00:09:24,480
teħtieġ għarfien ta 'JavaScript,
li hija l-lingwa ta 'programmar web.

204
00:09:24,480 --> 00:09:27,660
U huwa qed jintuża għal affarijiet oħra
issa wisq imma primarjament il-web żviluppati

205
00:09:27,660 --> 00:09:32,040
lingwa, hekk jekk inti ma jkunux familjari ma '
li, aqra sit imsejħa JSforCats.com.

206
00:09:32,040 --> 00:09:32,700
Huwa wunderbare.

207
00:09:32,700 --> 00:09:34,240
Tista 'titgħallem JavaScript
fi żmien nofs siegħa.

208
00:09:34,240 --> 00:09:34,990
Huwa inkredibbli.

209
00:09:34,990 --> 00:09:36,420
>> Allura tagħtiha jinqara.

210
00:09:36,420 --> 00:09:39,960
Aħna wkoll ħafna ta HTML hawnhekk għaliex
aħna qed tfassil paġni tal-web tal-kors.

211
00:09:39,960 --> 00:09:43,890
Mela jekk int familjari ma '
HTML, check out HTMLdog.com.

212
00:09:43,890 --> 00:09:46,520
Naħseb tagħlim React huwa
miljun darba aktar faċli jekk inti diġà

213
00:09:46,520 --> 00:09:47,892
jafu l-blokki tal-bini.

214
00:09:47,892 --> 00:09:50,600
Jekk inti għandek il-komponenti, huwa
faċli biex jagħmlu komponent akbar.

215
00:09:50,600 --> 00:09:51,860
Li Jirreaġixxu lingwa għalik.

216
00:09:51,860 --> 00:09:54,270
>> Allura aqbad u jagħtu
dawn l-affarijiet tinqara.

217
00:09:54,270 --> 00:09:55,070
Pause dan il-video.

218
00:09:55,070 --> 00:09:57,440
Agħti hija jaqra jekk inti
fid-dar jekk m'intix

219
00:09:57,440 --> 00:10:00,794
familjari mal HTML jew JavaScript

220
00:10:00,794 --> 00:10:02,960
OK, so dak li aħna qed tmur biex
tagħmel huwa aħna qed tmur biex tagħmel

221
00:10:02,960 --> 00:10:06,470
app flashcard bażika ħafna li jużaw jirreaġixxu.

222
00:10:06,470 --> 00:10:08,210
Aħna qed tmur biex ikollhom flashcard.

223
00:10:08,210 --> 00:10:09,880
Tista flip-biljett quddiem u lura.

224
00:10:09,880 --> 00:10:12,399
U aħna ser ikollhom ukoll lista ta '
l-karti li għandna,

225
00:10:12,399 --> 00:10:14,190
u jekk aħna qed tħossok
ambizzjuż, nistgħu tkun

226
00:10:14,190 --> 00:10:17,060
jistgħu jaqilbu bejn
karozzi billi tiklikkja fuqhom.

227
00:10:17,060 --> 00:10:20,360
>> Iżda dan huwa, bare tiegħek
għadam, sempliċi ħafna React app.

228
00:10:20,360 --> 00:10:22,560
U għalhekk dan huwa effettivament
mhux trivjali biex jimplimentaw,

229
00:10:22,560 --> 00:10:26,030
imma aħna qed tmur biex turi li, jekk inti tagħmel
dan, huwa ħafna, faċli ħafna biex jestenduh

230
00:10:26,030 --> 00:10:27,680
jekk in-nies oħra jgħinek magħha.

231
00:10:27,680 --> 00:10:33,750
Allura aħna qed tmur biex jgħaddu erba 'passi
tibda mill-bidu biex jinbena dan.

232
00:10:33,750 --> 00:10:36,740
>> Ok, sabiex l-erba 'passi, aħna ser
tibda bl-ewwel pass.

233
00:10:36,740 --> 00:10:39,790
L-ewwel pass se jkun
bini ewwel komponent tiegħek.

234
00:10:39,790 --> 00:10:44,830
Kif għidt qabel, komponent React
huwa biss element HTML fuq sterojdi.

235
00:10:44,830 --> 00:10:49,660
Huwa jispeċifika l-HTML
u xi mġieba, u

236
00:10:49,660 --> 00:10:52,600
jispeċifikaw kif in-nies
jistgħu jinteraġixxu ma 'dan kif

237
00:10:52,600 --> 00:10:54,270
ikollha istat intern.

238
00:10:54,270 --> 00:10:57,630
Bħal buttuna se tkun taf bħal kemm
drabi huwa kien għafast per eżempju,

239
00:10:57,630 --> 00:11:01,010
u se tkun taf kif jistabbilixxu innifsu barra.

240
00:11:01,010 --> 00:11:04,430
>> Mela ejja imorru quddiem u jibnu tagħna
ewwel komponent bl-użu JavaScript.

241
00:11:04,430 --> 00:11:09,711
Allura jekk il-sintassi jistenna stramb,
dan għaliex tip ta 'huwa.

242
00:11:09,711 --> 00:11:11,710
Allura, għal darb'oħra, aħna qed tmur
li tagħmel varjabbli imsejjaħ

243
00:11:11,710 --> 00:11:14,580
app bl-użu keyword let,
li tagħmel varjabbli,

244
00:11:14,580 --> 00:11:18,210
let App ugwali React.createClass.

245
00:11:18,210 --> 00:11:22,609
>> Jirreaġixxu hija librerija u għandha
l joħolqu funzjoni klassi.

246
00:11:22,609 --> 00:11:24,400
U din il-funzjoni huwa
daqsxejn ta 'kodiċi li int

247
00:11:24,400 --> 00:11:29,090
jistgħu jużaw biex joħolqu ġdid
tip ta 'Jirreaġixxu komponent.

248
00:11:29,090 --> 00:11:32,780
U hekk React.createClass
jagħmel komponent,

249
00:11:32,780 --> 00:11:35,270
u dan il-komponent se
ikunu jistgħu jagħmlu Jittieħed.

250
00:11:35,270 --> 00:11:40,460
Il-ħaġa prinċipali hija tista 'tagħmel huwa tirrendi
xi ħaġa, jirrendi bħala funzjoni.

251
00:11:40,460 --> 00:11:44,500
>> Għal darb'oħra, jekk dan l-indiċi ma jkunx ovvju li
inti, I jirrakkomandaw inti tmur fuq JS għall-qtates

252
00:11:44,500 --> 00:11:45,682
u check out.

253
00:11:45,682 --> 00:11:47,710
Huwa li żżomjati fl tajjeb biżżejjed?

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

255
00:11:48,490 --> 00:11:50,670
>> Allura kull bżonnijiet komponent
li jkollhom tirrendi funzjoni.

256
00:11:50,670 --> 00:11:53,010
Il-funzjoni tirrendi jgħid,
liema do I jistampaw fuq l-iskrin?

257
00:11:53,010 --> 00:11:54,760
Iżda l-komponent huwa
inutli jekk ma

258
00:11:54,760 --> 00:11:58,060
jafu x'għandhom jistampaw fuq l-iskrin, hekk
ikollok bżonn li jkollhom tirrendi funzjoni.

259
00:11:58,060 --> 00:12:01,904
>> Allura fil-ħaġa tirrendi, inti
biss bżonn li jirritornaw xi HTML.

260
00:12:01,904 --> 00:12:03,820
U x'hemm jibred huwa li
hemm xi ħaġa imsejjaħ

261
00:12:03,820 --> 00:12:08,660
JSX, li hija estensjoni ta '
JavaScript li jintuża mill jirreaġixxu.

262
00:12:08,660 --> 00:12:11,845
Hija ejja tikteb HTML ġewwa
tal tiegħek JavaScript, li

263
00:12:11,845 --> 00:12:13,970
tip ta 'ħsejjes stramb meta
inti l-ewwel taħseb dwarha,

264
00:12:13,970 --> 00:12:15,553
iżda jagħmel ħafna sens afterward.

265
00:12:15,553 --> 00:12:17,430
Allura nistgħu nagħmlu dan.

266
00:12:17,430 --> 00:12:21,360
Jekk int familjari ma HTML, I know
għandna div bi skop ġenerali

267
00:12:21,360 --> 00:12:22,790
kontenitur għall-għalf.

268
00:12:22,790 --> 00:12:26,380
Nistgħu ritorn div, u ġewwa
dan div, nistgħu npoġġu Jittieħed.

269
00:12:26,380 --> 00:12:32,390
>> Mela ejja ngħidu li rridu tirrendi biss
a flashcard straight-up għal issa.

270
00:12:32,390 --> 00:12:34,890
Il flashcard, nixtieq ngħid,
se jkollhom mistoqsija u tweġiba.

271
00:12:34,890 --> 00:12:37,530
Allura ġewwa dan div, ejja
jistampa paragrafu

272
00:12:37,530 --> 00:12:42,155
li tgħid question-- X'inhu l-
tweġiba aħħarija għall-ħajja, l-univers?

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

274
00:12:47,640 --> 00:12:50,345
U allura l-tweġiba hija
se tkun, naturalment, 42.

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

276
00:12:56,880 --> 00:12:59,730
>> Li ma toħroġ ukoll fil-livelli kollha.

277
00:12:59,730 --> 00:13:04,164
Yeah, hekk bażikament inti tista 'verament
jiktbu HTML ġewwa tiegħek JavaScript.

278
00:13:04,164 --> 00:13:06,330
U dan se jkun
stampata fil-iskrin.

279
00:13:06,330 --> 00:13:08,250
Mela ejja jippruvaw it out.

280
00:13:08,250 --> 00:13:09,520
>> Allura aħna għandna komponent tagħna.

281
00:13:09,520 --> 00:13:12,210
Għandna bżonn li tgħid jirreaġixxu tpoġġi
l-komponent fuq l-iskrin

282
00:13:12,210 --> 00:13:18,990
hekk React.render, hekk avviż li aħna
jittratta app bħal kull element ieħor.

283
00:13:18,990 --> 00:13:21,010
Aħna tikteb kif kien element HTML.

284
00:13:21,010 --> 00:13:25,100
Bħal minflok ta 'tgħid bħal img
għall-immaġni jew p minflok il-paragrafu,

285
00:13:25,100 --> 00:13:28,120
tikteb App, hekk App hija
trattat bħal element HTML.

286
00:13:28,120 --> 00:13:30,380
Kif għidt qabel, huwa
element fuq sterojdi.

287
00:13:30,380 --> 00:13:32,870
>> Allura inti tirrendi App, u inti
tagħtiha post li tqiegħed lilha.

288
00:13:32,870 --> 00:13:37,170
U dan huwa kif inti tista '
għid fejn li tqiegħed lilha.

289
00:13:37,170 --> 00:13:46,200
I ħolqu div sempliċi fuq il-
paġna imsejħa ma 'ID tal-paġna,

290
00:13:46,200 --> 00:13:48,300
u li fejn l-
element għaddej biex tmur.

291
00:13:48,300 --> 00:13:49,841
>> U aħna mhux qed tmur biex jimxu ma HTML.

292
00:13:49,841 --> 00:13:53,145
Bażikament din hija se tikseb
jitpoġġew ġo dan l-element paġna

293
00:13:53,145 --> 00:13:54,270
li għandna fuq l-iskrin.

294
00:13:54,270 --> 00:13:59,210
Allura din tmur dan il-kodiċi, u jiġbed dan
ħaġa fuq l-iskrin, hekk aħna qegħdin hawn.

295
00:13:59,210 --> 00:14:01,770
Għamilna ewwel komponent jirreaġixxu tagħna.

296
00:14:01,770 --> 00:14:08,000
>> Hekk biss bħala terġa, aħna bil-mod li sar
tip ġdid ta 'komponent, id-dritt?

297
00:14:08,000 --> 00:14:10,145
Dak hu l-React.createClass.

298
00:14:10,145 --> 00:14:12,680
U f'dak il-komponent, aħna
told dak li għandhom jagħmlu.

299
00:14:12,680 --> 00:14:15,590
Kull meta dan il-komponent huwa li
jiġu stampati fuq l-iskrin,

300
00:14:15,590 --> 00:14:19,300
se jistampa l-div bl
iż-żewġ paragrafi ġewwa ta 'dan.

301
00:14:19,300 --> 00:14:24,460
>> U dak li għamilna, għamilna app ġdida
bl-użu notazzjoni angolu app parentesi.

302
00:14:24,460 --> 00:14:27,160
Aħna qal li tqiegħed lilha
ġewwa l-element paġna.

303
00:14:27,160 --> 00:14:29,867
U hekk dak li għamilt, ħolqot
ġodda app minn dak template.

304
00:14:29,867 --> 00:14:31,200
U mbagħad I told li jirrenduh.

305
00:14:31,200 --> 00:14:33,680
Għalhekk qal, OK, app,
x'għandi nagħmel jistampa?

306
00:14:33,680 --> 00:14:36,970
App jgħid, go jistampa div
b'żewġ paragrafi ġewwa ta 'dan.

307
00:14:36,970 --> 00:14:40,420
U voila, hemm div tagħna ma
żewġ paragrafi ġewwa ta 'dan.

308
00:14:40,420 --> 00:14:43,180
Jagħmel sens s'issa?

309
00:14:43,180 --> 00:14:46,690
>> Allura, għal darb'oħra, l-isfida kollu ta 'React
huwa biss jafu kif jagħmlu komponenti.

310
00:14:46,690 --> 00:14:48,500
Kif tagħmel l-
komponenti jaħdmu flimkien.

311
00:14:48,500 --> 00:14:51,780
Issa li aħna ħadna l-ewwel tagħna
komponent, ejja mmorru lura

312
00:14:51,780 --> 00:14:54,284
u jagħmlu komponenti customizable.

313
00:14:54,284 --> 00:14:56,700
Allura inti taf kif fil HTML inti
jistgħu jagħtu klassijiet buttuni tiegħek?

314
00:14:56,700 --> 00:14:59,146
Inti tista 'tagħti ankri tiegħek l href.

315
00:14:59,146 --> 00:15:00,770
Inti tista 'tagħti kontributi tiegħek tip, id-dritt?

316
00:15:00,770 --> 00:15:04,740
Inti tista 'tagħti aktar custom
proprjetajiet għall-elementi kollha tiegħek

317
00:15:04,740 --> 00:15:06,490
biex jagħmluha aktar interessanti.

318
00:15:06,490 --> 00:15:09,030
U aħna fil-fatt tista 'tagħmel
l-istess ħaġa eżatt.

319
00:15:09,030 --> 00:15:17,500
>> Mela ejja ngħidu li rridu tagħna
app li jmorru tirrendi kull biljett.

320
00:15:17,500 --> 00:15:19,630
Dritt issa aħna biss
mogħtija karta hardcoded.

321
00:15:19,630 --> 00:15:22,530
Nafu hemm biss wieħed
karta tista 'tagħmel, hekk aħna qed

322
00:15:22,530 --> 00:15:25,960
ser jippruvaw u jbiddlu dan issa tant
li nistgħu biss jagħtu xi biljett.

323
00:15:25,960 --> 00:15:27,410
Hija ser jistampa l-biljett.

324
00:15:27,410 --> 00:15:29,380
>> Inti suppost li tipprova u jagħmlu tiegħek
komponenti skop ġenerali ħafna.

325
00:15:29,380 --> 00:15:31,654
Allura dan il-mod I jistgħu email
dan il-ħabib tiegħi u jkunu simili,

326
00:15:31,654 --> 00:15:33,820
tkun xi flashcard għandek,
biss għalf fis hawnhekk,

327
00:15:33,820 --> 00:15:35,290
u dan ser tagħmel dan minnu stess.

328
00:15:35,290 --> 00:15:37,650
Inti tista 'tpoġġi l-oħra
affarijiet fil app tiegħek stess.

329
00:15:37,650 --> 00:15:40,600
>> Iżda l-ewwel, ejja jiksru dan
up f'żewġ komponenti,

330
00:15:40,600 --> 00:15:44,500
imma irridu li tissepara l-karta
istampar parti mill-parti attwali app.

331
00:15:44,500 --> 00:15:46,660
Allura dak li nistgħu nagħmlu huwa aħna
jistgħu jbiddlu dan mill App

332
00:15:46,660 --> 00:15:51,300
li CardView, biss
isem ġdid għall-app,

333
00:15:51,300 --> 00:15:54,450
u nistgħu nagħmlu ġdida
komponent imsejħa App,

334
00:15:54,450 --> 00:15:56,336
ma għandhomx jiġu mfixkla ma 'l-App qodma.

335
00:15:56,336 --> 00:16:00,730
Imxejna ltqajna l-createClass,
u bħal fil HTML,

336
00:16:00,730 --> 00:16:03,590
inti tista 'bejta jirreaġixxu komponenti
ġewwa ta 'xulxin.

337
00:16:03,590 --> 00:16:16,430
>> Allura f'dan tirrendi funzjoni,
CardView ritorn funzjoni,

338
00:16:16,430 --> 00:16:18,234
u dan huwa l-istess ħaġa eżatt.

339
00:16:18,234 --> 00:16:19,400
Tara għaliex huwa l-istess ħaġa?

340
00:16:19,400 --> 00:16:22,590
Minflok tirrendi biss l-app li
għandu l-div u tqabbil ġewwa ta 'dan,

341
00:16:22,590 --> 00:16:26,194
l-app tirrendi l CardView, u l
CardView jagħmel il-div u paragrafu.

342
00:16:26,194 --> 00:16:29,110
Allura dan huwa l-ewwel eżempju tagħna ta
Elementi ibejtu ġewwa ta 'xulxin.

343
00:16:29,110 --> 00:16:32,177
Does li jagħmel sens?

344
00:16:32,177 --> 00:16:33,760
Allura, għal darb'oħra, aħna għandna element CardView.

345
00:16:33,760 --> 00:16:37,250
Għandna elementi app
li huwa akbar minn.

346
00:16:37,250 --> 00:16:40,990
>> OK, hekk irridu tagħna CardView-- jekk inti
tagħti CardView tajba karta ċerta,

347
00:16:40,990 --> 00:16:43,370
dan ser jistampa għalik, right?

348
00:16:43,370 --> 00:16:48,050
Allura l-ewwel, għandna bżonn li tagħmel karta,
so ejja jagħmlu oġġett biljett.

349
00:16:48,050 --> 00:17:02,930
Mela ejja karta tiegħi equal--
jekk int kollha familjari,

350
00:17:02,930 --> 00:17:05,260
dan huwa biss il-teħid notazzjoni
joġġezzjonaw fl JavaScript.

351
00:17:05,260 --> 00:17:09,280
Huwa tip ta 'bħal Struct
fis-C, hekk għamilna karta,

352
00:17:09,280 --> 00:17:15,920
u hekk issa nistgħu tgħaddi din il-karta kif
proprjetà jew bħala attribut fil HTML

353
00:17:15,920 --> 00:17:17,290
terminoloġija li app tagħna.

354
00:17:17,290 --> 00:17:20,210
Allura nistgħu nagħmlu dan, App
karta ugwali Mycard.

355
00:17:20,210 --> 00:17:23,200
>> Inti taf kif fil input, inti tagħmel
tip input huwa ugwali test jew buttuna

356
00:17:23,200 --> 00:17:25,240
klassi jegwalja BTN għall bootstrap ,?

357
00:17:25,240 --> 00:17:29,500
Istess idea, equals-- karta App
inti stajt ltqajna biex tpoġġi ċineg here--

358
00:17:29,500 --> 00:17:33,830
Karta App ugwali Mycard, għalhekk dan
jgħid aħna għandna dan l-oġġett biljett.

359
00:17:33,830 --> 00:17:39,149
Jien ser tgħaddiha bħala
proprjetà għall-komponent app.

360
00:17:39,149 --> 00:17:41,440
U dan il-komponent app se
tkun tista 'aċċess għaliha u tagħmel

361
00:17:41,440 --> 00:17:43,580
Jittieħed interessanti magħha.

362
00:17:43,580 --> 00:17:47,650
>> Allura app tagħna se tkun
jingħataw kard, hekk għal issa,

363
00:17:47,650 --> 00:17:49,980
ejja jkollhom l-app jagħtu biss
il-karta tal-CardView

364
00:17:49,980 --> 00:17:53,110
nnifisha, għaliex bħall-app mhuwiex
ser tkun taf x'għandek tagħmel magħha,

365
00:17:53,110 --> 00:17:54,850
hekk aħna ser biss jagħtu lill-CardView.

366
00:17:54,850 --> 00:18:00,050
Allura aħna ser tgħaddiha l
istess mod, karta ugwali,

367
00:18:00,050 --> 00:18:05,426
u għalhekk kull komponent jistgħu jaċċedu għall-
affarijiet li ġiet mogħtija lilu.

368
00:18:05,426 --> 00:18:07,800
Huma jistgħu jaċċessaw il-proprjetajiet
li ngħataw lilha

369
00:18:07,800 --> 00:18:09,470
jużaw dan sintassi, this.props.card.

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

371
00:18:12,010 --> 00:18:14,920
>> Allura dak li jiġri hawn huwa
inti għandek l-oġġett Mycard.

372
00:18:14,920 --> 00:18:18,250
Inti tgħaddiha fil-app
jużaw karta App ugwali Mycard.

373
00:18:18,250 --> 00:18:21,420
Dak l-oġġett biljett tingħata lill app tiegħek.

374
00:18:21,420 --> 00:18:24,400
Il-app tista 'aċċess
kif this.props.card.

375
00:18:24,400 --> 00:18:28,780
Huwa tip ta 'tixbah immaġni
jaf liema huwa sors huwa.

376
00:18:28,780 --> 00:18:31,972
>> Dan app jaf liema huwa karta
huwa, u tista 'tagħmel Jittieħed magħha.

377
00:18:31,972 --> 00:18:32,930
Hija tista 'tagħmel komputazzjonijiet.

378
00:18:32,930 --> 00:18:35,290
Hija tista 'tagħmel deċiżjonijiet ibbażati off ta' dan.

379
00:18:35,290 --> 00:18:39,950
>> Għal issa, I kienet se jgħaddu
this.props.card fuq il-CardView.

380
00:18:39,950 --> 00:18:43,420
Jagħmel sens s'issa?

381
00:18:43,420 --> 00:18:45,210
Hija ser tagħmel aktar sens issa.

382
00:18:45,210 --> 00:18:46,990
>> OK, hekk issa aħna qed fil CardView.

383
00:18:46,990 --> 00:18:51,719
CardView tagħna, minħabba l-karta, jekk
jistampa domanda tagħha u tweġiba.

384
00:18:51,719 --> 00:18:54,510
Dritt issa aħna biss stampat xi
mistoqsijiet u tweġibiet. hardcoded

385
00:18:54,510 --> 00:18:57,720
Għandna bżonn biex insemmu out-- għandna bżonn
li titlob lill-biljett li tawna

386
00:18:57,720 --> 00:19:01,360
x'inhi l-mistoqsija u tweġiba, u
imbagħad jistampa dan out fil-iskrin.

387
00:19:01,360 --> 00:19:02,470
>> Allura nistgħu nagħmlu dan hawnhekk.

388
00:19:02,470 --> 00:19:06,135
Fl tirrendi begin-- ewwel tagħmel ugwali.

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

390
00:19:08,710 --> 00:19:13,050
Allura dak li aħna qed tagħmel hawnhekk huwa nafu li
il-karti huma mogħtija lilna għal proprjetà,

391
00:19:13,050 --> 00:19:13,580
id-dritt?

392
00:19:13,580 --> 00:19:15,930
Huwa mogħti lilna bħala input.

393
00:19:15,930 --> 00:19:19,440
Simili huwa kważi simili
argumenti funzjoni.

394
00:19:19,440 --> 00:19:22,810
Il-karta hija argument
kważi għal dan CardView.

395
00:19:22,810 --> 00:19:25,239
>> Aħna ser estratt li, u mqiegħda
hija fil-kwistjoni varjabbli.

396
00:19:25,239 --> 00:19:27,280
Kun żgur li l-tweġiba marru
tar-risposta varjabbli.

397
00:19:27,280 --> 00:19:31,130
Iqajjem dik il-karta li jwieġbu.

398
00:19:31,130 --> 00:19:35,072
U issa li għandna dawn,
minflok fl-istampar test,

399
00:19:35,072 --> 00:19:37,030
aħna qed tmur biex jistampa
kull ma tana.

400
00:19:37,030 --> 00:19:43,580
>> Allura dan stuff-- hekk aħna qed tmur
tqiegħed Tweġiba Mistoqsija.

401
00:19:43,580 --> 00:19:46,380
Ejja naraw jekk dan jaħdem.

402
00:19:46,380 --> 00:19:52,800
Kessaħ, so ejja pass permezz ta 'dan
waħda aktar ħin biss biex tkun ċert.

403
00:19:52,800 --> 00:20:00,470
>> Allura card tiegħi huwa oġġett card, u aħna
huma jagħtu dik il-karta għall-app.

404
00:20:00,470 --> 00:20:04,790
U l-app se tieħu l-
karta u jagħtu lill-CardView.

405
00:20:04,790 --> 00:20:09,190
U dan CardView jgħid, jekk inti
tagħti me xi oġġett flashcard,

406
00:20:09,190 --> 00:20:11,920
I ser jistampa domanda tagħha
u tweġiba tagħha, id-dritt?

407
00:20:11,920 --> 00:20:14,590
>> Allura dak I tista 'tagħmel huwa I tista
tibgħat dan il-kodiċi, l-ewwel

408
00:20:14,590 --> 00:20:16,580
bħal 10 linji ta 'kodiċi tiegħi, għall-ħabib tiegħi.

409
00:20:16,580 --> 00:20:18,820
Huwa jista ssodata fil
applikazzjoni tiegħu stess.

410
00:20:18,820 --> 00:20:27,200
U sakemm huwa ma l-istess ħaġa,
bħal karta CardView ugwali dan,

411
00:20:27,200 --> 00:20:30,580
sakemm hu maħluq l CardView
u tatha l-informazzjoni korretta,

412
00:20:30,580 --> 00:20:31,987
huwa seta tirrendi karta tiegħu stess.

413
00:20:31,987 --> 00:20:34,320
U għalhekk b'dan il-mod, huwa verament
mod jibred biex inti tibni

414
00:20:34,320 --> 00:20:35,906
komponenti li jużaw xulxin, id-dritt?

415
00:20:35,906 --> 00:20:38,280
Din il-karta, I tista 'tippubblika
dan CardView fuq l-internet,

416
00:20:38,280 --> 00:20:39,790
u n-nies jkunu jistgħu jużawh.

417
00:20:39,790 --> 00:20:45,070
Allura bażikament, huwa simili wieħed mill-
funzjonijiet standard fil-librerija C.

418
00:20:45,070 --> 00:20:47,280
>> Hija funzjoni fejn
xi ħadd kiteb dan.

419
00:20:47,280 --> 00:20:48,419
Inti tagħti ċertu input.

420
00:20:48,419 --> 00:20:49,710
Hija ser jipproduċi output ċerti.

421
00:20:49,710 --> 00:20:50,890
Inti ma 'kura kif taħdem internament.

422
00:20:50,890 --> 00:20:53,790
Sakemm inti tagħti d-dritt
input, hija ser tagħmel l-output dritt.

423
00:20:53,790 --> 00:20:57,850
>> U komponent jista 'jkun
ħsieb ta 'l-istess mod.

424
00:20:57,850 --> 00:21:00,280
Dan CardView huwa simili
funzjoni librerija.

425
00:21:00,280 --> 00:21:03,400
Jekk inti tagħti xi karta
bħala proprjetà, dan ser

426
00:21:03,400 --> 00:21:05,095
jistampa l-kontenut ta 'dik il-karta.

427
00:21:05,095 --> 00:21:16,820
Bħal jekk nibdel karta tiegħi biex
minflok jkun bħal dak li huwa 5 plus 37,

428
00:21:16,820 --> 00:21:19,210
din se taġġorna kif meħtieġ.

429
00:21:19,210 --> 00:21:21,955
Hekk biss billi jinbidlu l-input,
jiġrilha output ċerti.

430
00:21:21,955 --> 00:21:24,830
Allura inti tista 'taħseb komponenti kważi
funzjonijiet b'dan il-mod, li

431
00:21:24,830 --> 00:21:25,920
inti tista 'tpoġġi flimkien.

432
00:21:25,920 --> 00:21:29,440
Ikollok input, bħal dan CardView
bħala l-input, ikollok output.

433
00:21:29,440 --> 00:21:31,900
F'dan il-każ, l-output huwa l-HTML.

434
00:21:31,900 --> 00:21:34,404
Jagħmel sens s'issa?

435
00:21:34,404 --> 00:21:36,890
Kessaħ, hekk darb'oħra, il-proprjetajiet huma
kif inti tista 'tgħaddi informazzjoni

436
00:21:36,890 --> 00:21:40,900
ġo u barra mill-komponenti.

437
00:21:40,900 --> 00:21:42,740
>> OK, so ejja jagħmlu dan
ħaġa interattivi.

438
00:21:42,740 --> 00:21:44,450
Dritt issa huwa tip ta 'boring.

439
00:21:44,450 --> 00:21:45,520
X'inhu [inaudible]?

440
00:21:45,520 --> 00:21:48,210
Tista 'tipprintja xi out,
iżda li kollox li jistgħu jagħmlu.

441
00:21:48,210 --> 00:21:51,550
>> Mela ejja jmorru lura għall-
kwistjoni antika biss għal issa.

442
00:21:51,550 --> 00:21:54,405
OK, hekk dritt issa dawn il-komponenti
huma boring għaliex dawn kollha jagħmlu,

443
00:21:54,405 --> 00:21:55,030
huma jiksbu input.

444
00:21:55,030 --> 00:21:56,100
Huma jagħmlu output, id-dritt?

445
00:21:56,100 --> 00:21:57,049
C'est tip ta boring.

446
00:21:57,049 --> 00:21:59,090
Irridu li jkollna tagħna
komponenti biex ikunu jistgħu jkollhom

447
00:21:59,090 --> 00:22:02,150
xi tip ta 'stat intern,
bħal tiftakar xi ħaġa.

448
00:22:02,150 --> 00:22:05,320
>> Għal flashcard, għal
eżempju, liema tip ta 'stat

449
00:22:05,320 --> 00:22:07,550
tista inti tixtieq li
tiftakar għal flashcard?

450
00:22:07,550 --> 00:22:09,740
What istatus temporanju
tista inti tixtieq li tiftakar

451
00:22:09,740 --> 00:22:12,491
għal flashcard fil-app flashcard?

452
00:22:12,491 --> 00:22:13,990
UDJENZA: Jekk huwa kien flipped?

453
00:22:13,990 --> 00:22:14,990
Neel Mehta: Yeah, id-dritt.

454
00:22:14,990 --> 00:22:17,665
Allura inti tista 'tixtieq li żżomm
rekord ta 'huma inti jiffaċċjaw jew ikun hemm

455
00:22:17,665 --> 00:22:19,100
inti jiffaċċjaw isfel fuq il-karta.

456
00:22:19,100 --> 00:22:23,420
Fuq Facebook, per eżempju, inti
trid tiftakar fejn fl-għalf aħbarijiet

457
00:22:23,420 --> 00:22:25,870
huma inti jew tixtieq li l-profil
huma inti tagħmel dritt issa.

458
00:22:25,870 --> 00:22:30,127
>> Fuq Messenger, bħal dak li inti test
tip fil-kaxxa input, id-dritt?

459
00:22:30,127 --> 00:22:31,710
Jekk inti jġedded il-paġna, din tmur bogħod.

460
00:22:31,710 --> 00:22:32,793
Imma int ma verament kura.

461
00:22:32,793 --> 00:22:33,770
Huwa biss temporanju.

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

463
00:22:34,548 --> 00:22:36,152
>> UDJENZA: [inaudible]

464
00:22:36,152 --> 00:22:38,360
Neel Mehta: Bħal flash
karta, bħal inti tista 'tkun qed tara

465
00:22:38,360 --> 00:22:40,290
il-ġenb kwistjoni jew il-ġenb risposta?

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

467
00:22:41,070 --> 00:22:43,270
>> Neel Mehta: Like a
flashcard żewġ naħat, id-dritt?

468
00:22:43,270 --> 00:22:46,370
Yeah, sabiex inti tixtieq li
jkollhom din l-idea ta 'issa

469
00:22:46,370 --> 00:22:50,370
I għandhom proprjetajiet, li huwa simili inputs,
iżda l-istat, li hija temporanja, uh,

470
00:22:50,370 --> 00:22:51,839
fejn inti fuq il-paġna, right?

471
00:22:51,839 --> 00:22:54,380
Għal darb'oħra, I said fil Facebook
Messenger, I jkollhom affarijiet simili li persuna

472
00:22:54,380 --> 00:22:56,550
qed tara Facebook
jew li l-profil, id-dritt?

473
00:22:56,550 --> 00:22:58,030
>> Dan huwa biss temporanju.

474
00:22:58,030 --> 00:23:01,200
Huwa importanti li turi l-utent
x'inhu għaddej, iżda jġedded il-paġna.

475
00:23:01,200 --> 00:23:02,250
Hija ma verament kwistjoni.

476
00:23:02,250 --> 00:23:04,530
Allura huwa stat temporanju,
hekk aħna kollha istat dan.

477
00:23:04,530 --> 00:23:06,250
>> Allura, għal darb'oħra, hemm statali u props.

478
00:23:06,250 --> 00:23:09,084
Props huwa input jingħata
minn sors data tiegħek.

479
00:23:09,084 --> 00:23:10,250
Stat huwa bħad nuqqasijiet.

480
00:23:10,250 --> 00:23:13,700
Huwa biss bħal għalf li
jagħmel il-ħaġa interattiv.

481
00:23:13,700 --> 00:23:17,720
>> Allura fil tagħna CardView-- ejja jkollhom
tagħna CardView-- allura kien sbieħ.

482
00:23:17,720 --> 00:23:21,420
Dak li aħna qed tmur biex tagħmel hawn, aħna qed tmur
tmissx CardView u biss CardView.

483
00:23:21,420 --> 00:23:25,105
U hekk ħabib tiegħi li sibt dan, huma
ma tinnota xi differenza.

484
00:23:25,105 --> 00:23:27,230
Dawn ma jkollhomx għall-bidla
kwalunkwe mill-kodiċi tagħhom stess,

485
00:23:27,230 --> 00:23:29,410
iżda theyd tara tagħhom
CardView ltqajna souped up.

486
00:23:29,410 --> 00:23:31,270
Li l-parti sbieħ dwar komponenti.

487
00:23:31,270 --> 00:23:35,290
>> OK, hekk CardView tagħna, ejja jippruvaw u
iżżomm kont ta 'jekk aħna qed gradwalment up

488
00:23:35,290 --> 00:23:36,560
jew fl-wiċċ.

489
00:23:36,560 --> 00:23:40,480
Fl Jirreaġixxu nagħmlu dan billi l-ewwel
li tispeċifika l-istat inizjali.

490
00:23:40,480 --> 00:23:42,070
Fejn ma l-karta tibda?

491
00:23:42,070 --> 00:23:48,480
>> Allura jkun funzjoni msejħa getInitialState
funzjoni, u nerġgħu lura oġġett.

492
00:23:48,480 --> 00:23:53,310
Dan l-oġġett fih xi stat, u
stat huwa biss par ta 'valur ċavetta.

493
00:23:53,310 --> 00:23:56,950
Bħal fil struzzjonijiet, għandek ewlenin u
valur, għandek bħall-isem huwa string.

494
00:23:56,950 --> 00:24:01,410
>> F'dan il-każ, ejja ngħidu quddiem huwa veru.

495
00:24:01,410 --> 00:24:03,760
Dan jgħid li għandna stat.

496
00:24:03,760 --> 00:24:06,570
Komponent wieħed tal-istat
hija attribut imsejħa front.

497
00:24:06,570 --> 00:24:09,649
[Inaudible], hekk awtomatikament,
aħna qed fil-quddiem tal-karta,

498
00:24:09,649 --> 00:24:11,440
u nistgħu nbiddlu dan
kif aħna flip-biljett.

499
00:24:11,440 --> 00:24:13,380
Jagħmel sens?

500
00:24:13,380 --> 00:24:18,190
>> OK, hekk jirrendu, id-dritt issa, aħna qed
li turi l-mistoqsija u t-tweġiba.

501
00:24:18,190 --> 00:24:20,860
Issa dak li għandna nagħmlu
huwa juri l-kwistjoni

502
00:24:20,860 --> 00:24:24,370
jekk aħna qed fuq quddiem tal-card hekk
it-tweġiba hija għall-dahar tal-karta.

503
00:24:24,370 --> 00:24:26,850
C'est pourquoi inti kollha tagħmel
il-karta interattiv.

504
00:24:26,850 --> 00:24:28,100
Mela ejja jippruvaw u għal dan hawn.

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

506
00:24:31,600 --> 00:24:33,620
Ukoll, l-ewwel biss tagħmel varjabbli.

507
00:24:33,620 --> 00:24:37,790
Nistgħu titlob issa this.state.front.

508
00:24:37,790 --> 00:24:42,010
Aħna aċċess jiddikjaraw l-istess aħna
props aċċess, hekk this.state.front.

509
00:24:42,010 --> 00:24:45,870
>> Jekk aħna qed fuq quddiem, imbagħad test
huwa this.props.card.question.

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

511
00:24:48,777 --> 00:24:51,360
Jekk aħna qed fuq quddiem tal-
karta, aħna qed tmur biex jippruvaw u grab

512
00:24:51,360 --> 00:24:52,485
il-kwistjoni mill-biljett.

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

514
00:24:54,782 --> 00:24:57,240
Inkella, jekk aħna qed fuq id-dahar
tal-karta, dak li nagħmlu?

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

516
00:25:01,830 --> 00:25:02,750
>> UDJENZA: It-tweġiba?

517
00:25:02,750 --> 00:25:05,041
>> Neel Mehta: Yep, so test
ugwali this.props.card.answer.

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

519
00:25:08,472 --> 00:25:10,930
Imma jekk tinnota, aħna qed jużaw
l-istat biex jagħmlu deċiżjoni

520
00:25:10,930 --> 00:25:14,420
minħabba li issa l-komponent
se tfittex differenti

521
00:25:14,420 --> 00:25:16,710
ibbażata off kif dawn jinteraġixxu miegħu.

522
00:25:16,710 --> 00:25:20,355
Allura minflok ta 'stampar ta dan,
aħna ser biss print out-test.

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

524
00:25:25,270 --> 00:25:28,650
Kessaħ, hekk issa, kif tara,
naraw biss il-kwistjoni.

525
00:25:28,650 --> 00:25:37,720
U jekk nibdel l-istat hawn manwalment
għal quddiem hija falza nikbru 42 lura.

526
00:25:37,720 --> 00:25:39,720
>> Allura, għal darb'oħra, dan il-komponent
għandha istat tiegħu stess.

527
00:25:39,720 --> 00:25:43,440
Bħal buttuna jaf jekk
huwa kien ippressat jew le,

528
00:25:43,440 --> 00:25:46,080
dan il-ħaġa jaf dak li huwa fuq
quddiem jew fuq wara.

529
00:25:46,080 --> 00:25:48,320
Konvenzjonalment, huwa fuq il-front.

530
00:25:48,320 --> 00:25:50,840
U allura jekk huwa fuq quddiem,
aħna ser jistampa l-kwistjoni.

531
00:25:50,840 --> 00:25:53,106
Jekk huwa fuq id-dahar, aħna ser
jistampa l-risposta.

532
00:25:53,106 --> 00:25:54,980
Allura, għal darb'oħra, l-informazzjoni
mogħtija hija l-istess.

533
00:25:54,980 --> 00:25:59,090
Hija biss jistenna differenti
bbażata fuq kif inti program.

534
00:25:59,090 --> 00:26:02,670
Għalhekk, per eżempju, Facebook Messenger,
anki jekk ikollok l-istess sors ta 'data,

535
00:26:02,670 --> 00:26:05,170
jista 'tfittex differenti
minħabba l-istat huwa differenti.

536
00:26:05,170 --> 00:26:08,421
Inti qed tħares lejn
Messaġġ persuna differenti ta.

537
00:26:08,421 --> 00:26:10,930
>> OK, għalhekk dan huwa kollu tajjeb u
tajba, imma issa dak fil-fatt

538
00:26:10,930 --> 00:26:15,940
jagħmluna kapaċi li jibdlu, jekk
karta tagħna huwa fuq quddiem jew lura.

539
00:26:15,940 --> 00:26:19,010
Nistgħu nagħmlu dan billi jżid flip
buttuna, buttuna lill-biljett li

540
00:26:19,010 --> 00:26:22,950
se flip-biljett jekk huwa [inaudible].

541
00:26:22,950 --> 00:26:31,770
Mela ejja żid buttuna hawn, dan
buttuna, u din il-buttuna se ngħid flip.

542
00:26:31,770 --> 00:26:35,650
>> U hekk dritt issa, huwa
ma tagħmel xejn.

543
00:26:35,650 --> 00:26:37,075
Hija biss jistenna sbieħ.

544
00:26:37,075 --> 00:26:43,650
Dak li nistgħu nagħmlu huwa nistgħu żid klikk
handler, onclick ugwali this.flip,

545
00:26:43,650 --> 00:26:44,820
u aħna ser jiddefinixxu flip aktar tard.

546
00:26:44,820 --> 00:26:47,120
Imma bażikament, onclick
hija funzjoni li

547
00:26:47,120 --> 00:26:48,675
gets imsejħa meta l-utent klikks dan.

548
00:26:48,675 --> 00:26:52,330
>> Allura l-buttuna se tkun taf
meta huwa kien għafast.

549
00:26:52,330 --> 00:26:54,750
Marru huwa kien għafast,
se flip-biljett.

550
00:26:54,750 --> 00:26:58,382
Huwa tip ta 'prodotti simili tiegħek
Guy kunsinna pizza.

551
00:26:58,382 --> 00:27:01,590
Int simili, id-dritt, kull meta xi ħadd
jitlob me, I ser jagħti pizza, id-dritt?

552
00:27:01,590 --> 00:27:03,420
>> Tirreġistra dan semmiegħ.

553
00:27:03,420 --> 00:27:04,530
Inti tisma għal avveniment.

554
00:27:04,530 --> 00:27:07,657
Ikollok imsejħa, u meta l-
avveniment jiġri, inti tagħmel xi ħaġa.

555
00:27:07,657 --> 00:27:08,240
Ikollok pizza.

556
00:27:08,240 --> 00:27:11,480
F'dan il-każ, meta int
għafast, inti flip-biljett.

557
00:27:11,480 --> 00:27:14,560
>> U għalhekk għandna bżonn li jiddefinixxu
funzjoni li se flip-biljett,

558
00:27:14,560 --> 00:27:17,930
hekk aħna ser jiktbu dak id-dritt
hawn, flip funzjoni.

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

560
00:27:20,850 --> 00:27:23,680
U għalhekk x'taħseb flip se tagħmel?

561
00:27:23,680 --> 00:27:27,180
Għal darb'oħra dan gets imsejħa meta
aħna ikklikkja l-buttuna flip.

562
00:27:27,180 --> 00:27:29,406
X'għandu il-flip funzjoni do?

563
00:27:29,406 --> 00:27:34,136
>> UDJENZA: Bidla this.state.front
mill-vera għall falza, foloz li veru.

564
00:27:34,136 --> 00:27:38,420
>> Neel Mehta: Yep, so tieħu kull
this.front is-- l-istat ta 'quddiem hu.

565
00:27:38,420 --> 00:27:40,930
Ħu l-istat ta 'quddiem, jekk
huwa veru, jagħmilha falza.

566
00:27:40,930 --> 00:27:42,530
Jekk huwa falz, jagħmilha vera, right?

567
00:27:42,530 --> 00:27:45,330
Mela ejja jippruvaw dan.

568
00:27:45,330 --> 00:27:48,240
>> Inti ma tistax tbiddel l-istat
biss billi tagħmel this.state.

569
00:27:48,240 --> 00:27:50,380
Inti ma tistax tagħmel dan.

570
00:27:50,380 --> 00:27:52,030
Inti ma tistax tagħmel dan.

571
00:27:52,030 --> 00:27:55,810
Inti għandek tuża l-funzjoni
imsejħa this.setState.

572
00:27:55,810 --> 00:28:03,230
>> Allura inti tista 'tgħid this.setState quddiem
kolon dan fejn, għal darb'oħra, il exclamation

573
00:28:03,230 --> 00:28:04,330
punt ifisser l-oppost.

574
00:28:04,330 --> 00:28:07,420
I raden jekk dan. state.front
huwa veru, dan ser idur falza.

575
00:28:07,420 --> 00:28:09,170
Allura aħna ser jistabbilixxu l-istat
mill-vera għall falza.

576
00:28:09,170 --> 00:28:11,430
Jekk huwa falz, aħna ser
sett huwa falz li veru.

577
00:28:11,430 --> 00:28:17,210
>> Just avviż li waqqafna u jiksbu ftit
differenti, u għalhekk ejja tipprova dan.

578
00:28:17,210 --> 00:28:18,675
Bing Bada, ħarsa lejn din.

579
00:28:18,675 --> 00:28:21,810
Il-buttuna flip issa se
jaqilbu l-quddiem għal wara istat.

580
00:28:21,810 --> 00:28:24,990
>> U hekk hawn fejn tara
ftit tal-maġija ta jirreaġixxu.

581
00:28:24,990 --> 00:28:28,420
Simili aħna qatt told lill terġa 'jagħti.

582
00:28:28,420 --> 00:28:30,910
Aħna qatt ma qal dan tiġbed xejn.

583
00:28:30,910 --> 00:28:32,630
Jekk inti qed tagħmel dan
mingħajr React, youd

584
00:28:32,630 --> 00:28:34,588
jkunu to-- simili meta l-
buttuna flip huwa għafast,

585
00:28:34,588 --> 00:28:37,290
youd għandek għid li
manwalment mill-ġdid tirrendi, id-dritt?

586
00:28:37,290 --> 00:28:43,050
>> Jirreaġixxu qed verament jibred fid li jekk inti
tagħtiha stat u proprjetajiet ċerti,

587
00:28:43,050 --> 00:28:45,760
dejjem se tirrendi
l-istess ħaġa eżatt.

588
00:28:45,760 --> 00:28:48,690
U hekk meta aħna qatt nagħmlu l-bidla
l-istat u l-proprjetajiet,

589
00:28:48,690 --> 00:28:50,819
jirreaġixxu biss jerġa 'jagħmel il-ħaġa sħiħa.

590
00:28:50,819 --> 00:28:52,860
Hija jaf li hemm
korrispondenza wieħed għal wieħed

591
00:28:52,860 --> 00:28:57,270
bejn l-istat u l-parametru u HTML.

592
00:28:57,270 --> 00:29:00,110
Allura kull meta waħda minn dawk
bidliet minn permezz ta 'stat stabbiliti,

593
00:29:00,110 --> 00:29:03,750
se bidla kif l-
pay jerġa 'mogħtija.

594
00:29:03,750 --> 00:29:06,650
U hekk bażikament React huwa simili
għalikom għall-bidla.

595
00:29:06,650 --> 00:29:09,870
>> Kull meta tbiddel xi ħaġa,
dan ser jerġa 'jagħti l-paġna kollha.

596
00:29:09,870 --> 00:29:12,480
U jekk ħsejjes ineffiċjenti,
huwa peress li jkun,

597
00:29:12,480 --> 00:29:15,050
iżda jirreaġixxu juża ħaġa
imsejħa DOM Shadow.

598
00:29:15,050 --> 00:29:19,950
Minflok tpinġija il-paġna direttament,
jżomm il-siġra HTML virtwali fil-memorja.

599
00:29:19,950 --> 00:29:23,620
>> You know, HTML huwa bħal siġra,
bħal struttura ġerarkika data.

600
00:29:23,620 --> 00:29:28,990
Hija żżomm siġra foloz fil-memorja,
u kull meta inti aġġornament il-paġna,

601
00:29:28,990 --> 00:29:31,940
dan ser tiġbed foloz ieħor
siġra, u dan ser jikkalkula

602
00:29:31,940 --> 00:29:35,120
dak jibdlu għandha bżonn biex tagħmel l-
paġna li jagħmlu ż-żewġ siġar ugwali.

603
00:29:35,120 --> 00:29:38,540
Allura bażikament, huwa prattikament
ri-tirrendi ħafna.

604
00:29:38,540 --> 00:29:41,540
U allura biss bħall-bidliet l-
paġna fil-ftit tweaks kif meħtieġ,

605
00:29:41,540 --> 00:29:44,240
hekk huwa ħafna, ħafna, effiċjenti ħafna.

606
00:29:44,240 --> 00:29:46,970
>> Allura bażikament Jirreaġixxu se
kull meta inti tbiddel xi ħaġa,

607
00:29:46,970 --> 00:29:49,010
dan ser jerġa 'jagħti l-paġna prattikament.

608
00:29:49,010 --> 00:29:52,830
Hija ser ċifra barra dak li għandi bżonn biex
bidla li jagħmlu l-paġna reali jirriflettu

609
00:29:52,830 --> 00:29:55,602
il-paġna virtwali, u inneħħu tagħmel dan.

610
00:29:55,602 --> 00:29:56,560
Dik hija l-DOM virtwali.

611
00:29:56,560 --> 00:29:59,350
Huwa wieħed mill-akbar
karatteristiċi ta 'Jirreaġixxu.

612
00:29:59,350 --> 00:30:00,880
>> Does li jagħmel sens?

613
00:30:00,880 --> 00:30:01,540
Kwalunkwe mistoqsijiet?

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

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

616
00:30:05,568 --> 00:30:08,969
>> UDJENZA: Kif ma
tqabbel xorta għall-MVC

617
00:30:08,969 --> 00:30:10,760
li tkellimna dwar
qabel riżorsi bħal.

618
00:30:10,760 --> 00:30:13,527
>> Neel Mehta: Yeah, il-kwistjoni
huwa kif ma tqabbel MVC?

619
00:30:13,527 --> 00:30:14,610
Inti mistoqsi dwar ir-riżorsi.

620
00:30:14,610 --> 00:30:16,445
Well, ejja nitkellmu dwar kif din taħdem.

621
00:30:16,445 --> 00:30:18,190
>> Fil MVC, youd taġġorna l-mudell.

622
00:30:18,190 --> 00:30:20,560
F'dan il-każ aħna'd jkollhom mudell biljett.

623
00:30:20,560 --> 00:30:24,540
Il-fehma se jkollu l-
buttuna flip, u l-kontroll

624
00:30:24,540 --> 00:30:26,310
ikollu l-funzjoni flip.

625
00:30:26,310 --> 00:30:28,450
Allura l-opinjoni ser tgħid il-
kontrollur li flip flip.

626
00:30:28,450 --> 00:30:30,370
Flip tell l
mudell għall-bidla, id-dritt?

627
00:30:30,370 --> 00:30:33,915
>> U hekk meta inti tagħmel MVC, inti
jisimgħu għall-mudell għall-bidla,

628
00:30:33,915 --> 00:30:37,150
u għandek terġa 'tirrendi l-opinjoni xieraq.

629
00:30:37,150 --> 00:30:39,210
Jew inti biss għandek simili
għandhom il-kontrollur.

630
00:30:39,210 --> 00:30:42,418
Stenna għall-mudell għall-bidla, u mbagħad
pick u jagħżlu parti ta qisha ħaġa

631
00:30:42,418 --> 00:30:44,032
għall-bidla.

632
00:30:44,032 --> 00:30:45,740
Hawnhekk għandna ħaġa waħda,
iżda fil-app kbir,

633
00:30:45,740 --> 00:30:48,510
inti għandek tixtieq tiftakar dak
il-bidla f'kull post wieħed,

634
00:30:48,510 --> 00:30:50,290
dan huwa ftit annoying.

635
00:30:50,290 --> 00:30:53,670
U għalhekk Jirreaġixxu huwa sabiħ
minħabba li għandu Dom Shadow.

636
00:30:53,670 --> 00:30:56,040
Hija tista 'taffordja li biss
jikteb il-ħaġa sħiħa.

637
00:30:56,040 --> 00:30:58,680
Inti ma għandekx selettiv
bħal raden dak li taġġorna.

638
00:30:58,680 --> 00:31:02,186
>> Fuq Facebook jekk inti tixtieq
jiksbu messaġġ ġdid, fil MVC,

639
00:31:02,186 --> 00:31:04,060
youd għandek tiftakar,
OK, jibdlu l-affarijiet

640
00:31:04,060 --> 00:31:06,260
fil-quċċata tal-
paġna, l-ikona messaġġ.

641
00:31:06,260 --> 00:31:08,290
Wkoll pop tieqa ġdida fil-qiegħ.

642
00:31:08,290 --> 00:31:10,070
Wkoll tagħmel xi ħaġa ġdida f'dak tieqa.

643
00:31:10,070 --> 00:31:11,060
Wkoll play ħoss.

644
00:31:11,060 --> 00:31:13,150
>> Li l-lott ta 'għalf
ser jispiċċaw fl-istess ħin.

645
00:31:13,150 --> 00:31:15,320
U hekk jekk inti ma
jkollhom Dom Shadow, youd

646
00:31:15,320 --> 00:31:18,740
għandek tagħmel dan manwalment minħabba
inti ma tistax jeħles mill-paġna kollha.

647
00:31:18,740 --> 00:31:21,430
Inti ma tistax taffordja li, hekk ikollok
għall-bidla kull ħaġa manwalment,

648
00:31:21,430 --> 00:31:23,990
li huwa verament annoying fil MVC.

649
00:31:23,990 --> 00:31:27,640
>> Dan sabiex tkun
Thrifty, huma selettiv

650
00:31:27,640 --> 00:31:30,750
taġġorna l-paġna, li hija
effiċjenti, iżda wkoll annoying.

651
00:31:30,750 --> 00:31:34,002
Fil React, minħabba l-Shadow
Dom, ikollok kemm affarijiet b'xejn.

652
00:31:34,002 --> 00:31:35,710
Huwa effiċjenti minħabba
tal-Dom Shadow.

653
00:31:35,710 --> 00:31:37,210
L-ostaklu Qed taġġorna l-paġna.

654
00:31:37,210 --> 00:31:40,292
Mhuwiex tagħmel l-manipulazzjoni tas-siġar.

655
00:31:40,292 --> 00:31:41,250
Ikollok l-effiċjenza.

656
00:31:41,250 --> 00:31:45,420
Tista 'wkoll tikseb l-faċilità ta' użu minħabba
jekk inti biss jiktbu l-paġna kollha,

657
00:31:45,420 --> 00:31:48,970
imma inti biss taf, id-dritt, l-affarijiet
ser ikunu fuq il-paġna x'imkien.

658
00:31:48,970 --> 00:31:51,180
Jista 'jkun f'post differenti, iżda
li għaddej biex tkun fuq il-paġna, right?

659
00:31:51,180 --> 00:31:52,860
Allura inti biss terġa 'mogħtija
il-ħaġa sħiħa prattikament,

660
00:31:52,860 --> 00:31:55,540
u inti tista 'tagħmel koppja
bidliet fil-paġna innifsu.

661
00:31:55,540 --> 00:31:57,850
>> Allura, għal darb'oħra, fil MVC inti
jkollhom jagħżlu

662
00:31:57,850 --> 00:32:01,840
bejn l-użu faċli u l-effiċjenza,
u jirreaġixxu, ikollok tnejn.

663
00:32:01,840 --> 00:32:04,020
Allura huwa aħjar.

664
00:32:04,020 --> 00:32:05,220
Jagħmel sens?

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

666
00:32:06,676 --> 00:32:12,080
>> OK, so ejja ara ejja nitkellmu
ftit dwar pass 4,

667
00:32:12,080 --> 00:32:14,740
kif nistgħu ssodata komponenti.

668
00:32:14,740 --> 00:32:16,260
Allura aħna għandna dan id-dritt issa.

669
00:32:16,260 --> 00:32:19,420
Għandna jibred buttuna tagħna ftit.

670
00:32:19,420 --> 00:32:23,157
Nistgħu flip lura u
raba, u li kollox ma.

671
00:32:23,157 --> 00:32:24,990
Ejja ngħidu li rridu
jkollhom komponent ieħor.

672
00:32:24,990 --> 00:32:28,730
Ejja ngħidu app flashcard tagħna għandhom
tinkludi lista ta 'l-karti

673
00:32:28,730 --> 00:32:31,520
li għandek, sabiex ifisser li aħna
għandu jkollhom komponent ieħor.

674
00:32:31,520 --> 00:32:32,970
Well, forsi sejħa hija ta 'fehma lista.

675
00:32:32,970 --> 00:32:36,200
Ejja jagħmlu ħsieb lista li
tikkoeżisti mal-CardView,

676
00:32:36,200 --> 00:32:39,680
u din il-fehma lista u CardView
ser simili jaħdmu flimkien.

677
00:32:39,680 --> 00:32:43,190
U inti tista 'tgħaqqad lilhom
biex tagħmel app tagħna għalik.

678
00:32:43,190 --> 00:32:45,160
>> Allura l-ewwel, ejja jagħmlu
koppja aktar cards dritt.

679
00:32:45,160 --> 00:32:46,370
Ejja ngħidu, liema karti?

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

681
00:32:49,619 --> 00:32:51,910
U biss so I ma jkollhom
bore inti ma ittajpjar fil,

682
00:32:51,910 --> 00:32:53,410
Jien biss ser jibagħtu kopja tagħha minn hawn.

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

684
00:33:01,664 --> 00:33:03,580
U hekk jien ser ma
tagħtiha biss biljett wieħed.

685
00:33:03,580 --> 00:33:06,910
Jien ser tagħtiha l-firxa ta 'karti.

686
00:33:06,910 --> 00:33:10,240
Allura l-ewwel l-apps
ser break għal issa.

687
00:33:10,240 --> 00:33:14,717
Kull dritt, hekk aħna qed tmur biex tagħmel
dan jistgħu jimmaniġġjaw karti multipli.

688
00:33:14,717 --> 00:33:17,800
Allura l-ewwel, aħna qed tmur biex jagħtuh, mhux
biss biljett wieħed iżda firxa ta 'karti,

689
00:33:17,800 --> 00:33:18,700
bħal lista ta 'karti.

690
00:33:18,700 --> 00:33:20,980
U f'dan il-każ, għandna tlieta minnhom.

691
00:33:20,980 --> 00:33:27,280
>> Kull dritt, hekk so app huwa
se tikseb il-lista cards,

692
00:33:27,280 --> 00:33:29,870
u li għaddej biex jiddeċiedi liema
wieħed biex turi li l-CardView.

693
00:33:29,870 --> 00:33:33,740
Il CardView jista 'biss
tirrendi biljett wieħed, iżda l-app

694
00:33:33,740 --> 00:33:37,610
gets lista ta 'l-karti, id-dritt?

695
00:33:37,610 --> 00:33:40,820
>> Allura meta inti ċifra barra wieħed
karta li tagħti lill CardView,

696
00:33:40,820 --> 00:33:44,660
kif tista raden inti tkun tista
biex jagħmlu deċiżjoni dwar liema karta

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

698
00:33:47,064 --> 00:33:49,980
Biex jagħtuk ħjiel, huwa temporanjament
Int ser tkun viewing karta ċerta.

699
00:33:49,980 --> 00:33:53,260
Jekk inti jġedded il-paġna, inti ser
biss jmorru lura għall-ewwel karta.

700
00:33:53,260 --> 00:33:55,464
Dak OK għaliex dan huwa temporanju.

701
00:33:55,464 --> 00:33:56,630
Dak teknika tista nużaw?

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

703
00:34:02,534 --> 00:34:08,760
>> UDJENZA: Inti tista 'tagħmel varjabbli
hekk bħad kellek quddiem.

704
00:34:08,760 --> 00:34:11,989
Huwa dan veru, inti tista
jkollhom karta attwali ugwali 1?

705
00:34:11,989 --> 00:34:14,150
>> Neel Mehta: Yeah, hekk aħna
tixtieq li jkollok istat, id-dritt?

706
00:34:14,150 --> 00:34:16,080
Inti tuża istat fil-
komponent biex insemmu

707
00:34:16,080 --> 00:34:17,288
li card do aħna rridu nġibu.

708
00:34:17,288 --> 00:34:19,290
Bħal għandna lista ta
l-karti, aħna ser

709
00:34:19,290 --> 00:34:21,630
użu istat biex insemmu
wieħed mill-ewwel karta,

710
00:34:21,630 --> 00:34:23,710
tieni karta, karta terzi, u l-bqija.

711
00:34:23,710 --> 00:34:28,760
>> Allura app hekk app se tikseb
għandhom il-funzjoni getInitialState,

712
00:34:28,760 --> 00:34:35,020
ritorn funzjoni getInitialState.

713
00:34:35,020 --> 00:34:39,929
U aħna ser biss jgħidu activeIndex 0.

714
00:34:39,929 --> 00:34:42,889
Allura issa app tagħna tkun hija stess Istat.

715
00:34:42,889 --> 00:34:47,179
>> U hekk issa 'l quddiem tirrendi, biex insemmu
karta, ejja biss jmorru għall-firxa

716
00:34:47,179 --> 00:34:49,969
u grab l-ħaġa f'dak l-indiċi.

717
00:34:49,969 --> 00:34:53,580
This.props.cards indaqs karta Agħżel
this.state.activeIndex.

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

719
00:34:56,469 --> 00:35:00,162
Allura kif tara hawn,-reffieda u
l-istat attwalment jaħdmu flimkien.

720
00:35:00,162 --> 00:35:08,990
Allura issa li għandna activeCard tagħna,
aħna ser sejħa hija activeCard,

721
00:35:08,990 --> 00:35:10,470
u ejja ara jekk dan jaħdem.

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, li kien żball test.

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
>> Kessaħ, Yep, hekk issa konna lura
fejn konna qabel, id-dritt?

729
00:35:54,840 --> 00:35:57,100
Programm istess qodma ħlief
issa nistgħu nappoġġaw

730
00:35:57,100 --> 00:35:59,390
lista ta 'karti, mhux biss biljett wieħed.

731
00:35:59,390 --> 00:36:04,130
U issa, għal darb'oħra, jekk aħna jibdlu l-
activeIndex, nistgħu mmorru 0-1,

732
00:36:04,130 --> 00:36:07,330
u issa li t-tieni karta,
u mbagħad aħna marru għal 0.

733
00:36:07,330 --> 00:36:10,390
Allura hawnhekk ġdid
souped-up verżjoni ta 'tagħna.

734
00:36:10,390 --> 00:36:16,000
>> OK, hekk issa ejja għandhom fehma lista li
turi l-karti fil-programm tiegħek,

735
00:36:16,000 --> 00:36:19,980
hekk aħna ser tagħmel ġdid
komponent imsejħa listView.

736
00:36:19,980 --> 00:36:22,155
Ħalli listView ugwali react.createClass.

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

738
00:36:32,890 --> 00:36:38,800
Allura irridu li jirrendi unordered
lista bil-partita lista għal kull biljett.

739
00:36:38,800 --> 00:36:41,490
U hekk aħna mazz ta 'karti.

740
00:36:41,490 --> 00:36:44,990
Irridu partita lista waħda
għal kull karta, right?

741
00:36:44,990 --> 00:36:47,490
Stajna nagħmlu a għal loop jew
xi ħaġa li tagħmel oġġett lista ġdida.

742
00:36:47,490 --> 00:36:50,522
Iżda l-mod inti tagħmel dan fil
Jirreaġixxu, uża ħaġa imsejħa mappa.

743
00:36:50,522 --> 00:36:57,150
Mappa hija għodda jew funzjoni tuża
li għal kull partita, runs xi funzjoni,

744
00:36:57,150 --> 00:36:59,510
jieħu valur tar-ritorn, u
jagħtik dak lura.

745
00:36:59,510 --> 00:37:06,310
>> Allura bħala eżempju, aħna għandna l-firxa
1, 2, function-- 3.map u dan

746
00:37:06,310 --> 00:37:12,120
huwa shorthand għal
function-- x vleġġa x darbiet x.

747
00:37:12,120 --> 00:37:16,110
Dan jgħid, għal kull numru
f'1, 2, 3, teħodha.

748
00:37:16,110 --> 00:37:17,800
Kwadru, u tagħtiha lura.

749
00:37:17,800 --> 00:37:22,090
Allura dak li taħseb 1,
2, 3.map x tmur x darbiet

750
00:37:22,090 --> 00:37:25,480
x jagħtik lura tingħata
li din il-funzjoni huwa

751
00:37:25,480 --> 00:37:27,680
jimxu fuq kull element ta 'dak array.

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

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

754
00:37:32,190 --> 00:37:35,709
>> Neel Mehta: Yep, 1, 4, 9
għaliex inti tagħmel 1 ħinijiet 1.

755
00:37:35,709 --> 00:37:36,500
Li jagħtik wieħed.

756
00:37:36,500 --> 00:37:37,690
Dik hija l-ewwel element.

757
00:37:37,690 --> 00:37:38,530
>> 2 darbiet 2 hija 4.

758
00:37:38,530 --> 00:37:39,570
Li tieni element.

759
00:37:39,570 --> 00:37:40,310
3 darbiet 3 huwa ta '9.

760
00:37:40,310 --> 00:37:41,540
Li l-element terzi.

761
00:37:41,540 --> 00:37:42,640
Jagħmel sens?

762
00:37:42,640 --> 00:37:45,015
Allura mappa għandha teknika inti
użu fil programmaturi funzjonali,

763
00:37:45,015 --> 00:37:48,090
l-istil ġdid ta '
programmazzjoni li jagħmel xi ħaġa

764
00:37:48,090 --> 00:37:50,500
għal kull element fil-lista tiegħek.

765
00:37:50,500 --> 00:37:51,970
U hekk dan ħsejjes familjari.

766
00:37:51,970 --> 00:37:53,370
Għandna lista ta 'karti.

767
00:37:53,370 --> 00:37:56,860
Aħna rridu nġibu oġġett lista għal kull
waħda, hekk aħna ser biss użu mappa hawn.

768
00:37:56,860 --> 00:38:00,250
Aħna ser jgħidu, let lista ugwali
this.props, karti, mappa.

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

770
00:38:10,580 --> 00:38:15,070
>> U hekk jingħataw kard, aħna qed
ser jiġġeneraw oġġett lista

771
00:38:15,070 --> 00:38:17,580
mal-kontenut ġenb dik il-karta ta 'dan.

772
00:38:17,580 --> 00:38:20,660
Ejja ngħidu biss li rridu li jagħtu
il-karti kwistjoni hekk card.question.

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

774
00:38:24,990 --> 00:38:30,649
Allura din il-lista fih
firxa ta 'l LI jew Items Lista

775
00:38:30,649 --> 00:38:32,440
fejn hemm lista waħda
oġġett għal kull karta,

776
00:38:32,440 --> 00:38:35,150
u li fiha l-kwistjoni cards.

777
00:38:35,150 --> 00:38:37,640
Jagħmel sens?

778
00:38:37,640 --> 00:38:39,450
>> Kessaħ, hekk issa ejja
attwalment print li l-.

779
00:38:39,450 --> 00:38:46,521
Allura aħna se terġa 'lura ul.

780
00:38:46,521 --> 00:38:49,020
Ġewwa dik il-lista unordered,
aħna ser biss stick-lista sħiħa

781
00:38:49,020 --> 00:38:49,890
li tana.

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

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

784
00:38:53,350 --> 00:38:56,060
>> Kull dritt, hekk issa dan
lista ħsieb xogħlijiet biss issib.

785
00:38:56,060 --> 00:38:59,842
Kwalunkwe mistoqsijiet dwar l-opinjoni lista?

786
00:38:59,842 --> 00:39:01,270
Għandek mazz ta 'karti.

787
00:39:01,270 --> 00:39:02,800
Inti tagħmel oġġett lista għal kull biljett.

788
00:39:02,800 --> 00:39:05,466
U inti tpoġġihom ġewwa unordered
lista, u inti tagħti lura.

789
00:39:05,466 --> 00:39:09,410
Allura issa ejja taġixxi hekk aħna ssodata
dan ġewwa ta 'app tagħna,

790
00:39:09,410 --> 00:39:14,310
hekk nistgħu nagħmlu dan, lista ħsieb.

791
00:39:14,310 --> 00:39:17,070
What do argument aħna jgħaddu lista fehma?

792
00:39:17,070 --> 00:39:18,320
What proprjetajiet nagħtu dan?

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

794
00:39:25,111 --> 00:39:26,860
Ftakar, jekk inti tagħti
dan mazz ta 'karti,

795
00:39:26,860 --> 00:39:29,590
dan ser tagħmel il-lista
ħsieb għall dawk il-karti.

796
00:39:29,590 --> 00:39:32,267
Allura dak li aħna jgħaddu
hawnhekk bħala l-argument?

797
00:39:32,267 --> 00:39:33,350
UDJENZA: Lista ta 'karti?

798
00:39:33,350 --> 00:39:37,130
Neel Mehta: Yeah, cards hekk
ugwali this.props.cards, id-dritt?

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

800
00:39:39,850 --> 00:39:44,370
U għalhekk l-unika problema
hija li inti tista 'biss

801
00:39:44,370 --> 00:39:48,600
daru waħda element ogħla livell fl tirrendi,
sabiex inti ħadthom ltqajna biex wrap fil div.

802
00:39:48,600 --> 00:39:49,100
Huwa stramb.

803
00:39:49,100 --> 00:39:56,190

804
00:39:56,190 --> 00:39:57,530
Mela ejja ara jekk dik.

805
00:39:57,530 --> 00:40:09,790

806
00:40:09,790 --> 00:40:10,560
Does li jaħdmu?

807
00:40:10,560 --> 00:40:29,774

808
00:40:29,774 --> 00:40:31,030
>> Yep, hemm inti tmur.

809
00:40:31,030 --> 00:40:33,700
Allura issa għandna lista
ta 'karti fil-qiegħ,

810
00:40:33,700 --> 00:40:36,180
u mbagħad għandna tagħna
CardView ruħha fuq,

811
00:40:36,180 --> 00:40:40,486
u li se flip bejn
iż-żewġ naħat tal-card.

812
00:40:40,486 --> 00:40:42,610
Issa ma li jagħmel sens kif I ma li?

813
00:40:42,610 --> 00:40:45,165

814
00:40:45,165 --> 00:40:46,790
Yeah, hekk darb'oħra, għandna żewġ komponenti.

815
00:40:46,790 --> 00:40:49,666
L-ewwel stampi tal-komponenti
out kull biljett fil-lista.

816
00:40:49,666 --> 00:40:50,540
Dik hija l-fehma lista.

817
00:40:50,540 --> 00:40:54,770
U t-tieni komponent
prints out biss dik il-karta.

818
00:40:54,770 --> 00:40:58,840
Jekk inti tagħti karta ċerta, dan ser
jistampa l-informazzjoni dwar dik il-karta

819
00:40:58,840 --> 00:41:01,870
u ħalli inti flip quddiem u lura.

820
00:41:01,870 --> 00:41:05,850
>> Mela jekk irridu, nistgħu nippruvaw u jitkellmu
dwar jżid xi karatteristiċi ġodda għal dan.

821
00:41:05,850 --> 00:41:09,482
Inkella nistgħu nitkellmu ftit aktar
dwar tal-veloċità ta 'reattur,

822
00:41:09,482 --> 00:41:11,190
jew nistgħu twieġeb
mistoqsijiet li inti jista 'jkollok

823
00:41:11,190 --> 00:41:15,050
minħabba li dawn huma kollha tal-partijiet ewlenin
ta jirreaġixxu li nixtieq li nitkellmu dwar.

824
00:41:15,050 --> 00:41:16,540
Aħna tista 'tmur quddiem.

825
00:41:16,540 --> 00:41:17,590
Nistgħu twieġeb mistoqsijiet.

826
00:41:17,590 --> 00:41:18,560
Xi trid.

827
00:41:18,560 --> 00:41:21,694

828
00:41:21,694 --> 00:41:24,205
>> UDJENZA: Tista 'tuża
JSX fl normali JavaScript?

829
00:41:24,205 --> 00:41:27,150
Jew hija li xi ħaġa li
daħal mal-[inaudible]?

830
00:41:27,150 --> 00:41:30,760
>> Neel Mehta: Il-kwistjoni hija tista
tuża JSX ma normal JavaScript?

831
00:41:30,760 --> 00:41:32,620
It-tweġiba hija iva.

832
00:41:32,620 --> 00:41:41,070
JSX huwa biss mod ta 'tieħu tiegħek
JavaScript li għandha HTML ġewwa ta 'dan,

833
00:41:41,070 --> 00:41:44,215
u jikkompila fis JavaScript li
ma jkollux HTML ġewwa ta 'dan.

834
00:41:44,215 --> 00:41:47,880
Allura avviż that-- hekk avviż hawn.

835
00:41:47,880 --> 00:41:50,820
Dan qisu għandek simili div
u inti għandek Jittieħed ġewwa ta 'dan.

836
00:41:50,820 --> 00:41:54,970
>> Li jikkompila għal JavaScript li
bħall jiġġenera l-istess ħaġa.

837
00:41:54,970 --> 00:41:59,590
I raden dak li jien tgħid huwa li
JSX huwa biss sintattika, simili huwa

838
00:41:59,590 --> 00:42:03,530
a Preprocessor għall JavaScript ħafna
bħal PHP huwa Preprocessor għall HTML.

839
00:42:03,530 --> 00:42:05,490
JSC huwa Preprocessor
għal JavaScript li tikri

840
00:42:05,490 --> 00:42:12,970
inti tpoġġi HTML ġewwa tal tiegħek JavaScript.

841
00:42:12,970 --> 00:42:16,425
U hekk jekk inti għandek l-transformer dritt
li hija ħaġa imsejjaħ [inaudible],

842
00:42:16,425 --> 00:42:17,300
li se jittrasforma.

843
00:42:17,300 --> 00:42:19,360
Il Preprocessor dritt,
dan ser tavżak tagħmel dan.

844
00:42:19,360 --> 00:42:20,235
>> UDJENZA: [inaudible]

845
00:42:20,235 --> 00:42:23,026
Neel Mehta: Normalment inti m'għandekx bżonn
li jitqiegħdu HTML ġewwa tal JavaScript

846
00:42:23,026 --> 00:42:24,110
sakemm tiegħek tagħmel jirreaġixxu.

847
00:42:24,110 --> 00:42:27,146
Iżda int tista 'tagħmel dan xorta waħda.

848
00:42:27,146 --> 00:42:27,645
Yep?

849
00:42:27,645 --> 00:42:29,353
>> UDJENZA: Naħseb li inti
kienu deskritti Jirreaġixxu

850
00:42:29,353 --> 00:42:31,970
bħala lingwa programing funzjonali.

851
00:42:31,970 --> 00:42:35,646
Imxejna qed jitgħallmu C fil CS50.

852
00:42:35,646 --> 00:42:38,032
Huwa C wkoll f'lingwa funzjonali?

853
00:42:38,032 --> 00:42:39,990
Neel Mehta: Għalhekk il-kwistjoni
huwa dwar funzjonali

854
00:42:39,990 --> 00:42:43,010
versus ħaġa oħra msejħa
programmazzjoni imperattiv jew proċedurali.

855
00:42:43,010 --> 00:42:44,820
Hemm żewġ tipi ta 'programmi popolari.

856
00:42:44,820 --> 00:42:48,550
Wieħed sejjaħ proċedurali, li
hija dwar simili jikkmanda jagħmlu,

857
00:42:48,550 --> 00:42:51,510
u waħda hija funzjonali, li hija kollha
dwar li jkollhom funzjonijiet u li

858
00:42:51,510 --> 00:42:52,930
input u output ta 'dawk.

859
00:42:52,930 --> 00:42:55,930
Jirreaġixxu hija paradigma funzjonali.

860
00:42:55,930 --> 00:42:58,010
C hija paradigma proċedurali ħafna.

861
00:42:58,010 --> 00:43:02,360
>> U bħala eżempju, C per eżempju,
inti ma tagħmel dan il-mod ta 'dikjarazzjoni

862
00:43:02,360 --> 00:43:04,390
ta 'kif issir il-programm, id-dritt?

863
00:43:04,390 --> 00:43:06,826
Għandek tgħid, jistampa din.

864
00:43:06,826 --> 00:43:07,950
Bidla din l-istruttura tad-data.

865
00:43:07,950 --> 00:43:08,530
Stampa din.

866
00:43:08,530 --> 00:43:10,160
Dan kollu dwar jikkmanda.

867
00:43:10,160 --> 00:43:12,640
>> Fil jirreaġixxu, hemm Ma
li jikkmanda ħafna.

868
00:43:12,640 --> 00:43:15,145
Dan kollu dwar li jkollhom
komponenti inti tpoġġi flimkien.

869
00:43:15,145 --> 00:43:16,300
Huma qed simili funzjonijiet.

870
00:43:16,300 --> 00:43:26,360
Għandek bħal funzjoni
imsejħa CardView,

871
00:43:26,360 --> 00:43:28,680
li huwa funzjoni
li għandha input, output,

872
00:43:28,680 --> 00:43:30,660
u għalhekk Jirreaġixxu hija kollha
dwar din il-filosofija

873
00:43:30,660 --> 00:43:32,700
us ta having-- ikollok data.

874
00:43:32,700 --> 00:43:34,910
Inti għaddiha dan
algoritmu, u dan ser

875
00:43:34,910 --> 00:43:36,800
output HTML li inti
kemm stampati-paġna,

876
00:43:36,800 --> 00:43:39,180
u hekk ikollok biex
tinbena mill-biċċa biċċa.

877
00:43:39,180 --> 00:43:42,800
>> Allura biex tiġbed metafora għal dak
I said qabel, inti taf kif

878
00:43:42,800 --> 00:43:47,050
fuq Facebook jekk ikollok messaġġ,
u inti tagħżel liema partijiet biex taġġorna,

879
00:43:47,050 --> 00:43:47,882
li l-proċedura.

880
00:43:47,882 --> 00:43:48,840
Huwa imperattiv, id-dritt?

881
00:43:48,840 --> 00:43:49,806
OK, I ltqajna messaġġ.

882
00:43:49,806 --> 00:43:50,930
Ejja tbiddel kont hemmhekk.

883
00:43:50,930 --> 00:43:52,110
>> Ejja pop tieqa hawn.

884
00:43:52,110 --> 00:43:52,780
Ejja tbiddel kont hemmhekk.

885
00:43:52,780 --> 00:43:53,700
Ejja tiġbed dan hawn.

886
00:43:53,700 --> 00:43:55,220
Li l-għażla proċedurali magħmula.

887
00:43:55,220 --> 00:44:00,240
>> Dak hu affarijiet simili angolari,
Boost, Sinsla, oqfsa oħra jużaw.

888
00:44:00,240 --> 00:44:01,200
Jirreaġixxu hija funzjonali.

889
00:44:01,200 --> 00:44:03,324
Huwa mod differenti ħafna
ta 'ħsieb dwar affarijiet.

890
00:44:03,324 --> 00:44:07,950
Huwa jieħu din l-idea ta ejja jkollhom
funzjonijiet jew algoritmi li ser ikollok

891
00:44:07,950 --> 00:44:08,800
tagħtiha data.

892
00:44:08,800 --> 00:44:11,820
Hija ser bżiq out dak li
għandu jkun, u l-kompjuter

893
00:44:11,820 --> 00:44:13,490
se jieħdu ħsieb ta 'l-użin out.

894
00:44:13,490 --> 00:44:15,890
Inti ma jimmaniġġaw it yourself.

895
00:44:15,890 --> 00:44:18,470
Does li jagħmel ftit ta 'sens?

896
00:44:18,470 --> 00:44:18,970
Yeah?

897
00:44:18,970 --> 00:44:24,180
>> UDJENZA: Fi lingwa funzjonali,
kollox jiġri f'daqqa?

898
00:44:24,180 --> 00:44:26,800
>> Neel Mehta: Le, l-affarijiet jiġri fl-ordni.

899
00:44:26,800 --> 00:44:29,320
Bħal hawn hemm għadu
ordni, iżda ma

900
00:44:29,320 --> 00:44:32,390
jiġri fl-ordni ta like
ifaħħru, kmand, kmand.

901
00:44:32,390 --> 00:44:36,459
Dan jiġri fl-ordni ta
funzjoni jagħtik output.

902
00:44:36,459 --> 00:44:37,750
Poġġi dan in funzjoni oħra.

903
00:44:37,750 --> 00:44:39,550
Poġġi dan in ieħor
funzjoni, funzjoni oħra.

904
00:44:39,550 --> 00:44:41,470
>> Jekk inti tagħmel CS51, inti ser
jitgħallmu programmi funzjonali

905
00:44:41,470 --> 00:44:42,886
a out ftit mill-ambitu ta 'dan.

906
00:44:42,886 --> 00:44:45,090
Imma bażikament, dak li jagħmel
Jirreaġixxu jibred mhux biss

907
00:44:45,090 --> 00:44:46,840
il-fluss tad-data one-way
u l Dom virtwali,

908
00:44:46,840 --> 00:44:48,700
iżda wkoll din l-idea ta '
programmazzjoni funzjonali.

909
00:44:48,700 --> 00:44:51,720
U l-ipprogrammar funzjonali huwa faċli ħafna
tikkomponi u jagħmlu Jittieħed jibred minn,

910
00:44:51,720 --> 00:44:53,844
u huwa faċli ħafna li wieħed jaħseb
dwar u raġuni madwar.

911
00:44:53,844 --> 00:44:55,450
Allura huwa tiġbed oħra tajba ta jirreaġixxu.

912
00:44:55,450 --> 00:44:58,489

913
00:44:58,489 --> 00:44:59,280
Kwalunkwe mistoqsijiet aktar?

914
00:44:59,280 --> 00:45:02,650

915
00:45:02,650 --> 00:45:03,150
Yeah?

916
00:45:03,150 --> 00:45:06,840
>> UDJENZA: Um, għaliex kieku inti
użu let kuntrarju var?

917
00:45:06,840 --> 00:45:10,450
>> Neel Mehta: Għalhekk il-kwistjoni hija
għaliex tuza let minflok var?

918
00:45:10,450 --> 00:45:13,220
Din hija ħaġa imsejjaħ
ES6 jew ECMAScript 6.

919
00:45:13,220 --> 00:45:15,820
Hu l-verżjoni l-ġdida ta 'JavaScript.

920
00:45:15,820 --> 00:45:19,050
Hemm mazz ta 'raġunijiet tekniċi,
iżda let huwa verżjoni aħjar ta var.

921
00:45:19,050 --> 00:45:20,724
>> Huwa mod kif inti tiddikjara varjabbli.

922
00:45:20,724 --> 00:45:21,390
Tista 'tuża let.

923
00:45:21,390 --> 00:45:22,140
Tista 'tuża var.

924
00:45:22,140 --> 00:45:23,825
Let għandha mazz ta 'teknika
reasons-- inti tista 'tfittex lilhom

925
00:45:23,825 --> 00:45:25,610
up later-- għal għaliex huwa aħjar.

926
00:45:25,610 --> 00:45:28,780
Bażikament, ES6 għandha xi sbieħ
sintassi ġdida, xi karatteristiċi ġodda

927
00:45:28,780 --> 00:45:30,720
fuq nett tal-JavaScript qodma.

928
00:45:30,720 --> 00:45:32,782
>> Allura aħna għandna bħal ħames minuti.

929
00:45:32,782 --> 00:45:34,990
I biss riedu jitkellmu dwar
ħaġ'oħra fast reali.

930
00:45:34,990 --> 00:45:36,450
Jekk kellek xi mistoqsijiet,
ejja nitkellmu dwaru wara dan.

931
00:45:36,450 --> 00:45:38,366
Iżda biss sabiex dan gets
maqbuda fuq camera, I biss

932
00:45:38,366 --> 00:45:41,550
trid titkellem ftit dwar kif inti
attwalment jużaw jirreaġixxu apps tiegħek.

933
00:45:41,550 --> 00:45:47,220

934
00:45:47,220 --> 00:45:58,640
>> Jekk inti tmur hawn,
Facebook.GitHub.IO/react,

935
00:45:58,640 --> 00:46:03,320
dan huwa l-home page għall jirreaġixxu, u
dan ser jurik kif tista 'attwalment jużaw

936
00:46:03,320 --> 00:46:05,320
Jirreaġixxu fil-paġni tiegħek.

937
00:46:05,320 --> 00:46:08,845
Bażikament, huwa ftit
ikkumplikat tipprova jinstallaw jirreaġixxu.

938
00:46:08,845 --> 00:46:12,300
Mhuwiex faċli kif inti biss drag
u qatra JavaScript fil hemmhekk.

939
00:46:12,300 --> 00:46:15,890
>> Inti trid li jkollha transformer tiegħek
stabbilit, li, kif għamel qabel,

940
00:46:15,890 --> 00:46:18,120
dawran JSX tiegħek fis
il JavaScript normali.

941
00:46:18,120 --> 00:46:21,030
Int għandek ħaġa li ser
jikkompilaw inti ES6 għan-normal.

942
00:46:21,030 --> 00:46:24,720
JavaScript hemm ħafna ta 'ċaqliq
partijiet ma għandek tagħmel, hekk hemm xi ħaġa

943
00:46:24,720 --> 00:46:27,200
imsejħa Yeoman, Yeoman.io.

944
00:46:27,200 --> 00:46:31,110
U dan huwa għodda linja ta 'kmand li ser
jgħinuk scaffold out tiegħek jirreaġixxu

945
00:46:31,110 --> 00:46:32,380
proġetti faċilment.

946
00:46:32,380 --> 00:46:38,660
>> Allura inti tista 'taqra dwar dan
aktar tard, imma hemm xi għodod

947
00:46:38,660 --> 00:46:40,160
li Yeoman joffri.

948
00:46:40,160 --> 00:46:43,280
Huma ser tavżak toħloq React
app ma 'kollox mibnija.

949
00:46:43,280 --> 00:46:46,030
Bħal dan ser bnew
in, komponenti mibnija fl.

950
00:46:46,030 --> 00:46:47,880
Hija ser ikollhom transformer tiegħek mibnija.

951
00:46:47,880 --> 00:46:50,699
Huma għandhom ħafna ta 'kessaħ
Jittieħed mibnija awtomatikament

952
00:46:50,699 --> 00:46:52,240
jużaw dawn l-affarijiet imsejħa ġeneraturi.

953
00:46:52,240 --> 00:46:54,620
>> Allura taqra dwar dan jekk inti tixtieq.

954
00:46:54,620 --> 00:46:59,110
Just go fuq Yeoman, Y-E-O-M-A-N, u
inti tista 'ssib ġeneraturi bħal dawn.

955
00:46:59,110 --> 00:47:01,263
U ma ġeneraturi simili
dawn, inti biss tixtieq wieħed

956
00:47:01,263 --> 00:47:03,010
huwa kmand linja koppja jikkmanda.

957
00:47:03,010 --> 00:47:05,530
Hija ser scaffold out
kollu Jirreaġixxu app għalik.

958
00:47:05,530 --> 00:47:10,470
Dan ser tingħata l-pajpijiet manwali,
u x-xogħol Grunt isir għalik,

959
00:47:10,470 --> 00:47:13,010
u dan huwa għaliex inti biss jiffoka
fuq biss bil-miktub jirreaġixxu.

960
00:47:13,010 --> 00:47:16,739
>> Allura bażikament bini ta '
Jirreaġixxu app huwa nontrivial.

961
00:47:16,739 --> 00:47:19,530
Huwa fili kollha flimkien, iżda hemm
huma għodod li ser tagħmel dan għalik.

962
00:47:19,530 --> 00:47:23,070
Mela jekk inti tixtieq li tagħmel jirreaġixxu
app, jippruvaw jagħmlu dan il-mod.

963
00:47:23,070 --> 00:47:26,360
Jekk inti biss tixtieq li esperiment,
inti tista 'tipprova tuża dan CodePen

964
00:47:26,360 --> 00:47:28,550
għaliex dan CodePen għandha
l-tirreaġixxi wajers.

965
00:47:28,550 --> 00:47:30,240
I ghamilt x-xogħol kollu għalik diġà.

966
00:47:30,240 --> 00:47:34,610
>> Mela jekk inti tixtieq li tagħmel bħal
produzzjoni li jirrilaxxa jirreaġixxu app,

967
00:47:34,610 --> 00:47:37,220
ipprova waħda minn dawn ġeneraturi.

968
00:47:37,220 --> 00:47:40,240
Jekk inti biss tixtieq li jkollha
madwar, huwa spiss tiswa ftit

969
00:47:40,240 --> 00:47:44,490
bħal ipprova playing madwar fuq CodePen hawn.

970
00:47:44,490 --> 00:47:45,470
Ħoss tajba?

971
00:47:45,470 --> 00:47:45,970
Kessaħ.

972
00:47:45,970 --> 00:47:47,890
>> Allura li kollox jien.

973
00:47:47,890 --> 00:47:52,470
Għal darb'oħra, l-kodiċi u eżempji huma
se tkun fuq dan is-sit hawn.

974
00:47:52,470 --> 00:47:55,509
Allura, għal darb'oħra, aħna ma nitkellmu
dwar sintassi ħafna ta jirreaġixxu,

975
00:47:55,509 --> 00:47:57,550
imma li tfittex dawk kollha
ftit dettalji sintattiċi,

976
00:47:57,550 --> 00:48:00,320
dan kollu se tkun disponibbli
fuq dan is-sit hawn.

977
00:48:00,320 --> 00:48:02,660
>> So I d jirrakkomandaw bħal
jieħdu l-ewwel pass.

978
00:48:02,660 --> 00:48:06,277
Poġġi dan fil CodePen tiegħek.

979
00:48:06,277 --> 00:48:08,110
Ipprova taħdem fuq tagħmel
lill-tieni pass.

980
00:48:08,110 --> 00:48:11,310
Hemm raba pass, u biss
tara fejn ikollok minn dan.

981
00:48:11,310 --> 00:48:14,840
>> Kwalunkwe mistoqsijiet aktar, check
out dik il-paġna jew email me.

982
00:48:14,840 --> 00:48:16,490
C'est email tiegħi.

983
00:48:16,490 --> 00:48:19,885
Imma I imħabba biex jgħinuk ma 'kwalunkwe
mistoqsijiet li jista 'jkollok dwar jirreaġixxu.

984
00:48:19,885 --> 00:48:21,010
Allura, Yep, li kollox jien.

985
00:48:21,010 --> 00:48:23,410
Nirringrazzjakom ilkoll ħafna għall
jaraw jew biex jattendi.

986
00:48:23,410 --> 00:48:26,820
U jien ser tieħu xi mistoqsijiet
inti jista 'jkollok wara dan issa.

987
00:48:26,820 --> 00:48:29,140
Allura nirringrazzjakom ilkoll għall-ħars.

988
00:48:29,140 --> 00:48:31,270