1
00:00:00,000 --> 00:00:02,910
>> [მუსიკის დაკვრა]

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

3
00:00:04,850 --> 00:00:07,275
>> NEEL Mehta: აქ მიდის.

4
00:00:07,275 --> 00:00:11,070
>> ისე, ყველას, კეთილი
apps მომავალს რეაგირებას.

5
00:00:11,070 --> 00:00:11,870
ეს არის CS50.

6
00:00:11,870 --> 00:00:12,930
ჩემი სახელი არის Neel.

7
00:00:12,930 --> 00:00:17,689
მე TA for CS50 და მეორე
ჰარვარდის კოლეჯი და ძალიან, ძალიან

8
00:00:17,689 --> 00:00:18,730
ვნებიანი ვებ დეველოპერი.

9
00:00:18,730 --> 00:00:20,730
ასე რომ, მე ძალიან საინტერესო
უნდა საუბარი დღეს,

10
00:00:20,730 --> 00:00:24,550
თუ თქვენ აქ ან სახლში
ყურება, დაახლოებით რეაგირებას, რომელიც, კიდევ ერთხელ

11
00:00:24,550 --> 00:00:27,270
როგორც ვთქვი, მომავალი ვებ apps.

12
00:00:27,270 --> 00:00:29,055
>> ასე რომ, რეაგირებას არის ვებ ფარგლებში.

13
00:00:29,055 --> 00:00:30,930
და როგორც მე ვეუბნებოდი
ზოგიერთი ადამიანი აქ,

14
00:00:30,930 --> 00:00:33,400
ჩარჩო არის მხოლოდ
კომპლექტი ინსტრუმენტები შეგიძლიათ გამოიყენოთ

15
00:00:33,400 --> 00:00:35,770
სტრუქტურა და ავაშენოთ თქვენი ვებ app.

16
00:00:35,770 --> 00:00:39,010
და ვებ apps არიან, კიდევ ერთხელ, საიტები
რომ არის ინტერაქტიული, როგორიცაა Facebook,

17
00:00:39,010 --> 00:00:42,330
Twitter.com, Instagram.com, რასაც.

18
00:00:42,330 --> 00:00:45,590
>> ასე რომ, Facebook არის ვებ ფარგლებში
რომელიც შეიქმნა Facebook

19
00:00:45,590 --> 00:00:48,060
რამდენიმე წლის back-- რეაგირებას არის.

20
00:00:48,060 --> 00:00:50,830
ეს მას შემდეგ, რაც გამოყენებულ იქნა
Facebook- ის მობილური პროგრამები

21
00:00:50,830 --> 00:00:52,460
და web app, Instagram.

22
00:00:52,460 --> 00:00:56,350
ხანის აკადემია სხვა
ცნობილი ადრეული adopter რეაგირებას.

23
00:00:56,350 --> 00:00:58,630
>> ეს მართლაც მიღების
ძალიან პოპულარულია.

24
00:00:58,630 --> 00:01:03,420
თუ თქვენ ოდესმე გამოიყენოთ რამ, როგორიცაა კუთხოვანი ან
ხერხემალი, ეს არის ერთი ოჯახის,

25
00:01:03,420 --> 00:01:05,830
მაგრამ ეს მას შემდეგ, რაც დღემდე
გაუსწროს მათი პოპულარობა.

26
00:01:05,830 --> 00:01:06,890
ეს არის ცხელი ახალი რამ.

27
00:01:06,890 --> 00:01:09,590
მართლაც, ძალიან დიდი.

28
00:01:09,590 --> 00:01:13,470
>> ასე რომ, რეაგირებას კარგია არა მხოლოდ როგორც
ვებ ფარგლებში სამშენებლო ინტერფეისი.

29
00:01:13,470 --> 00:01:16,020
კარგია, მშენებლობის ვებ ინტერფეისი.

30
00:01:16,020 --> 00:01:18,350
არსებობს ასევე რამ
მოუწოდა რეაგირებას მშობლიური რომელიც

31
00:01:18,350 --> 00:01:22,200
საშუალებას გაძლევთ შექმნათ ინტერფეისი
for Android და iOS

32
00:01:22,200 --> 00:01:26,390
და შესაძლოა სხვა პლატფორმების მომავალი
გამოყენებით მხოლოდ იგივე JavaScript კოდი.

33
00:01:26,390 --> 00:01:31,130
თქვენ შეგიძლიათ გამოიყენოთ ზუსტად იგივე
JavaScript კოდი გაწევა საიტებზე,

34
00:01:31,130 --> 00:01:33,040
უნდა გაუწიოს Android apps და iOS apps.

35
00:01:33,040 --> 00:01:35,000
>> ეს არის ძალიან, ძალიან საინტერესო დროს.

36
00:01:35,000 --> 00:01:37,070
ეს მართლაც, მართლაც მაგარი შესაძლებლობა.

37
00:01:37,070 --> 00:01:42,020
ეს მართლაც უნივერსალური ვებ
ინტერფეისი განვითარების ინსტრუმენტი,

38
00:01:42,020 --> 00:01:44,420
ასე რომ, ეს ძალიან, ძალიან
მთავარია იცოდეთ.

39
00:01:44,420 --> 00:01:46,949
და, როგორც მე ვეუბნებოდი ხალხს
ადრე, ეს, ვფიქრობ,

40
00:01:46,949 --> 00:01:48,990
შეიცვლება, თუ როგორ
ავაშენოთ ვებ apps სამუდამოდ.

41
00:01:48,990 --> 00:01:55,820
ასე რომ, ეს შეიძლება ცოტა hyperbole, მაგრამ მე
ვფიქრობ, რომ ეს არის საკმაოდ კარგი რამ ვიცი.

42
00:01:55,820 --> 00:01:57,580
>> OK, ასე რომ, რა არის რეაგირებას?

43
00:01:57,580 --> 00:02:01,020
რეაგირებას არის ჩარჩო შეგიძლიათ
გამოყენება მშენებლობის ინტერფეისი.

44
00:02:01,020 --> 00:02:03,240
ინტერფეისი არის, კიდევ ერთხელ,
ვებ გვერდი, არა?

45
00:02:03,240 --> 00:02:06,340
ასე რომ, აქ Instagram.com, გამოყენების ფაქტზე რეაგირებას.

46
00:02:06,340 --> 00:02:08,740
>> რეაგირებას აგებული
იდეა კომპონენტები.

47
00:02:08,740 --> 00:02:11,900
კომპონენტი არის HTML
ელემენტის შესახებ სტეროიდების,

48
00:02:11,900 --> 00:02:14,470
ასე ელემენტი ჰგავს ღილაკს.

49
00:02:14,470 --> 00:02:15,250
ეს პუნქტი.

50
00:02:15,250 --> 00:02:17,500
ეს არის header, არა?

51
00:02:17,500 --> 00:02:22,740
და Instagram გამოიყენებს ამ, მაგრამ ეს
ასევე გამოიყენოთ კომპონენტების რეაგირებას.

52
00:02:22,740 --> 00:02:25,740
>> რეაგირებას კომპონენტები
souped-up HTML ელემენტები

53
00:02:25,740 --> 00:02:28,100
რომ აქვს საკუთარი ქცევის
შეიცავს მათ.

54
00:02:28,100 --> 00:02:31,800
ასე რომ, როგორც, მაგალითად, ჩვენ შეგვეძლო
დროის ელემენტს, დრო კომპონენტი,

55
00:02:31,800 --> 00:02:34,095
რომელიც შეიცავს, როგორებიცაა
დროის შტამპი, თქვენ იცით,

56
00:02:34,095 --> 00:02:37,170
ნახვა კომპონენტი, რომელიც
შეიცავს ნახვა სურათი

57
00:02:37,170 --> 00:02:38,820
და იმ პირის დასახელება.

58
00:02:38,820 --> 00:02:42,930
მას შეუძლია, როგორც counter, რომელიც
შეგიძლიათ იმედი, როგორც რაოდენობის მოსწონს,

59
00:02:42,930 --> 00:02:45,610
და თუ თქვენ დააჭირეთ მასზე, იგი ყველაფერს
რაოდენობის გაზრდა მოსწონს.

60
00:02:45,610 --> 00:02:48,200
კომპონენტი არის მხოლოდ
bunch of HTML კოდი, რომელიც

61
00:02:48,200 --> 00:02:50,520
აქვს რამდენიმე ფუნქცია
გახვეული შიგნით მას.

62
00:02:50,520 --> 00:02:53,770
ასე რომ, როგორც ელემენტი
სტეროიდებზე, როგორც ვთქვი.

63
00:02:53,770 --> 00:02:56,270
თქვენ შეუძლია ამ კომპონენტს,
და თქვენ შეგიძლიათ განათავსოთ მათ ერთად

64
00:02:56,270 --> 00:02:59,060
რათა ახალი კომპონენტები,
ამ შემთხვევაში, პოსტ კომპონენტი,

65
00:02:59,060 --> 00:03:00,505
რომელიც შეიცავს ყველა ამ პერსონალის.

66
00:03:00,505 --> 00:03:04,050
ეს იქნებოდა შეიცავდეს დრო, პროფილი,
LikeCounter, იქნებ კომენტარის დამატება

67
00:03:04,050 --> 00:03:06,100
და შესაძლოა იმიჯი თავად.

68
00:03:06,100 --> 00:03:10,810
ასე რომ, ვებ apps უბრალოდ აშენებული აღების
კომპონენტები და აყენებს მათ ერთად.

69
00:03:10,810 --> 00:03:15,620
Instagram feed, მეტი არაფერი
რამოდენიმე ფორუმზე ერთმანეთის მიყოლებით,

70
00:03:15,620 --> 00:03:19,032
ყოველი ჩანაწერი შეიცავს, როგორიცაა დრო,
პროფილი, LikeCounter, და ასე შემდეგ.

71
00:03:19,032 --> 00:03:20,490
ეს არის სახის როგორც მშენებლობის სახლში.

72
00:03:20,490 --> 00:03:22,660
თქვენ არ აშენება
სახლი ზემოდან ქვემოთ.

73
00:03:22,660 --> 00:03:24,960
თქვენ მიიღოს კომპონენტები თქვენ
მიიღოს, როგორც აბაზანა.

74
00:03:24,960 --> 00:03:28,320
თქვენ მიიღოს bedroom-- თქვენ გამყარებაში მათი
ერთად, და თქვენ გაქვთ ახალი კომპონენტი.

75
00:03:28,320 --> 00:03:29,760
თქვენ გაქვთ ახალი ნაწილი სახლში.

76
00:03:29,760 --> 00:03:32,860
>> ასე რომ რეაგირება ყველაფერი აგებულია გარშემო
ამ იდეის კომპონენტები,

77
00:03:32,860 --> 00:03:36,600
არის ინტერაქტიული, რომ დეკლარაციული.

78
00:03:36,600 --> 00:03:39,650
ისევე როგორც თქვენ, უბრალოდ, ვამბობთ, რა
ნახვა, და ეს უწევს მას.

79
00:03:39,650 --> 00:03:40,600
ისინი composable.

80
00:03:40,600 --> 00:03:43,880
თქვენ შეგიძლიათ მიიღოს დრო და ნახვა, დააყენა
მათ ერთად, რათა რაღაც უკეთესი.

81
00:03:43,880 --> 00:03:47,770
და ისინი reusable, ასე რომ, თუ თქვენ
კოდის პოსტი,

82
00:03:47,770 --> 00:03:49,440
თქვენ შეიძლება embed რომ არსად.

83
00:03:49,440 --> 00:03:53,160
>> შეგიძლიათ ხმა Instagram
რამ თქვენს საკუთარ საიტზე.

84
00:03:53,160 --> 00:03:56,830
თქვენ შეგიძლიათ ხმა Facebook, მაგალითად,
რადგან იგი იყენებს რეაგირებას ისევე.

85
00:03:56,830 --> 00:04:00,360
ასე რომ, კომპონენტები ნამდვილად, ნამდვილად, ნამდვილად
ძლიერი სამშენებლო ბლოკები ვებ

86
00:04:00,360 --> 00:04:04,180
რომელიც შეიძლება გამოყენებულ იქნას ნებისმიერ წერტილში და
ერთად, რათა ახალი შენობა ბლოკად.

87
00:04:04,180 --> 00:04:07,159
ეს არის ძალიან, ძალიან
მაღალი დონის მიმოხილვა.

88
00:04:07,159 --> 00:04:09,200
ასე რომ, კიდევ ერთხელ, თუ თქვენ გაქვთ
ნებისმიერი კითხვები ნებისმიერ წერტილში

89
00:04:09,200 --> 00:04:14,470
ფილოსოფია რეაქტორი, რომ
კოდირება, შეწყვიტოს ჩემთვის, და ნება მომეცით ვიცი.

90
00:04:14,470 --> 00:04:18,420
>> OK, ასე რომ რეაგირება არის მაგარი, რადგან ეს
აქვს სხვადასხვა გზას ეძებს

91
00:04:18,420 --> 00:04:19,870
განთავსებულია როგორ უნდა შექმნათ ვებ apps.

92
00:04:19,870 --> 00:04:23,620
თქვენ ალბათ მსმენია MVC, რომელიც
მოდელი თქვენ კონტროლი CS50 ან რასაც

93
00:04:23,620 --> 00:04:25,940
სხვა საცდელი კლასი გამოიყენოთ.

94
00:04:25,940 --> 00:04:29,000
და ყველაზე ჩარჩოები
აგებულია იდეა MVC.

95
00:04:29,000 --> 00:04:30,410
რეაგირებას არ არის.

96
00:04:30,410 --> 00:04:32,980
რეაგირება აგებულია იდეა
საქართველოს ერთფუძიანი მონაცემების ნაკადი

97
00:04:32,980 --> 00:04:36,510
როგორც ჩანს ეს სქემა ან გრაფიკული აქ.

98
00:04:36,510 --> 00:04:38,260
>> ძირითადად, თქვენ გაქვთ მონაცემთა წყარო.

99
00:04:38,260 --> 00:04:42,380
და მონაცემთა წყარო გადაწყვეტს,
როგორ ჩაუყარა out გარკვეული კომპონენტები.

100
00:04:42,380 --> 00:04:45,452
და კომპონენტები
მაშინ, როდესაც ისინი ცვლიან,

101
00:04:45,452 --> 00:04:47,160
ისინი გეტყვით
მონაცემთა წყარო შეიცვალოს.

102
00:04:47,160 --> 00:04:49,350
>> იმისათვის, რომ გამოიყენოთ Instagram
მაგალითად, თქვენ შეიძლება ჰქონდეს

103
00:04:49,350 --> 00:04:52,050
სია პოსტი ობიექტების, როგორიცაა
მონაცემთა ბაზაში ან რამე.

104
00:04:52,050 --> 00:04:53,310
ეს მონაცემები.

105
00:04:53,310 --> 00:04:57,600
და მაშინ ჩვენი პოსტ კომპონენტები
მიიღებს, რომ მონაცემები,

106
00:04:57,600 --> 00:05:01,830
და გამოიყენოს, რომ მონაცემები გაწევა
რამ ეკრანზე.

107
00:05:01,830 --> 00:05:04,300
ეს არის ის, რაც arrow
საწყისი მონაცემების კომპონენტი,

108
00:05:04,300 --> 00:05:07,930
და მერე რომ იგივე მონაცემები გამოიყენება
გამოიტანოს bunch of კომპონენტები.

109
00:05:07,930 --> 00:05:10,290
>> In Facebook Messenger, for
მაგალითად, რომელიც რეაგირებას,

110
00:05:10,290 --> 00:05:13,410
ალბათ სია
შეტყობინებები როგორც თქვენი მონაცემთა წყარო.

111
00:05:13,410 --> 00:05:15,927
და რომ გაუწიოს არა
მხოლოდ სიაში შეტყობინებები

112
00:05:15,927 --> 00:05:17,510
არამედ მეგობრების სიაში გაქვთ.

113
00:05:17,510 --> 00:05:19,200
თქვენ გაქვთ წაუკითხავი რაოდენობა.

114
00:05:19,200 --> 00:05:23,330
შესაძლოა ასევე გაუწიოს Facebook რამ
რომ არის ბოლოში Facebook.com.

115
00:05:23,330 --> 00:05:25,610
იგივე მონაცემები არის
ერთი წყარო სიმართლე

116
00:05:25,610 --> 00:05:28,290
და რომელიც იწვევს ბევრი
კომპონენტები გასაწევი.

117
00:05:28,290 --> 00:05:30,290
და როდესაც ერთ-ერთი იმ
კომპონენტები იცვლება,

118
00:05:30,290 --> 00:05:32,320
იგი მიდის უკან და
ცვლის მონაცემთა წყარო.

119
00:05:32,320 --> 00:05:33,460
>> თქვენ გაგზავნა, უფლება?

120
00:05:33,460 --> 00:05:34,780
რომელიც ცვლის მონაცემთა წყარო.

121
00:05:34,780 --> 00:05:39,490
თქვენ წავიკითხე თქვენი შეტყობინებები,
ასე რომ თქვენ მითითებული წაუკითხავ 0.

122
00:05:39,490 --> 00:05:41,136
რომელიც ცვლის მონაცემთა წყარო.

123
00:05:41,136 --> 00:05:44,010
და შენიშნავს, რომ ყველა ეს ერთ-ერთი
arrow ბრუნდება იგივე მონაცემები

124
00:05:44,010 --> 00:05:47,662
წყარო, ასე რომ თქვენ იცით,
მოცემული გარკვეული მონაცემები კომპლექტი,

125
00:05:47,662 --> 00:05:49,870
თქვენ იცით ზუსტად რა
გვერდზე აპირებს გამოიყურებოდეს.

126
00:05:49,870 --> 00:05:50,700
ეს დეტერმინისტული.

127
00:05:50,700 --> 00:05:53,451
თქვენ იცით, რომ მოცემული გარკვეული მონაცემები, რასაც
გვერდის აპირებს გამოიყურებოდეს.

128
00:05:53,451 --> 00:05:56,158
თქვენ შეგიძლიათ პროგნოზირება, თუ როგორ აპირებს
მოიქცეს და როგორ ვაპირებთ

129
00:05:56,158 --> 00:05:57,650
მუშაობა, როდესაც ისინი ერთად.

130
00:05:57,650 --> 00:06:00,410
>> და თუ მე მქონდა მილიონი კომპონენტები
აქ, ეს იქნებოდა მოიქცევა იგივე, არა?

131
00:06:00,410 --> 00:06:02,290
თქვენ არ გაქვთ რაიმე
უცნაური კავშირები.

132
00:06:02,290 --> 00:06:04,120
ერთი მონაცემების გაწეული მილიონი კომპონენტები.

133
00:06:04,120 --> 00:06:06,879
მილიონი კომპონენტები შეიძლება
უკან და შეცვალონ მონაცემები.

134
00:06:06,879 --> 00:06:07,920
ასე რომ, ეს არის ძალიან ლამაზი.

135
00:06:07,920 --> 00:06:10,870
ჩვენ ვაშენებთ composable,
ადვილად scalable ვებ apps.

136
00:06:10,870 --> 00:06:13,150
>> თქვენ გაქვთ ერთი მონაცემთა წყარო,
წყარო სიმართლე.

137
00:06:13,150 --> 00:06:15,790
ეუბნება, რომ თქვენი კომპონენტები
როგორ ჩაუყარა out გვერდზე,

138
00:06:15,790 --> 00:06:18,190
და კომპონენტები
გაუმკლავდეს ურთიერთქმედება.

139
00:06:18,190 --> 00:06:20,150
და თუ მათ სურთ, რომ შეიცვალოს
რამ, უბრალოდ დაბრუნდეს

140
00:06:20,150 --> 00:06:21,750
და ვუთხრა მონაცემთა წყარო შეიცვალოს.

141
00:06:21,750 --> 00:06:22,850
აზრი?

142
00:06:22,850 --> 00:06:26,010
ასე რომ, რეაგირებას არის ყველაფერი გაგება
როგორ უნდა ავაშენოთ კომპონენტი

143
00:06:26,010 --> 00:06:29,540
და როგორ უნდა გააკეთოს თქვენი კომპონენტი
ურთიერთქმედება გარე სამყაროსთან.

144
00:06:29,540 --> 00:06:31,850
>> მიღების კომპონენტის ურთიერთქმედება
გარე სამყაროსთან

145
00:06:31,850 --> 00:06:34,490
იყენებს სხვა ტექნიკა
მოუწოდა Flux, რომელიც

146
00:06:34,490 --> 00:06:36,872
არის ჩარჩო, რომელიც
დამატებული თავზე რეაგირებას.

147
00:06:36,872 --> 00:06:38,330
ჩვენ არ ვაპირებთ ვისაუბროთ.

148
00:06:38,330 --> 00:06:42,990
ჩვენ ვაპირებთ, რომ გაიგო უფრო მეტი, იმის გათვალისწინებით,
მონაცემები, თუ როგორ შეგიძლიათ გაწევა კომპონენტი?

149
00:06:42,990 --> 00:06:47,010
>> ასე რომ, რეაგირებას მართლაც მაგარი იმიტომ, რომ თქვენ
შეგიძლიათ გამოიყენოთ იგი ნებისმიერი უკან ბოლომდე გსურთ.

150
00:06:47,010 --> 00:06:50,480
თუ თქვენ გაქვთ, როგორიცაა Python უკან ბოლოს,
თუ თქვენი Python შეგიძლიათ შამფურზე ზოგიერთი მონაცემებით,

151
00:06:50,480 --> 00:06:51,610
რეაგირებას შეუძლია გაუწიოს მას.

152
00:06:51,610 --> 00:06:54,700
თუ თქვენ არ JS შედეგები
მონაცემები, რეაგირებას უწევს მას.

153
00:06:54,700 --> 00:06:56,890
Ruby ლიანდაგზე ერთად
მონაცემები, რეაგირებას უწევს მას.

154
00:06:56,890 --> 00:07:01,860
>> ასე რომ, რეაგირებას ძირითადად ვებ
view-- წინა ბოლომდე კომპონენტები

155
00:07:01,860 --> 00:07:03,910
ნებისმიერი მონაცემთა წყარო განაწილებაზე.

156
00:07:03,910 --> 00:07:07,145
ასე რომ აპირებს მონაცემთა წყარო
რეაგირება კომპონენტები საკმაოდ მარტივია.

157
00:07:07,145 --> 00:07:08,770
მიდიოდა სხვა გზა არის ცოტა რთული.

158
00:07:08,770 --> 00:07:10,462
რომელიც იყენებს Flux როგორც ვთქვი ადრე.

159
00:07:10,462 --> 00:07:11,420
ჩვენ არ მოხვდება, რომ.

160
00:07:11,420 --> 00:07:13,740
ჩვენ ფოკუსირება უფრო
მონაცემთა to-კომპონენტი მხარეს.

161
00:07:13,740 --> 00:07:15,880
ამ გზით თქვენ შეგიძლიათ, რათა
cool, fun ვებ apps.

162
00:07:15,880 --> 00:07:19,870
ეს გავლენას არ მოახდენს გარე სამყაროსთან
ახლა, მაგრამ ეს კიდევ ერთი ამბავი.

163
00:07:19,870 --> 00:07:22,210
>> OK, ასე რომ, თუ თქვენ აქ
ჩემი ბოლო სემინარი

164
00:07:22,210 --> 00:07:26,610
თქვენ იცით, რომ ყველა კოდი
დღევანდელი განხილვა იქნება ამ URL-

165
00:07:26,610 --> 00:07:29,320
აქ, ვწუხვარ, რომ ეს URL აქ.

166
00:07:29,320 --> 00:07:32,730
და ძირითადად ჩვენ ვაპირებთ წასვლა
ოთხი ნაბიჯი, შესაძლოა, ხუთ,

167
00:07:32,730 --> 00:07:33,510
ალბათ, არ ხუთ.

168
00:07:33,510 --> 00:07:37,300
ჩვენ გადაადგილება მეშვეობით ოთხი ნაბიჯები
მშენებლობის ნიმუში რეაგირებას app.

169
00:07:37,300 --> 00:07:39,550
ასე რომ, ყველა კოდის
ყოველ ნაბიჯზე გზა

170
00:07:39,550 --> 00:07:42,216
იქნება აქ, ასე რომ, თუ
თქვენ შემდეგ გასწვრივ სახლში,

171
00:07:42,216 --> 00:07:43,991
მოგერიდებათ peruse ეს კოდი.

172
00:07:43,991 --> 00:07:46,740
თუ თქვენ შემდეგ გასწვრივ აქ,
ჩვენ უნდა გვიჩვენებს, რომ ეკრანზე,

173
00:07:46,740 --> 00:07:47,739
ასე რომ არ ინერვიულოთ შესახებ.

174
00:07:47,739 --> 00:07:50,930
მაგრამ თუ თქვენ სახლში, ვგრძნობ
უფასო ეწვევა ამ ნახვა.

175
00:07:50,930 --> 00:07:56,400
და ჰო, თქვენ უნდა შეეძლოს მიიღოს
ყველა კოდი ნეტავ ოდესმე უნდა აქ.

176
00:07:56,400 --> 00:08:01,380
ასე რომ, ეს არის კარგი cheat ფურცელი, ისევე
თქვენი მომავალი თავგადასავლები რეაგირებას.

177
00:08:01,380 --> 00:08:04,490
ზემოთ, ასე რომ, თუ ყველას, ვინც აქ,
და მაშინაც კი, თუ თქვენ სახლში,

178
00:08:04,490 --> 00:08:11,580
დახევის up ამ ნახვა, is.gd/cs50react,
კაპიტალის, არ ხაზგასმა, არც არაფერი.

179
00:08:11,580 --> 00:08:15,849
>> თქვენ ნახავთ, გვერდი, რომელიც გამოიყურება
ცოტა მოსწონს ეს.

180
00:08:15,849 --> 00:08:17,140
ეს არის რამ მოუწოდა CodePen.

181
00:08:17,140 --> 00:08:20,030
CodePen არის ერთობლივი
კოდების გარემოში

182
00:08:20,030 --> 00:08:23,364
რომელიც მე შეგიძლიათ დაწეროთ კოდი აქ, და
ეს იქნება ავტომატურად გაიგზავნება თქვენ.

183
00:08:23,364 --> 00:08:24,780
და ამ გზით, შემიძლია წერა კოდი.

184
00:08:24,780 --> 00:08:26,920
შემიძლია აწარმოებს კოდი აქ.

185
00:08:26,920 --> 00:08:33,470
>> იყიდება მაგალითად და თუ ეს reloads-- ვხედავ,
მე გაშვებული JavaScript კოდი გვერდზე

186
00:08:33,470 --> 00:08:36,390
სწორედ აქ, და იგი ყველაფერს
ავტომატურად გაწევა ვებ გვერდზე

187
00:08:36,390 --> 00:08:37,980
ამ JavaScript კოდი.

188
00:08:37,980 --> 00:08:40,039
ასე რომ, ეს არის გზა
ჩვენთვის ვცდილობთ out კოდი

189
00:08:40,039 --> 00:08:43,089
მართლაც სწრაფი გარეშე გამოყენება
ჩვენი ID ან გამოიყენოთ ჩვენი ადგილობრივი მანქანა

190
00:08:43,089 --> 00:08:44,290
ან რასაც.

191
00:08:44,290 --> 00:08:47,670
ეს არის ძალიან სწრაფი გზა, რომ თქვენ mockup
და შეამოწმოთ სხვადასხვა სახის კოდი.

192
00:08:47,670 --> 00:08:50,560
>> ამიტომ, მე ვაპირებ, აღების
მაგალითად კოდი, აყენებს მას აქ.

193
00:08:50,560 --> 00:08:52,374
ჩვენ ვაპირებთ, რომ სამუშაო მეშვეობით.

194
00:08:52,374 --> 00:08:54,540
და თუ თქვენ სახლში,
შეგიძლიათ დახევის ეს ასევე.

195
00:08:54,540 --> 00:08:57,530
და მე უკვე დაყენებული
რეაგირებას აქ, ასე რომ თქვენ მხოლოდ

196
00:08:57,530 --> 00:09:00,770
დაწეროთ თქვენი კოდი აქ, და
თავიდან, როგორც საკუთარი სპორტული მოედანი.

197
00:09:00,770 --> 00:09:04,940
>> ჰო, თუ ყველას
გახსენით ეს ბმული აქ.

198
00:09:04,940 --> 00:09:08,080
გთხოვთ მაძლევს ოქტომბერი
კიდევ გაქვთ ის გახსნა.

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

200
00:09:10,960 --> 00:09:13,770
Cool, მაგარი მაგარი.

201
00:09:13,770 --> 00:09:16,914
არაფერია აქ ახლა, მაგრამ
ჩვენ შეიცვლება, რომ ძალიან მალე.

202
00:09:16,914 --> 00:09:21,250
>> OK, ასე რომ რეაგირებას არის JavaScript
ბიბლიოთეკა, და როგორც ასეთი,

203
00:09:21,250 --> 00:09:24,480
მოითხოვს ცოდნა JavaScript,
რომელიც არის ვებ პროგრამირების ენაზე.

204
00:09:24,480 --> 00:09:27,660
და ის გამოიყენება სხვა რამ
ახლა ძალიან, მაგრამ, პირველ რიგში, ვებ განვითარება

205
00:09:27,660 --> 00:09:32,040
ენა, ასე რომ, თუ თქვენ ხართ უცხო ერთად
, წაიკითხეთ საიტი მოუწოდა JSforCats.com.

206
00:09:32,040 --> 00:09:32,700
შესანიშნავია.

207
00:09:32,700 --> 00:09:34,240
შეგიძლიათ გაიგოთ JavaScript
ნახევარ საათში.

208
00:09:34,240 --> 00:09:34,990
ეს არის წარმოუდგენელი.

209
00:09:34,990 --> 00:09:36,420
>> ასე რომ ეს წაიკითხა.

210
00:09:36,420 --> 00:09:39,960
ჩვენ ასევე არის ბევრი HTML აქ იმიტომ,
ჩვენ დიზაინისა ვებ გვერდები, რა თქმა უნდა.

211
00:09:39,960 --> 00:09:43,890
ასე რომ, თუ თქვენ იციან
HTML, შეამოწმეთ HTMLdog.com.

212
00:09:43,890 --> 00:09:46,520
მე ვფიქრობ, რომ სწავლის რეაგირებას არის
მილიონი ჯერ ადვილი, თუ თქვენ უკვე

213
00:09:46,520 --> 00:09:47,892
ვიცი შენობა ბლოკად.

214
00:09:47,892 --> 00:09:50,600
თუ თქვენ გაქვთ კომპონენტები, ის
ადვილი, რათა დიდი კომპონენტი.

215
00:09:50,600 --> 00:09:51,860
სწორედ რეაგირებას ენის თქვენთვის.

216
00:09:51,860 --> 00:09:54,270
>> ასე რომ, წავიდეთ წინ და მისცეს
ეს ყველაფერი წაკითხული.

217
00:09:54,270 --> 00:09:55,070
პაუზა ამ ვიდეო.

218
00:09:55,070 --> 00:09:57,440
მიეცით მას წაკითხული თუ თქვენ ხართ
სახლში თუ თქვენ არ ხართ

219
00:09:57,440 --> 00:10:00,794
იცნობს HTML და JavaScript

220
00:10:00,794 --> 00:10:02,960
OK, ასე რომ, ჩვენ ვაპირებთ
არის ჩვენ ვაპირებთ, რათა

221
00:10:02,960 --> 00:10:06,470
ძალიან ძირითადი flashcard app გამოყენებით რეაგირებას.

222
00:10:06,470 --> 00:10:08,210
ჩვენ ვაპირებთ, რომ აქვს flashcard.

223
00:10:08,210 --> 00:10:09,880
თქვენ შეგიძლიათ Flip ბარათი და უკან.

224
00:10:09,880 --> 00:10:12,399
და ჩვენ ასევე გვაქვს ჩამონათვალი
ყველა ბარათი, რომელიც ჩვენ გვაქვს,

225
00:10:12,399 --> 00:10:14,190
და თუ ჩვენ შეგრძნება
ამბიციური, ჩვენ შეიძლება

226
00:10:14,190 --> 00:10:17,060
შეუძლია გადაერთოთ
მანქანა დაწკაპვით მათ.

227
00:10:17,060 --> 00:10:20,360
>> მაგრამ ეს არ არის, თქვენი შიშველი
ძვლები, ძალიან მარტივი რეაგირებას app.

228
00:10:20,360 --> 00:10:22,560
ასე რომ, ეს არის რეალურად
არ არის ტრივიალური განხორციელება,

229
00:10:22,560 --> 00:10:26,030
მაგრამ ჩვენ ვაპირებთ, რომ, თუ თქვენ
, ეს ძალიან, ძალიან ადვილად ვრცელდება ეს

230
00:10:26,030 --> 00:10:27,680
თუ სხვა ხალხი დაგეხმაროთ იგი.

231
00:10:27,680 --> 00:10:33,750
ამიტომ, ჩვენ ვაპირებთ გავლა ოთხი ნაბიჯები
დაწყებული ნულიდან აშენება.

232
00:10:33,750 --> 00:10:36,740
>> OK, ასე რომ ოთხი ნაბიჯები, ჩვენ
დაიწყოს off ერთად პირველი ნაბიჯი.

233
00:10:36,740 --> 00:10:39,790
პირველი ნაბიჯი იქნება
მშენებლობის თქვენი პირველი კომპონენტი.

234
00:10:39,790 --> 00:10:44,830
როგორც ვთქვი, შემადგენელ რეაგირებას
მხოლოდ ელემენტი შესახებ სტეროიდების.

235
00:10:44,830 --> 00:10:49,660
ეს განსაზღვრავს HTML
და ზოგიერთი საქციელი, და ეს

236
00:10:49,660 --> 00:10:52,600
დააკონკრეტა, თუ როგორ ხალხი
შეგიძლიათ ურთიერთქმედება ის, თუ როგორ

237
00:10:52,600 --> 00:10:54,270
ეს იქნებოდა შიდა სახელმწიფო.

238
00:10:54,270 --> 00:10:57,630
Like ღილაკი იციან, რამდენი
ჯერ ეს უკვე აირჩიეთ მაგალითად,

239
00:10:57,630 --> 00:11:01,010
და ის, თუ როგორ უნდა ქმნის თავად.

240
00:11:01,010 --> 00:11:04,430
>> ასე რომ, მოდით წავიდეთ წინ და ავაშენოთ ჩვენი
პირველი კომპონენტის გამოყენებით JavaScript.

241
00:11:04,430 --> 00:11:09,711
ასე რომ, თუ სინტაქსი გამოიყურება უცნაური,
იმიტომ, რომ ეს სახის არის.

242
00:11:09,711 --> 00:11:11,710
ასე რომ, კიდევ ერთხელ, ჩვენ ვაპირებთ
რათა ცვლადში

243
00:11:11,710 --> 00:11:14,580
app გამოყენებით სიტყვით ნება,
რაც ცვლადი,

244
00:11:14,580 --> 00:11:18,210
მიადევნე App თანაბარი React.createClass.

245
00:11:18,210 --> 00:11:22,609
>> რეაგირებას არის ბიბლიოთეკაში და აქვს
შექმნა კლასის ფუნქცია.

246
00:11:22,609 --> 00:11:24,400
და ეს ფუნქცია
ცოტა კოდი, რომ თქვენ

247
00:11:24,400 --> 00:11:29,090
შეგიძლიათ შექმნათ ახალი
ტიპის რეაგირებას კომპონენტი.

248
00:11:29,090 --> 00:11:32,780
ასე რომ, React.createClass
რაც კომპონენტი,

249
00:11:32,780 --> 00:11:35,270
და ეს კომპონენტი
რისი გაკეთება უნდა შეეძლოს პერსონალი.

250
00:11:35,270 --> 00:11:40,460
მთავარია, მას შეუძლია გააკეთოს არის გაუწიოს
რაღაც, გაწევა როგორც ფუნქცია.

251
00:11:40,460 --> 00:11:44,500
>> კიდევ ერთხელ, თუ ეს მაჩვენებელი არ არის აშკარა
თქვენ, მე გირჩევთ წასვლა JS კატები

252
00:11:44,500 --> 00:11:45,682
და შეამოწმეთ იგი out.

253
00:11:45,682 --> 00:11:47,710
ის არის, რომ დაშორება კარგად არის საკმარისი?

254
00:11:47,710 --> 00:11:48,490
ზემოთ.

255
00:11:48,490 --> 00:11:50,670
>> ასე რომ, ყოველი კომპონენტის საჭიროებების
აქვს გამოიტანოს ფუნქცია.

256
00:11:50,670 --> 00:11:53,010
გაუწიოს ფუნქცია ამბობს,
რა შემიძლია ბეჭდვა ეკრანზე?

257
00:11:53,010 --> 00:11:54,760
მაგრამ კომპონენტი
აზრი არ აქვს, თუ ის არ

258
00:11:54,760 --> 00:11:58,060
იცით, რა უნდა ბეჭდვა ეკრანზე, ისე,
თქვენ უნდა გამოიტანოს ფუნქცია.

259
00:11:58,060 --> 00:12:01,904
>> ასე რომ, გაწევა რამ,
უბრალოდ უნდა დაბრუნდეს HTML.

260
00:12:01,904 --> 00:12:03,820
და რა მაგარი ის არის, რომ
არსებობს რამ მოუწოდა

261
00:12:03,820 --> 00:12:08,660
JSX, რომელიც გაგრძელების
JavaScript, რომელიც გამოიყენება რეაგირება.

262
00:12:08,660 --> 00:12:11,845
ის მოდით წერთ HTML შიგნით
თქვენი JavaScript, რომელიც

263
00:12:11,845 --> 00:12:13,970
ხმები უცნაური, როდესაც
თქვენ ვიფიქროთ,

264
00:12:13,970 --> 00:12:15,553
მაგრამ ის, რაც ბევრი გაგებით შემდეგ.

265
00:12:15,553 --> 00:12:17,430
ასე რომ, ჩვენ შეგვიძლია ამის გაკეთება.

266
00:12:17,430 --> 00:12:21,360
თუ თქვენ იცნობს HTML, მე ვიცი,
ჩვენ გვაქვს div ზოგადი მიზნით

267
00:12:21,360 --> 00:12:22,790
კონტეინერი პერსონალი.

268
00:12:22,790 --> 00:12:26,380
ჩვენ შეგვიძლია დაბრუნების div და შიგნით
ამ div, ჩვენ შეგვიძლია პერსონალი.

269
00:12:26,380 --> 00:12:32,390
>> ასე ვთქვათ, ჩვენ გვინდა, რომ გაწევა მხოლოდ
სწორი up flashcard ახლა.

270
00:12:32,390 --> 00:12:34,890
Flashcard, მე ვიტყოდი,
ექნება კითხვა და პასუხი.

271
00:12:34,890 --> 00:12:37,530
ასე რომ შიგნით ამ div, მოდით
ამობეჭდოთ მუხლის მე

272
00:12:37,530 --> 00:12:42,155
რომელიც ამბობს, კითხვა რა არის
საბოლოო პასუხი ცხოვრების, სამყაროს?

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

274
00:12:47,640 --> 00:12:50,345
და მაშინ პასუხი
იქნება, რა თქმა უნდა, 42.

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

276
00:12:56,880 --> 00:12:59,730
>> ეს არ ამუშავება კარგად ყველა.

277
00:12:59,730 --> 00:13:04,164
ჰო, ასე რომ, ძირითადად, თქვენ ნამდვილად
წერენ HTML თქვენს JavaScript.

278
00:13:04,164 --> 00:13:06,330
და ეს იქნება
ბეჭდვითი out შევიდა ეკრანზე.

279
00:13:06,330 --> 00:13:08,250
მოდით ცდილობენ მას.

280
00:13:08,250 --> 00:13:09,520
>> ასე რომ, ჩვენ გვაქვს ჩვენი კომპონენტი.

281
00:13:09,520 --> 00:13:12,210
ჩვენ უნდა ვუთხრათ ეხმაურებიან დააყენა
კომპონენტის ეკრანზე

282
00:13:12,210 --> 00:13:18,990
ასე React.render, ასე რომ, ჩვენ
მკურნალობა app, როგორც ნებისმიერი სხვა ელემენტს.

283
00:13:18,990 --> 00:13:21,010
ჩვენ წერენ, როგორც ეს იყო ელემენტი.

284
00:13:21,010 --> 00:13:25,100
Like ნაცვლად ამბობს, როგორიცაა img
სურათის ან p პუნქტის,

285
00:13:25,100 --> 00:13:28,120
წერთ ოთახი, ასე რომ აპლიკაცია არ არის
მკურნალობა, როგორც HTML ელემენტს.

286
00:13:28,120 --> 00:13:30,380
როგორც ვთქვი, ეს
ელემენტს შესახებ სტეროიდების.

287
00:13:30,380 --> 00:13:32,870
>> ასე, რომ თქვენ გაწევა ოთახი, და თქვენ
მისთვის ადგილი დააყენოს იგი.

288
00:13:32,870 --> 00:13:37,170
და ეს არის, თუ როგორ შეგიძლიათ
გეტყვით, რომ ეს სად უნდა დააყენოს იგი.

289
00:13:37,170 --> 00:13:46,200
მე შევქმენით მარტივი div შესახებ
გვერდი სახელწოდებით პირადობის გვერდზე,

290
00:13:46,200 --> 00:13:48,300
და რომ ის, სადაც
ელემენტს აპირებს.

291
00:13:48,300 --> 00:13:49,841
>> და ჩვენ არ ვაპირებთ აწარმოებს HTML.

292
00:13:49,841 --> 00:13:53,145
ძირითადად ეს აპირებს
ჩასვამ ამ გვერდზე ელემენტს

293
00:13:53,145 --> 00:13:54,270
რომ ჩვენ გვაქვს ეკრანზე.

294
00:13:54,270 --> 00:13:59,210
ასე რომ ის მუშაობს ეს კოდი და იგი ამახვილებს ამ
რამ ეკრანზე, ასე რომ აქ ვართ.

295
00:13:59,210 --> 00:14:01,770
ჩვენ მივიღეთ ჩვენი პირველი რეაგირებას კომპონენტი.

296
00:14:01,770 --> 00:14:08,000
>> ამიტომ ისევე როგორც Recap, ჩვენ ნაზად გააკეთა
ახალი ტიპის კომპონენტი, არა?

297
00:14:08,000 --> 00:14:10,145
ეს არის ის, რაც React.createClass.

298
00:14:10,145 --> 00:14:12,680
და ამ კომპონენტს, ჩვენ
განუცხადა, რომ ის, რაც უნდა გააკეთოს.

299
00:14:12,680 --> 00:14:15,590
როდესაც ეს კომპონენტი
იყოს დაბეჭდილი გადატანა ეკრანზე,

300
00:14:15,590 --> 00:14:19,300
ეს იქნება ამობეჭდოთ div ერთად
ორი პუნქტები შიგნით მას.

301
00:14:19,300 --> 00:14:24,460
>> და, რაც ჩვენ გავაკეთეთ, ჩვენ მივიღეთ ახალი app
გამოყენებით კუთხური ფრჩხილი app ნოტაცია.

302
00:14:24,460 --> 00:14:27,160
ჩვენ ვუთხარით, რომ იმისათვის, რომ ეს
შიგნით გვერდი ელემენტს.

303
00:14:27,160 --> 00:14:29,867
ასე რომ, რა გავაკეთე, რომ ის
ახალი აპლიკაცია, რომ თარგი.

304
00:14:29,867 --> 00:14:31,200
და მაშინ მე ვუთხარი მას, გაუწიოს მას.

305
00:14:31,200 --> 00:14:33,680
ასე რომ, ეს ვუთხარი, app,
რა უნდა ამობეჭდოთ?

306
00:14:33,680 --> 00:14:36,970
App ამბობს, წასვლა ამობეჭდოთ div
ორი პუნქტები შიგნით მას.

307
00:14:36,970 --> 00:14:40,420
და voila, იქ ჩვენი div ერთად
ორი პუნქტის შიგნით მას.

308
00:14:40,420 --> 00:14:43,180
აზრი აქამდე?

309
00:14:43,180 --> 00:14:46,690
>> ასე რომ, კიდევ ერთხელ, მთელი გამოწვევა რეაგირებას
მხოლოდ იცის, თუ როგორ, რათა კომპონენტები.

310
00:14:46,690 --> 00:14:48,500
როგორ განვახორციელოთ
კომპონენტები მუშაობა.

311
00:14:48,500 --> 00:14:51,780
ახლა, რომ ჩვენ გავაკეთეთ ჩვენი პირველი
კომპონენტი, მოდით დავუბრუნდეთ

312
00:14:51,780 --> 00:14:54,284
და კომპონენტები დააკონფიგურიროთ.

313
00:14:54,284 --> 00:14:56,700
ასე რომ თქვენ იცით, თუ როგორ HTML თქვენ
შეუძლია თქვენი ღილაკები კლასი?

314
00:14:56,700 --> 00:14:59,146
თქვენ შეუძლია თქვენი წამყვანები href.

315
00:14:59,146 --> 00:15:00,770
თქვენ შეუძლია თქვენი საშუალებებით ტიპის, არა?

316
00:15:00,770 --> 00:15:04,740
თქვენ შეუძლია უფრო საბაჟო
თვისებები ყველა თქვენი ელემენტები

317
00:15:04,740 --> 00:15:06,490
რათა ის უფრო საინტერესო.

318
00:15:06,490 --> 00:15:09,030
ჩვენ რეალურად შეგვიძლია ამის
ზუსტად იგივე რამ.

319
00:15:09,030 --> 00:15:17,500
>> ასე ვთქვათ, ჩვენ გვინდა, რომ ჩვენი
app წასვლა გამოიტანოს ნებისმიერი ბარათი.

320
00:15:17,500 --> 00:15:19,630
ახლა ჩვენ მხოლოდ
გაწეული hardcoded ბარათი.

321
00:15:19,630 --> 00:15:22,530
ჩვენ ვიცით, რომ არსებობს მხოლოდ ერთი
ანკეტა შეუძლია, ამიტომ ჩვენ

322
00:15:22,530 --> 00:15:25,960
ვაპირებ ცდილობენ და შეცვალოს ეს ახლა ასე
რომ ჩვენ შეგვიძლია მხოლოდ მისცეს მას რამდენიმე ბარათი.

323
00:15:25,960 --> 00:15:27,410
ეს თქვენ ამობეჭდოთ ბარათი.

324
00:15:27,410 --> 00:15:29,380
>> თქვენ უნდა ვეცადოთ და თქვენი
კომპონენტები ძალიან ზოგადი მიზნით.

325
00:15:29,380 --> 00:15:31,654
ასე რომ, ეს გზა მე ვერ ელ
ეს ჩემი მეგობარი და იყოს,

326
00:15:31,654 --> 00:15:33,820
რასაც flashcard გაქვთ,
უბრალოდ შესანახი იგი აქ,

327
00:15:33,820 --> 00:15:35,290
და ეს ამას თავისთავად.

328
00:15:35,290 --> 00:15:37,650
თქვენ შეგიძლიათ განათავსოთ სხვა
რამ საკუთარი app.

329
00:15:37,650 --> 00:15:40,600
>> მაგრამ პირველი, მოდით დაარღვიოს ეს
დაყოფილია ორ კომპონენტს,

330
00:15:40,600 --> 00:15:44,500
მაგრამ ჩვენ გვინდა, რომ გამოყოფა განყოფილებიდან
ბეჭდვის ნაწილი ფაქტობრივი app ნაწილი.

331
00:15:44,500 --> 00:15:46,660
რა შეგვიძლია გავაკეთოთ არის
შეგიძლიათ შეცვალოთ ეს აპლიკაცია

332
00:15:46,660 --> 00:15:51,300
რომ CardView, უბრალოდ
ახალი სახელი app,

333
00:15:51,300 --> 00:15:54,450
და ჩვენ შეგვიძლია ახალი
კომპონენტი მოუწოდა ოთახი,

334
00:15:54,450 --> 00:15:56,336
არ უნდა აგვერიოს ძველი ოთახი.

335
00:15:56,336 --> 00:16:00,730
ჩვენ მივიღეთ createClass,
და, როგორც HTML,

336
00:16:00,730 --> 00:16:03,590
თქვენ შეგიძლიათ ბუდე რეაგირებას კომპონენტები
შიგნით ერთმანეთს.

337
00:16:03,590 --> 00:16:16,430
>> ასე რომ, ამ გაწევა ფუნქცია,
ფუნქციის დაბრუნების CardView,

338
00:16:16,430 --> 00:16:18,234
და ეს არის ზუსტად იგივე რამ.

339
00:16:18,234 --> 00:16:19,400
იხილეთ, თუ რატომ არის იგივე?

340
00:16:19,400 --> 00:16:22,590
იმის ნაცვლად, რომ გაწევის უბრალოდ app რომ
აქვს div და დაწყვილების შიგნით,

341
00:16:22,590 --> 00:16:26,194
ოთახი უწევს CardView და
CardView უწევს div და მე.

342
00:16:26,194 --> 00:16:29,110
ასე რომ, ეს არის ჩვენი პირველი მაგალითი
მობუდარი ელემენტების შიგნით ერთმანეთს.

343
00:16:29,110 --> 00:16:32,177
ამას რამე აზრი აქვს?

344
00:16:32,177 --> 00:16:33,760
ასე რომ, კიდევ ერთხელ, ჩვენ გვაქვს CardView ელემენტს.

345
00:16:33,760 --> 00:16:37,250
ჩვენ გვყავს app ელემენტების
რომ ეს არის უფრო დიდი, ვიდრე.

346
00:16:37,250 --> 00:16:40,990
>> OK, ასე რომ, ჩვენ გვინდა, რომ ჩვენი CardView-- თუ
მისცეს კარგი CardView გარკვეული ბარათი,

347
00:16:40,990 --> 00:16:43,370
ეს ამობეჭდოთ თქვენთვის, არა?

348
00:16:43,370 --> 00:16:48,050
ასე რომ, პირველ რიგში, ჩვენ უნდა მიიღოს ბარათი,
მოდით ბარათი ობიექტი.

349
00:16:48,050 --> 00:17:02,930
ასე რომ, მოდით ჩემი ბარათი გაუტოლდება
თუ თქვენ ყველა იცნობს,

350
00:17:02,930 --> 00:17:05,260
ეს არის მხოლოდ notation მიღების
ობიექტის JavaScript.

351
00:17:05,260 --> 00:17:09,280
ეს არის სახის მოსწონს struct
C, ამიტომ ჩვენ მივიღეთ ბარათი,

352
00:17:09,280 --> 00:17:15,920
და ასე რომ, ახლა ჩვენ შეგვიძლია გაივლის ამ ბარათს
ქონების ან როგორც ატრიბუტის HTML

353
00:17:15,920 --> 00:17:17,290
დღეს ჩვენი app.

354
00:17:17,290 --> 00:17:20,210
ასე რომ, ჩვენ შეგვიძლია ამის გაკეთება, App
ანკეტა ტოლია myCard.

355
00:17:20,210 --> 00:17:23,200
>> თქვენ იცით, როგორ შეყვანის, თქვენ
შეყვანის ტიპის შეადგენს ტექსტი ან ღილაკს

356
00:17:23,200 --> 00:17:25,240
კლასი შეადგენს btn for ჩატვირთვის ,?

357
00:17:25,240 --> 00:17:29,500
იგივე იდეა, App განყოფილებიდან equals--
თქვენ მოხვდით ბოლო braces აქ

358
00:17:29,500 --> 00:17:33,830
App ბარათი ტოლია myCard, ასე რომ ეს
ამბობს, რომ ჩვენ გვაქვს ამ ბარათის ობიექტი.

359
00:17:33,830 --> 00:17:39,149
მე ვაპირებ გაკეთებას, როგორც
ქონების ოთახი კომპონენტი.

360
00:17:39,149 --> 00:17:41,440
ეს app კომპონენტი
ვერ შეძლონ და ამის

361
00:17:41,440 --> 00:17:43,580
საინტერესო პერსონალის იგი.

362
00:17:43,580 --> 00:17:47,650
>> ასე რომ, ჩვენი app იქნება
მოცემული ბარათი, ასე რომ ახლა,

363
00:17:47,650 --> 00:17:49,980
მოდით აქვს app უბრალოდ მისცეს
ბარათის CardView

364
00:17:49,980 --> 00:17:53,110
თავად, რადგან, როგორც აპლიკაცია არ არის
აპირებს, თუ რა უნდა გააკეთოს,

365
00:17:53,110 --> 00:17:54,850
ასე რომ, ჩვენ მხოლოდ მისცეს მას CardView.

366
00:17:54,850 --> 00:18:00,050
ასე რომ, ჩვენ გაიაროს ეს
ანალოგიურად, ბარათი ტოლია,

367
00:18:00,050 --> 00:18:05,426
და ასე ყოველ კომპონენტს შეუძლია
რამ, რაც უკვე გადაეცა იგი.

368
00:18:05,426 --> 00:18:07,800
მათ შეუძლიათ თვისებები
რომ არ მიეცა მას

369
00:18:07,800 --> 00:18:09,470
გამოყენებით ამ სინტაქსი, this.props.card.

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

371
00:18:12,010 --> 00:18:14,920
>> რა ხდება აქ
თქვენ გაქვთ myCard ობიექტი.

372
00:18:14,920 --> 00:18:18,250
თქვენ გაივლის მას app
გამოყენებით App ბარათი ტოლია myCard.

373
00:18:18,250 --> 00:18:21,420
ეს ბარათი ობიექტი ენიჭება თქვენი app.

374
00:18:21,420 --> 00:18:24,400
ოთახი შეგიძლიათ თქვათ, რომ
როგორც this.props.card.

375
00:18:24,400 --> 00:18:28,780
ეს არის ერთგვარი მოსწონს გამოსახულება
იცის, რა წყარო არის.

376
00:18:28,780 --> 00:18:31,972
>> ეს აპლიკაცია იცის, რა არის განყოფილებიდან
არის, და ეს შეიძლება გავაკეთოთ პერსონალის იგი.

377
00:18:31,972 --> 00:18:32,930
მას შეუძლია გააკეთოს გაანგარიშებები.

378
00:18:32,930 --> 00:18:35,290
მას შეუძლია მიიღოს გადაწყვეტილება გამორთვა იგი.

379
00:18:35,290 --> 00:18:39,950
>> ახლა, მივდიოდი გაივლის
this.props.card გადატანა CardView.

380
00:18:39,950 --> 00:18:43,420
აზრი აქამდე?

381
00:18:43,420 --> 00:18:45,210
ეს კიდე უფრო გრძნობა, ახლა.

382
00:18:45,210 --> 00:18:46,990
>> OK, ასე რომ, ახლა ჩვენ ვართ CardView.

383
00:18:46,990 --> 00:18:51,719
ჩვენი CardView, იმის გათვალისწინებით, ბარათი, უნდა
ამობეჭდოთ მისი კითხვა და პასუხი.

384
00:18:51,719 --> 00:18:54,510
ახლა ჩვენ მხოლოდ დაბეჭდილი ზოგიერთი
hardcoded კითხვები და პასუხები.

385
00:18:54,510 --> 00:18:57,720
ჩვენ უნდა გაერკვნენ out-- ჩვენ გვჭირდება
ვთხოვო ბარათი, რომელიც მათ მოგვცა

386
00:18:57,720 --> 00:19:01,360
რა არის კითხვა და პასუხი, და
მაშინ ბეჭდვა ეს out შევიდა ეკრანზე.

387
00:19:01,360 --> 00:19:02,470
>> ასე რომ, ჩვენ შეგვიძლია ამის გაკეთება აქ.

388
00:19:02,470 --> 00:19:06,135
In გაწევა begin-- გავაკეთოთ შეადგენს.

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

390
00:19:08,710 --> 00:19:13,050
ასე რომ, რასაც ჩვენ ვაკეთებთ აქ ჩვენ ვიცით, რომ
ბარათები მოგვცა ქონება,

391
00:19:13,050 --> 00:19:13,580
არა?

392
00:19:13,580 --> 00:19:15,930
ეს მოცემულია ჩვენთვის, როგორც შეყვანა.

393
00:19:15,930 --> 00:19:19,440
ისევე, როგორც ეს თითქმის ისევე,
არგუმენტები ფუნქცია.

394
00:19:19,440 --> 00:19:22,810
ბარათის არგუმენტი
თითქმის ეს CardView.

395
00:19:22,810 --> 00:19:25,239
>> ჩვენ ამონაწერი, რომ, და ამით
ეს ცვლადი კითხვა.

396
00:19:25,239 --> 00:19:27,280
დარწმუნდით, რომ პასუხი წავიდა
ცვლადი პასუხი.

397
00:19:27,280 --> 00:19:31,130
მოთხოვნა, რომ ანკეტა უპასუხოს.

398
00:19:31,130 --> 00:19:35,072
და ახლა რომ ჩვენ გვაქვს ეს,
ნაცვლად დაბეჭდვის, რომ ტექსტი,

399
00:19:35,072 --> 00:19:37,030
ჩვენ ვაპირებთ, რომ ამობეჭდოთ
რასაც ისინი მოგვცა.

400
00:19:37,030 --> 00:19:43,580
>> ასე რომ, ამ პერსონალის ამიტომ ჩვენ ვაპირებთ
დააყენა კითხვა პასუხი.

401
00:19:43,580 --> 00:19:46,380
მოდით ვნახოთ, თუ ეს სამუშაოები.

402
00:19:46,380 --> 00:19:52,800
Cool, მოდით დაიხევს მეშვეობით იგი
კიდევ ერთხელ უბრალოდ დარწმუნებული უნდა იყოს.

403
00:19:52,800 --> 00:20:00,470
>> ასე რომ, ჩემი ბარათი ბარათი ობიექტი, და ჩვენ
ვაძლევთ, რომ ბარათის app.

404
00:20:00,470 --> 00:20:04,790
და app აპირებს მიიღოს
ბარათი და მისცეს მას CardView.

405
00:20:04,790 --> 00:20:09,190
ეს CardView თქმით, იმ შემთხვევაში, თუ
მომეცი ნებისმიერი flashcard ობიექტი,

406
00:20:09,190 --> 00:20:11,920
მე ამობეჭდოთ მისი კითხვა
და მისი პასუხი, არა?

407
00:20:11,920 --> 00:20:14,590
>> ასე რომ, რა შეიძლება გავაკეთოთ არის შემიძლია
გაუგზავნე ეს კოდი, პირველი

408
00:20:14,590 --> 00:20:16,580
მოსწონს 10 ხაზი, ჩემი კოდი, ჩემი მეგობარი.

409
00:20:16,580 --> 00:20:18,820
მან შეიძლება embed მას
საკუთარი განცხადების საფუძველზე.

410
00:20:18,820 --> 00:20:27,200
და რადგან მან იგივე,
ისევე როგორც CardView განყოფილებიდან უდრის,

411
00:20:27,200 --> 00:20:30,580
რადგან მან შექმნა CardView
და მისცა მას სწორი ინფორმაცია,

412
00:20:30,580 --> 00:20:31,987
მან შეიძლება გაწევა საკუთარი ბარათი.

413
00:20:31,987 --> 00:20:34,320
ასე რომ, ამ გზით, ეს მართლაც
მაგარი გზა თქვენ უნდა ავაშენოთ

414
00:20:34,320 --> 00:20:35,906
კომპონენტების გამოყენებით ერთმანეთს, არა?

415
00:20:35,906 --> 00:20:38,280
ეს ბარათი, მე ვერ აქვეყნებს
ამ CardView ინტერნეტში,

416
00:20:38,280 --> 00:20:39,790
და ადამიანი შეძლებს გამოიყენოს იგი.

417
00:20:39,790 --> 00:20:45,070
ასე რომ, ძირითადად, ეს, როგორც ერთი
სტანდარტული ფუნქციების C ბიბლიოთეკა.

418
00:20:45,070 --> 00:20:47,280
>> ეს არის ფუნქცია, სადაც
ვიღაცამ წერია ეს.

419
00:20:47,280 --> 00:20:48,419
თქვენ გარკვეული შეყვანა.

420
00:20:48,419 --> 00:20:49,710
ეს თქვენ აწარმოოს გარკვეული გამომავალი.

421
00:20:49,710 --> 00:20:50,890
თქვენ არ აინტერესებს, თუ როგორ მუშაობს იძულებით.

422
00:20:50,890 --> 00:20:53,790
რადგან თქვენ მისცეს მას სწორი
შეყვანის, ის ყველაფერს იმისათვის, რომ სწორი გამომავალი.

423
00:20:53,790 --> 00:20:57,850
>> და კომპონენტი შეიძლება იყოს
ეგონა, რომ იგივე გზით.

424
00:20:57,850 --> 00:21:00,280
ეს CardView ჰგავს
ბიბლიოთეკა ფუნქცია.

425
00:21:00,280 --> 00:21:03,400
თუ თქვენ მისცეს მას გარკვეული განყოფილებიდან
როგორც საკუთრება, იგი ყველაფერს

426
00:21:03,400 --> 00:21:05,095
ამობეჭდოთ შინაარსი რომ ბარათი.

427
00:21:05,095 --> 00:21:16,820
Like თუ შევცვალო ჩემი ბარათი
ნაცვლად, რა არის 5 პლუს 37,

428
00:21:16,820 --> 00:21:19,210
იგი განაახლებს შესაბამისად.

429
00:21:19,210 --> 00:21:21,955
ასე რომ, უბრალოდ შეცვლით input,
იგი იღებს გარკვეული გამომავალი.

430
00:21:21,955 --> 00:21:24,830
ასე რომ, შეგიძლიათ წარმოიდგინოთ, კომპონენტების თითქმის
ფუნქციები ამ გზით, რომელიც

431
00:21:24,830 --> 00:21:25,920
თქვენ შეგიძლიათ ერთად.

432
00:21:25,920 --> 00:21:29,440
თქვენ მიიღოს შეყვანის, როგორც ეს CardView
როგორც შეყვანის, თქვენ გამომუშავება.

433
00:21:29,440 --> 00:21:31,900
ამ შემთხვევაში, გამომავალი არის HTML.

434
00:21:31,900 --> 00:21:34,404
აზრი აქამდე?

435
00:21:34,404 --> 00:21:36,890
ზემოთ, კიდევ ერთხელ, თვისებები
როგორ შეგიძლიათ გაივლის ინფორმაცია

436
00:21:36,890 --> 00:21:40,900
შევიდა და გარეთ კომპონენტები.

437
00:21:40,900 --> 00:21:42,740
>> OK, ასე რომ მოდით ეს
რამ ინტერაქტიული.

438
00:21:42,740 --> 00:21:44,450
ახლა ეს სახის მოსაწყენი.

439
00:21:44,450 --> 00:21:45,520
რა არის [INAUDIBLE]?

440
00:21:45,520 --> 00:21:48,210
თქვენ შეგიძლიათ ამობეჭდოთ რაღაც out,
მაგრამ ეს ყველაფერი მას შეუძლია გააკეთოს.

441
00:21:48,210 --> 00:21:51,550
>> მოდით წავიდეთ უკან
წლის კითხვა მხოლოდ ახლა.

442
00:21:51,550 --> 00:21:54,405
OK, ასე რომ ახლა ეს კომპონენტები
მოსაწყენი, რადგან ყველა ისინი,

443
00:21:54,405 --> 00:21:55,030
ისინი კიდევ შეყვანა.

444
00:21:55,030 --> 00:21:56,100
ისინი გამომავალი, არა?

445
00:21:56,100 --> 00:21:57,049
სწორედ ასეთი მოსაწყენი.

446
00:21:57,049 --> 00:21:59,090
ჩვენ გვინდა, რომ ჩვენი
კომპონენტების შეძლებს აქვს

447
00:21:59,090 --> 00:22:02,150
გარკვეული სახის შიდა სახელმწიფოებრივი
ისევე როგორც მახსოვს რაღაც.

448
00:22:02,150 --> 00:22:05,320
>> იყიდება flashcard, ამისთვის
მაგალითად, რა ტიპის სახელმწიფო

449
00:22:05,320 --> 00:22:07,550
შეიძლება გსურთ
გახსოვთ flashcard?

450
00:22:07,550 --> 00:22:09,740
რა დროებითი სტატუსი
შესაძლოა, თქვენ უნდა გვახსოვდეს,

451
00:22:09,740 --> 00:22:12,491
ამისთვის flashcard ერთი flashcard app?

452
00:22:12,491 --> 00:22:13,990
აუდიტორია: მიუხედავად იმისა, რომ უკვე სავალი?

453
00:22:13,990 --> 00:22:14,990
NEEL Mehta: ჰო, მარჯვნივ.

454
00:22:14,990 --> 00:22:17,665
ამიტომ დაგვჭირდება შენარჩუნება
სიმღერა ხარ გავუსწოროთ ან

455
00:22:17,665 --> 00:22:19,100
თქვენ წინაშე ქვევით ბარათზე.

456
00:22:19,100 --> 00:22:23,420
On Facebook, მაგალითად, თქვენ აკეთებთ
უნდა გვახსოვდეს, სადაც საინფორმაციო feed

457
00:22:23,420 --> 00:22:25,870
ხარ და მინდა, ვინ არის ნახვა
აკეთებ ახლა.

458
00:22:25,870 --> 00:22:30,127
>> On Messenger, როგორიცაა რა ტექსტი თქვენ
ჩაწერეთ შეტანის ყუთი, უფლება?

459
00:22:30,127 --> 00:22:31,710
თუ თქვენ ამოცნობა გვერდზე, იგი მიდის.

460
00:22:31,710 --> 00:22:32,793
მაგრამ თქვენ ნამდვილად არ მაინტერესებს.

461
00:22:32,793 --> 00:22:33,770
ეს მხოლოდ დროებითია.

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

463
00:22:34,548 --> 00:22:36,152
>> აუდიტორია: [INAUDIBLE]

464
00:22:36,152 --> 00:22:38,360
NEEL Mehta: Like ფლეშ
ბარათი, როგორც თქვენ შეიძლება ვხედავთ

465
00:22:38,360 --> 00:22:40,290
კითხვა მხარეს ან პასუხი მხარეს?

466
00:22:40,290 --> 00:22:41,070
>> აუდიტორია: OK.

467
00:22:41,070 --> 00:22:43,270
>> NEEL Mehta: Like
ორმხრივი flashcard, არა?

468
00:22:43,270 --> 00:22:46,370
ჰო, ასე რომ თქვენ გსურთ
ამ იდეის ახლა

469
00:22:46,370 --> 00:22:50,370
მაქვს თვისებები, რომელიც, როგორც საშუალებებით,
მაგრამ სახელმწიფო, რომელიც არის დროებითი, uh,

470
00:22:50,370 --> 00:22:51,839
სადაც თქვენ ხართ გვერდზე, უფლება?

471
00:22:51,839 --> 00:22:54,380
ისევ და ისევ, მე ვთქვი Facebook
Messenger, მე მაქვს, როგორიცაა რომელიც პირს

472
00:22:54,380 --> 00:22:56,550
თქვენ ათვალიერებენ Facebook
ან ვინ არის ნახვა, არა?

473
00:22:56,550 --> 00:22:58,030
>> ეს არის მხოლოდ დროებითი.

474
00:22:58,030 --> 00:23:01,200
მნიშვნელოვანია, რომ დავანახოთ შესახებ
რა ხდება, მაგრამ ამოცნობა გვერდზე.

475
00:23:01,200 --> 00:23:02,250
ეს ნამდვილად არ აქვს.

476
00:23:02,250 --> 00:23:04,530
ასე რომ, ეს დროებითი სახელმწიფო,
ასე რომ, ჩვენ ყველა ეს სახელმწიფო.

477
00:23:04,530 --> 00:23:06,250
>> ასე რომ, კიდევ ერთხელ, იქ სახელმწიფო და props.

478
00:23:06,250 --> 00:23:09,084
რეკვიზიტები არის input მოცემული
თქვენი მონაცემთა წყარო.

479
00:23:09,084 --> 00:23:10,250
სახელმწიფო არის, ისევე, დეფოლტის.

480
00:23:10,250 --> 00:23:13,700
ეს, ისევე, პერსონალი, რომ
ხდის რამ ინტერაქტიული.

481
00:23:13,700 --> 00:23:17,720
>> ასე რომ, ჩვენი CardView-- მოდით
ჩვენი CardView-- ასე ლამაზი.

482
00:23:17,720 --> 00:23:21,420
ის, რასაც ჩვენ ვაპირებთ, რომ აქ, ჩვენ ვაპირებთ
შეეხოთ CardView და მხოლოდ CardView.

483
00:23:21,420 --> 00:23:25,105
ასე რომ, ჩემი მეგობარი, რომელიც მივიღე ეს, ისინი
არ შეამჩნევთ რაიმე განსხვავება.

484
00:23:25,105 --> 00:23:27,230
ისინი არ უნდა შეიცვალოს
რომელიმე საკუთარი კოდი

485
00:23:27,230 --> 00:23:29,410
მაგრამ ისინი მინდა, რომ მათი
CardView მიიღო souped up.

486
00:23:29,410 --> 00:23:31,270
ეს არის ლამაზი ნაწილი კომპონენტები.

487
00:23:31,270 --> 00:23:35,290
>> OK, ასე, რომ ჩვენს CardView, მოდით, ვცადოთ და
ტრეკზე თუ არა ჩვენ ფაზა up

488
00:23:35,290 --> 00:23:36,560
ან წინაშე ქვემოთ.

489
00:23:36,560 --> 00:23:40,480
In რეაგირებას ჩვენ ამისათვის პირველი
სასურველი საწყის მდგომარეობას.

490
00:23:40,480 --> 00:23:42,070
სად განყოფილებიდან დაიწყოს?

491
00:23:42,070 --> 00:23:48,480
>> ასე რომ, რა ფუნქცია მოუწოდა getInitialState
ფუნქციონირებს და ჩვენ დაუბრუნოს ობიექტი.

492
00:23:48,480 --> 00:23:53,310
ეს ობიექტი შეიცავს რამდენიმე სახელმწიფო და
სახელმწიფო მხოლოდ ძირითადი ღირებულების წყვილი.

493
00:23:53,310 --> 00:23:56,950
ისევე დაავალებს, თქვენ გაქვთ გასაღები და
ღირებულება, თქვენ გაქვთ, როგორიცაა სახელი სიმებიანი.

494
00:23:56,950 --> 00:24:01,410
>> ამ შემთხვევაში, ასე ვთქვათ წინა მართალია.

495
00:24:01,410 --> 00:24:03,760
ეს ამბობს, რომ ჩვენ სახელმწიფო გვაქვს.

496
00:24:03,760 --> 00:24:06,570
ერთი კომპონენტი სახელმწიფო
ატრიბუტი მოუწოდა წინაშე.

497
00:24:06,570 --> 00:24:09,649
[INAUDIBLE], ასე იყოს,
ჩვენ თვალწინ ბარათი,

498
00:24:09,649 --> 00:24:11,440
და ჩვენ შეგვიძლია შევცვალოთ ეს
როგორც ჩვენ Flip ბარათი.

499
00:24:11,440 --> 00:24:13,380
აზრი?

500
00:24:13,380 --> 00:24:18,190
>> OK, ასე რომ გამოიტანოს, ახლა, ჩვენ
ნაჩვენებია კითხვა და პასუხი.

501
00:24:18,190 --> 00:24:20,860
ახლა, რა უნდა გავაკეთოთ
შოუ კითხვა

502
00:24:20,860 --> 00:24:24,370
თუ ჩვენ თვალწინ ბარათი ისე,
პასუხი არის, რომ უკან ბარათზე.

503
00:24:24,370 --> 00:24:26,850
ამიტომ, თქვენ ყველა გააკეთოს
ბარათის ინტერაქტიული.

504
00:24:26,850 --> 00:24:28,100
მოდით ცდილობენ და ეს აქ.

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

506
00:24:31,600 --> 00:24:33,620
ისე, პირველი, უბრალოდ, რომ ცვლადი.

507
00:24:33,620 --> 00:24:37,790
ჩვენ შეგვიძლია ვკითხოთ ახლა this.state.front.

508
00:24:37,790 --> 00:24:42,010
ჩვენ შედიხართ იგივეს ჩვენ
ხელმისაწვდომობა props, ასე this.state.front.

509
00:24:42,010 --> 00:24:45,870
>> თუ ჩვენ წინაშე, მაშინ ტექსტი
არის this.props.card.question.

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

511
00:24:48,777 --> 00:24:51,360
თუ ჩვენ შესახებ თვალწინ
ბარათი, ჩვენ ვაპირებთ, რომ ცდილობენ და დაიბრუნოს

512
00:24:51,360 --> 00:24:52,485
კითხვა ბარათი.

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

514
00:24:54,782 --> 00:24:57,240
წინააღმდეგ შემთხვევაში, თუ ჩვენ უკან
ბარათი, რა ვქნათ?

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

516
00:25:01,830 --> 00:25:02,750
>> აუდიტორია: პასუხი?

517
00:25:02,750 --> 00:25:05,041
>> NEEL Mehta: Yep, ასე ტექსტი
უდრის this.props.card.answer.

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

519
00:25:08,472 --> 00:25:10,930
მაგრამ თუ თქვენ შეამჩნევთ, ჩვენ გამოყენებით
სახელმწიფო უნდა მიიღოს გადაწყვეტილება

520
00:25:10,930 --> 00:25:14,420
რადგან ახლა კომპონენტი
გამოიყურება სხვადასხვა

521
00:25:14,420 --> 00:25:16,710
ეფუძნება off, თუ როგორ ეს ურთიერთქმედება იგი.

522
00:25:16,710 --> 00:25:20,355
ასე რომ, ნაცვლად დაბეჭდვისას ამ,
ჩვენ უბრალოდ ამობეჭდოთ ტექსტი.

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

524
00:25:25,270 --> 00:25:28,650
ზემოთ, ასე რომ, ახლა, როგორც ხედავთ,
ჩვენ ვხედავთ მხოლოდ კითხვა.

525
00:25:28,650 --> 00:25:37,720
და თუ მე შეცვლის სახელმწიფო აქ ხელით
წინა არის ცრუ მივიღებთ 42 უკან.

526
00:25:37,720 --> 00:25:39,720
>> ასე რომ, კიდევ ერთხელ, ეს კომპონენტი
აქვს საკუთარი სახელმწიფო.

527
00:25:39,720 --> 00:25:43,440
Like ღილაკს იცის, თუ არა
ეს უკვე დაპრესილი თუ არა,

528
00:25:43,440 --> 00:25:46,080
ეს რამ იცის, რა არის
წინ ან უკან.

529
00:25:46,080 --> 00:25:48,320
ჩვეულებრივ, ეს არის წლის წინ.

530
00:25:48,320 --> 00:25:50,840
და მაშინ, თუ ის წინ,
ჩვენ ამობეჭდოთ კითხვაზე.

531
00:25:50,840 --> 00:25:53,106
თუ ეს უკან, ჩვენ გამოგიგზავნით
ბეჭდვა პასუხი.

532
00:25:53,106 --> 00:25:54,980
ასე რომ, კიდევ ერთხელ, ინფორმაცია
მოცემული არის იგივე.

533
00:25:54,980 --> 00:25:59,090
უბრალოდ გამოიყურება სხვადასხვა
საფუძველზე, თუ როგორ პროგრამის.

534
00:25:59,090 --> 00:26:02,670
ასე, მაგალითად, Facebook Messenger,
მაშინაც კი, თუ თქვენ იგივე მონაცემთა წყარო,

535
00:26:02,670 --> 00:26:05,170
ეს შეიძლება სხვადასხვა
იმის გამო, რომ სახელმწიფო არის სხვადასხვა.

536
00:26:05,170 --> 00:26:08,421
თქვენ ეძებს
სხვადასხვა პირის გაგზავნა.

537
00:26:08,421 --> 00:26:10,930
>> OK, ასე რომ, ეს არის ყველა კარგად და
კარგი, მაგრამ ახლა, რა არის რეალურად

538
00:26:10,930 --> 00:26:15,940
გვაიძულებს შეუძლია შეცვალოს, თუ არა
ჩვენი ბარათი წინ ან უკან.

539
00:26:15,940 --> 00:26:19,010
ჩვენ შეგვიძლია ამის გაკეთება დასძინა flip
ღილაკს, ღილაკს ბარათი, რომელიც

540
00:26:19,010 --> 00:26:22,950
იქნება Flip ბარათი, თუ ის [INAUDIBLE].

541
00:26:22,950 --> 00:26:31,770
მოდით დავამატოთ ღილაკს აქ, ამ
ღილაკს, და ამ ღილაკს იტყვის flip.

542
00:26:31,770 --> 00:26:35,650
>> ასე რომ, ახლა,
არაფერს არ აკეთებს.

543
00:26:35,650 --> 00:26:37,075
უბრალოდ გამოიყურება ლამაზი.

544
00:26:37,075 --> 00:26:43,650
რა შეგვიძლია გავაკეთოთ არის ჩვენ შეგვიძლია დავამატოთ click
კურატორმა, onClick ტოლია this.flip,

545
00:26:43,650 --> 00:26:44,820
და ჩვენ განსაზღვრავს flip შემდეგ.

546
00:26:44,820 --> 00:26:47,120
მაგრამ, ძირითადად, onClick
არის ფუნქცია, რომელიც

547
00:26:47,120 --> 00:26:48,675
იღებს მოუწოდა, როდესაც მომხმარებელი იმოქმედებს ეს.

548
00:26:48,675 --> 00:26:52,330
>> ასე ღილაკს ეცოდინებათ
როდესაც ის უკვე დააწკაპებთ.

549
00:26:52,330 --> 00:26:54,750
წავიდა ის უკვე აირჩიეთ
ეს იქნება Flip ბარათი.

550
00:26:54,750 --> 00:26:58,382
ეს არის ერთგვარი, როგორც თქვენი
პიცა მიწოდების ბიჭი.

551
00:26:58,382 --> 00:27:01,590
თქვენ, როგორც, ყველა უფლება, როდესაც ვინმე
მეძახის, მე სიტყვით პიცა, არა?

552
00:27:01,590 --> 00:27:03,420
>> თქვენ დარეგისტრირების მსმენელს.

553
00:27:03,420 --> 00:27:04,530
თქვენ მოვუსმინოთ ღონისძიება.

554
00:27:04,530 --> 00:27:07,657
თქვენ მიიღებთ მოუწოდა, და როცა
მოვლენა ხდება, რაღაც.

555
00:27:07,657 --> 00:27:08,240
თქვენ მიიღებთ პიცა.

556
00:27:08,240 --> 00:27:11,480
ამ შემთხვევაში, როდესაც თქვენ
აირჩიეთ, Flip ბარათი.

557
00:27:11,480 --> 00:27:14,560
>> ასე რომ, ჩვენ უნდა განსაზღვროს
ფუნქცია, რომელიც Flip ბარათი,

558
00:27:14,560 --> 00:27:17,930
ასე რომ, ჩვენ წერენ, რომ უფლება
აქ, Flip ფუნქცია.

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

560
00:27:20,850 --> 00:27:23,680
ასე რომ, რას ფიქრობთ flip გააკეთებს?

561
00:27:23,680 --> 00:27:27,180
ისევ ეს იღებს მოუწოდა, როდესაც
ჩვენ დააწკაპუნეთ flip ღილაკს.

562
00:27:27,180 --> 00:27:29,406
რა უნდა ფუნქცია flip გავაკეთოთ?

563
00:27:29,406 --> 00:27:34,136
>> აუდიტორია: შეცვლა this.state.front
ჭეშმარიტი ცრუ, ყალბი ჭეშმარიტი.

564
00:27:34,136 --> 00:27:38,420
>> NEEL Mehta: Yep, ასე რომ, რაც არ უნდა
this.front is-- წინა სახელმწიფო.

565
00:27:38,420 --> 00:27:40,930
მიიღეთ წინაშე სახელმწიფო, თუ
ეს სიმართლეა, რომ ეს სიმართლეს არ შეესაბამება.

566
00:27:40,930 --> 00:27:42,530
თუ ეს ყალბი, მართალია, არა?

567
00:27:42,530 --> 00:27:45,330
მოდით ვეცადოთ, რომ.

568
00:27:45,330 --> 00:27:48,240
>> თქვენ ვერ შეცვლის სახელმწიფო
მხოლოდ ამით this.state.

569
00:27:48,240 --> 00:27:50,380
თქვენ არ შეგიძლიათ ამის გაკეთება.

570
00:27:50,380 --> 00:27:52,030
თქვენ არ შეგიძლიათ ამის გაკეთება.

571
00:27:52,030 --> 00:27:55,810
თქვენ უნდა გამოიყენოთ ფუნქცია
მოუწოდა this.setState.

572
00:27:55,810 --> 00:28:03,230
>> ასე რომ, შეიძლება ითქვას, this.setState წინა
მსხვილი ნაწლავის ამ, სადაც, კიდევ ერთხელ, ძახილის

573
00:28:03,230 --> 00:28:04,330
წერტილი ნიშნავს, პირიქით.

574
00:28:04,330 --> 00:28:07,420
ვფიქრობ, თუ ამ. state.front
მართალია, იგი იქცევა ყალბი.

575
00:28:07,420 --> 00:28:09,170
ამიტომ ჩვენ ვაყენებთ სახელმწიფო
ჭეშმარიტი ყალბი.

576
00:28:09,170 --> 00:28:11,430
თუ ეს ყალბი, ჩვენ
მითითებული ეს ცრუ ჭეშმარიტი.

577
00:28:11,430 --> 00:28:17,210
>> უბრალოდ შეამჩნია, რომ ჩვენ კომპლექტი და კიდევ ოდნავ
სხვაგვარად, და მოდით ცდილობენ ამ.

578
00:28:17,210 --> 00:28:18,675
Bada bing, შევხედოთ ამ.

579
00:28:18,675 --> 00:28:21,810
საქართველოს Flip ღილაკს ახლა
გადართოთ წინა უკან სახელმწიფო.

580
00:28:21,810 --> 00:28:24,990
>> ასე რომ, აქ, სადაც ხედავთ
ცოტა ჯადოსნური რეაგირებას.

581
00:28:24,990 --> 00:28:28,420
ისევე, როგორც ჩვენ არ უთხრა, რომ ის ხელახლა გაწევა.

582
00:28:28,420 --> 00:28:30,910
ჩვენ არ უთხრა მას შეეცვალა არაფერი.

583
00:28:30,910 --> 00:28:32,630
თუ თქვენ აკეთებთ ეს
გარეშე რეაგირებას, ნეტავ

584
00:28:32,630 --> 00:28:34,588
არ რომელთა მიზანია მოსწონს, როცა
flip ღილაკი დაწკაპავთ,

585
00:28:34,588 --> 00:28:37,290
ნეტავ უნდა გითხრათ, რომ ეს
ხელით ხელახლა გაწევა, არა?

586
00:28:37,290 --> 00:28:43,050
>> რეაგირებას ნამდვილად გაგრილებას, რომ თუ
მისცეს მას გარკვეული სახელმწიფო და თვისებები,

587
00:28:43,050 --> 00:28:45,760
ის ყოველთვის გაწევა
ზუსტად იგივე რამ.

588
00:28:45,760 --> 00:28:48,690
ამიტომ, როდესაც ჩვენ ოდესმე შევცვლით
სახელმწიფო და თვისებები,

589
00:28:48,690 --> 00:28:50,819
რეაგირება უბრალოდ ხელახლა უწევს მთელი რამ.

590
00:28:50,819 --> 00:28:52,860
იგი დარწმუნებულია, რომ იქ
ერთ-ერთი კორესპონდენცია

591
00:28:52,860 --> 00:28:57,270
სახელმწიფო და პარამეტრი და HTML.

592
00:28:57,270 --> 00:29:00,110
ასე რომ, როდესაც არც ერთი იმ
ცვლილებების მეშვეობით კომპლექტი სახელმწიფო,

593
00:29:00,110 --> 00:29:03,750
ეს შეიცვლება, თუ როგორ
ანაზღაურება ხელახლა გაწეული.

594
00:29:03,750 --> 00:29:06,650
ასე რომ, ძირითადად რეაგირებას ჰგავს
გელოდებათ შეიცვალოს.

595
00:29:06,650 --> 00:29:09,870
>> როდესაც იგი შეიცვლის რაღაც,
ის ხელახლა გაწევა მთელი გვერდი.

596
00:29:09,870 --> 00:29:12,480
და თუ ეს ხმები არაეფექტური,
ეს იმიტომ, რომ ეს იქნება,

597
00:29:12,480 --> 00:29:15,050
მაგრამ რეაგირება იყენებს რამ
ე.წ. Shadow DOM.

598
00:29:15,050 --> 00:29:19,950
იმის ნაცვლად, რომ ხატვის გვერდი პირდაპირ,
ინარჩუნებს ვირტუალური HTML ხე მეხსიერებაში.

599
00:29:19,950 --> 00:29:23,620
>> თქვენ იცით, HTML, როგორიცაა ხე,
ისევე როგორც იერარქიული მონაცემთა სტრუქტურას.

600
00:29:23,620 --> 00:29:28,990
იგი ინარჩუნებს ყალბი ხე მეხსიერება,
და როდესაც თქვენ განაახლოთ გვერდზე,

601
00:29:28,990 --> 00:29:31,940
ეს დავხაზავ სხვა ყალბი
ხე, და ეს თქვენ გამოთვლა

602
00:29:31,940 --> 00:29:35,120
რა შეიცვლება მას სჭირდება, რათა
გვერდი რათა ორი ხე თანაბარი.

603
00:29:35,120 --> 00:29:38,540
ასე რომ, ძირითადად, ის პრაქტიკულად
ხელახლა უწევს ბევრი.

604
00:29:38,540 --> 00:29:41,540
და მაშინ იგი მხოლოდ მინდა ცვლის
გვერდი პატარა შესწორებები, როგორც საჭიროა,

605
00:29:41,540 --> 00:29:44,240
ასე რომ, ეს ძალიან, ძალიან, ძალიან ეფექტური.

606
00:29:44,240 --> 00:29:46,970
>> ასე რომ, ძირითადად რეაგირებას იქნება
როდესაც თქვენ შეცვალოს რაღაც,

607
00:29:46,970 --> 00:29:49,010
ის ხელახლა გაწევა გვერდი პრაქტიკულად.

608
00:29:49,010 --> 00:29:52,830
ეს გაერკვნენ, თუ რა მჭირდება
შეცვლა, რათა რეალური გვერდი ასახავს

609
00:29:52,830 --> 00:29:55,602
ვირტუალური გვერდი, და ეს ყველაფერს გავაკეთებთ, რომ.

610
00:29:55,602 --> 00:29:56,560
ეს არის ვირტუალური DOM.

611
00:29:56,560 --> 00:29:59,350
ეს არის ერთ ერთი ყველაზე დიდი
თვისებები რეაგირებას.

612
00:29:59,350 --> 00:30:00,880
>> ამას რამე აზრი აქვს?

613
00:30:00,880 --> 00:30:01,540
ნებისმიერი კითხვები?

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

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

616
00:30:05,568 --> 00:30:08,969
>> აუდიტორია: როგორ აკეთებს
შედარება მაინც რომ MVC

617
00:30:08,969 --> 00:30:10,760
რომ ჩვენ ვისაუბრეთ
ადრე როგორიცაა რესურსები.

618
00:30:10,760 --> 00:30:13,527
>> NEEL Mehta: ჰო, კითხვა
არის როგორ შევადარებთ MVC?

619
00:30:13,527 --> 00:30:14,610
თქვენ სთხოვა რესურსების შესახებ.

620
00:30:14,610 --> 00:30:16,445
ისე, მოდით ვისაუბროთ, როგორ იმუშავებს.

621
00:30:16,445 --> 00:30:18,190
>> In MVC, ნეტავ განახლება მოდელი.

622
00:30:18,190 --> 00:30:20,560
ამ შემთხვევაში ჩვენ გვექნება განყოფილებიდან მოდელი.

623
00:30:20,560 --> 00:30:24,540
ხედი ექნება
flip ღილაკს და კონტროლი

624
00:30:24,540 --> 00:30:26,310
ექნება flip ფუნქცია.

625
00:30:26,310 --> 00:30:28,450
ასე რომ, ხედი ვეტყოდი
კონტროლერი Flip Flip.

626
00:30:28,450 --> 00:30:30,370
დაფის ვეტყოდი
მოდელი უნდა შეიცვალოს, არა?

627
00:30:30,370 --> 00:30:33,915
>> ასე რომ, როდესაც თქვენ ამის გაკეთება MVC, თქვენ
მოუსმინოს მოდელი უნდა შეიცვალოს,

628
00:30:33,915 --> 00:30:37,150
და თქვენ ხელახლა გაწევა კალენდარი შესაბამისად.

629
00:30:37,150 --> 00:30:39,210
ან თქვენ უბრალოდ უნდა მომწონს
აქვს კონტროლერი.

630
00:30:39,210 --> 00:30:42,418
დაელოდეთ მოდელი უნდა შეიცვალოს, და მაშინ
აირჩიოთ და ნაწილი, როგორც რამ

631
00:30:42,418 --> 00:30:44,032
შეცვლა.

632
00:30:44,032 --> 00:30:45,740
აქ ჩვენ გვაქვს ერთი რამ,
მაგრამ დიდი ოთახი,

633
00:30:45,740 --> 00:30:48,510
თქვენ უნდა მიყვარს გვახსოვდეს, თუ რა
ცვლილება თითოეული ადგილი,

634
00:30:48,510 --> 00:30:50,290
ასე რომ, ეს ცოტა შემაშფოთებელი.

635
00:30:50,290 --> 00:30:53,670
ასე რომ, რეაგირებას ლამაზი
იმიტომ, რომ მას აქვს Shadow Dom.

636
00:30:53,670 --> 00:30:56,040
ეს ვერ ახერხებს მხოლოდ
გადაწერა მთელი რამ.

637
00:30:56,040 --> 00:30:58,680
თქვენ არ გაქვთ შერჩევით
ისევე როგორც ვხვდები, რა უნდა განახლდეს.

638
00:30:58,680 --> 00:31:02,186
>> On Facebook თუ გნებავთ
მიიღოს ახალი ეპისტოლე, MVC,

639
00:31:02,186 --> 00:31:04,060
ნეტავ უნდა გვახსოვდეს,
OK, შეცვალოს რამ

640
00:31:04,060 --> 00:31:06,260
განთავსებულია ზევით
გვერდი, გაგზავნა ხატი.

641
00:31:06,260 --> 00:31:08,290
ასევე პოპ new window ბოლოში.

642
00:31:08,290 --> 00:31:10,070
ასევე, რათა ახალი რამ, რომ ფანჯარა.

643
00:31:10,070 --> 00:31:11,060
ასევე ითამაშოს ხმა.

644
00:31:11,060 --> 00:31:13,150
>> ეს არის ის, ბევრი პერსონალი
აპირებს out ამავე დროს.

645
00:31:13,150 --> 00:31:15,320
ასე რომ, თუ თქვენ არ
აქვს Shadow Dom, ნეტავ

646
00:31:15,320 --> 00:31:18,740
უნდა გავაკეთოთ, რომ ხელით, რადგან
თქვენ ვერ დაეღწია მთელ გვერდზე.

647
00:31:18,740 --> 00:31:21,430
თქვენ არ შეუძლია, ასე რომ თქვენ უნდა
შეცვლა თითოეული რამ ხელით,

648
00:31:21,430 --> 00:31:23,990
რომელიც მართლაც შემაშფოთებელი MVC.

649
00:31:23,990 --> 00:31:27,640
>> ასე რომ, იმისათვის, რომ
ხელმომჭირნე, ისინი შერჩევით

650
00:31:27,640 --> 00:31:30,750
განაახლოთ გვერდზე, რომელიც
ეფექტური, არამედ შემაშფოთებელი.

651
00:31:30,750 --> 00:31:34,002
In რეაგირებას, რადგან Shadow
Dom, თქვენ ორივე რამ უფასოდ.

652
00:31:34,002 --> 00:31:35,710
ეს არის ეფექტური, რადგან
ჩრდილოვანი Dom.

653
00:31:35,710 --> 00:31:37,210
სუსტი განახლებას გვერდზე.

654
00:31:37,210 --> 00:31:40,292
ეს არ აკეთებს ხე მანიპულირება.

655
00:31:40,292 --> 00:31:41,250
თქვენ მიიღებთ ეფექტურობა.

656
00:31:41,250 --> 00:31:45,420
თქვენ ასევე მარტივად გამოყენების გამო
თუ უბრალოდ გადაწერა მთელი გვერდი,

657
00:31:45,420 --> 00:31:48,970
მაგრამ თქვენ იცით, ყველა უფლება, რამ
ვაპირებთ, რომ გვერდზე სადღაც.

658
00:31:48,970 --> 00:31:51,180
ეს შეიძლება იყოს სხვადასხვა ადგილას, მაგრამ
ეს იქნება გვერდზე, უფლება?

659
00:31:51,180 --> 00:31:52,860
ასე, რომ თქვენ უბრალოდ ხელახლა გაწეული
მთელი რამ პრაქტიკულად,

660
00:31:52,860 --> 00:31:55,540
და თქვენ შესაძლოა რამდენიმე
ცვლილებები გვერდზე თავად.

661
00:31:55,540 --> 00:31:57,850
>> ასე რომ, კიდევ ერთხელ, MVC თქვენ
უნდა აირჩიოს

662
00:31:57,850 --> 00:32:01,840
შორის განმუხტვის გამოყენების და ეფექტურობის,
და რეაგირებას, თქვენ ორივე.

663
00:32:01,840 --> 00:32:04,020
ასე რომ, სჯობს.

664
00:32:04,020 --> 00:32:05,220
აზრი?

665
00:32:05,220 --> 00:32:06,676
მყარი.

666
00:32:06,676 --> 00:32:12,080
>> OK, ასე რომ ვნახოთ მოდით ვისაუბროთ
ცოტა შესახებ ნაბიჯი 4,

667
00:32:12,080 --> 00:32:14,740
როგორ შეგვიძლია იგივე კომპონენტები.

668
00:32:14,740 --> 00:32:16,260
ასე რომ, ჩვენ ამ წუთას.

669
00:32:16,260 --> 00:32:19,420
ჩვენ გვაქვს ჩვენი მაგარი პატარა ღილაკს.

670
00:32:19,420 --> 00:32:23,157
ჩვენ შეგვიძლია Flip უკან და
მეოთხე და რომ ყველა ის აკეთებს.

671
00:32:23,157 --> 00:32:24,990
მოდით ვთქვათ, ჩვენ გვინდა
გვაქვს კიდევ ერთი კომპონენტი.

672
00:32:24,990 --> 00:32:28,730
ვთქვათ ჩვენი flashcard app უნდა
შეიცავს სიაში ყველა ბარათები

673
00:32:28,730 --> 00:32:31,520
რომ თქვენ გაქვთ ისე, რომ ნიშნავს, რომ ჩვენ
უნდა ჰქონდეს ერთი კომპონენტი.

674
00:32:31,520 --> 00:32:32,970
ისე, იქნებ ეძახით სია.

675
00:32:32,970 --> 00:32:36,200
გადავდგათ სია, რომელიც
პარალელურად ერთად CardView,

676
00:32:36,200 --> 00:32:39,680
და ეს სია და CardView
მოეწონება მუშაობა.

677
00:32:39,680 --> 00:32:43,190
თქვენ შეგიძლიათ დააკავშიროთ მათ
იმისათვის, რომ ჩვენი ოთახი თქვენთვის.

678
00:32:43,190 --> 00:32:45,160
>> ასე რომ, პირველ რიგში, მოდით მიიღოს
რამდენიმე ბარათები უფლება.

679
00:32:45,160 --> 00:32:46,370
ვთქვათ, თუ რა ბარათები?

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

681
00:32:49,619 --> 00:32:51,910
და მხოლოდ ასე არ უნდა
ჭაბურღილის თქვენ აკრეფით ის,

682
00:32:51,910 --> 00:32:53,410
მე უბრალოდ აპირებს კოპირება აქ.

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

684
00:33:01,664 --> 00:33:03,580
ასე რომ, მე ვაპირებ არა
მისთვის მხოლოდ ერთი ბარათი.

685
00:33:03,580 --> 00:33:06,910
მე ვაპირებ, რათა ეს მასივი ბარათები.

686
00:33:06,910 --> 00:33:10,240
ასე რომ, პირველი ნაკადი
აპირებს დაარღვიოს ახლა.

687
00:33:10,240 --> 00:33:14,717
ყველა უფლება, ასე რომ, ჩვენ ვაპირებთ, რათა
ეს შეუძლია გაუმკლავდეს მრავალჯერადი ბარათები.

688
00:33:14,717 --> 00:33:17,800
ასე რომ, პირველი, ჩვენ ვაპირებთ, რათა ის, რომ არ
მხოლოდ ერთი ბარათი მაგრამ მასივი ბარათები,

689
00:33:17,800 --> 00:33:18,700
როგორც სიაში ბარათები.

690
00:33:18,700 --> 00:33:20,980
და ამ შემთხვევაში, ჩვენ გვაქვს სამი მათგანი.

691
00:33:20,980 --> 00:33:27,280
>> ყველა უფლება, ასე app არის
აპირებს მიიღოს სია ბარათები,

692
00:33:27,280 --> 00:33:29,870
და ის აპირებს, გადაწყვიტოს, რომელი
ერთ-ერთი, რათა აჩვენოს CardView.

693
00:33:29,870 --> 00:33:33,740
CardView მხოლოდ
გაწევა ერთი ბარათი, მაგრამ app

694
00:33:33,740 --> 00:33:37,610
იღებს სიაში ყველა ბარათები, არა?

695
00:33:37,610 --> 00:33:40,820
>> ასე რომ, როდესაც თქვენ გაერკვნენ ერთი
ანკეტა მისცეს CardView,

696
00:33:40,820 --> 00:33:44,660
როგორ ფიქრობთ, ვხვდები, თქვენ შესაძლოა
უნდა მიიღოს გადაწყვეტილება, რომელიც განყოფილებიდან

697
00:33:44,660 --> 00:33:47,064
ჩვენება?

698
00:33:47,064 --> 00:33:49,980
იმისათვის, რომ გიპასუხოთ, ეს დროებით
თქვენ ათვალიერებენ გარკვეული ბარათი.

699
00:33:49,980 --> 00:33:53,260
თუ თქვენ განაახლეთ გვერდი, თქვენ
უბრალოდ დაბრუნდეს პირველი ბარათი.

700
00:33:53,260 --> 00:33:55,464
ეს არის ის, OK იმიტომ, რომ ეს დროებითია.

701
00:33:55,464 --> 00:33:56,630
რა ტექნიკით შეიძლება გამოვიყენოთ?

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

703
00:34:02,534 --> 00:34:08,760
>> აუდიტორია: თქვენ შეიძლება მიიღოს ცვლადი
ასე რომ, ისევე, როგორც თქვენ ჰქონდა წინ.

704
00:34:08,760 --> 00:34:11,989
ეს ასეა, თქვენ შეიძლება
მიმდინარე ანკეტა უდრის 1?

705
00:34:11,989 --> 00:34:14,150
>> NEEL Mehta: ჰო, ამიტომ ჩვენ
გვინდა, რომ გვქონდეს სახელმწიფო, უფლება?

706
00:34:14,150 --> 00:34:16,080
თქვენ იყენებთ სახელმწიფო ამ
კომპონენტი გაერკვნენ

707
00:34:16,080 --> 00:34:17,288
რომელიც ბარათი ჩვენ გვინდა, რომ მიიღოს.

708
00:34:17,288 --> 00:34:19,290
ისევე, როგორც ჩვენ გვაქვს სია
ყველა ბარათი, ჩვენ გამოგიგზავნით

709
00:34:19,290 --> 00:34:21,630
გამოიყენოს სახელმწიფო, რათა გაერკვნენ
ერთ-ერთი პირველი ბარათი,

710
00:34:21,630 --> 00:34:23,710
მეორე ბარათი, მესამე ბარათი, და ასე შემდეგ.

711
00:34:23,710 --> 00:34:28,760
>> ასე რომ app ისე ოთახი მიიღებს
აქვს getInitialState ფუნქცია,

712
00:34:28,760 --> 00:34:35,020
getInitialState ფუნქციის სანაცვლოდ.

713
00:34:35,020 --> 00:34:39,929
და ჩვენ, უბრალოდ, ვამბობთ activeIndex 0.

714
00:34:39,929 --> 00:34:42,889
ასე რომ, ახლა ჩვენი app აქვს საკუთარი სახელმწიფო.

715
00:34:42,889 --> 00:34:47,179
>> ასე რომ, ახლა გაწევა, გაერკვნენ
ბარათი, მოდით უბრალოდ წასვლა მასივი

716
00:34:47,179 --> 00:34:49,969
და დაიბრუნოს რამ, რომ ინდექსი.

717
00:34:49,969 --> 00:34:53,580
აირჩიეთ ბარათი თანაბარი this.props.cards
this.state.activeIndex.

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

719
00:34:56,469 --> 00:35:00,162
ასე რომ, როგორც ხედავთ აქ, რეკვიზიტებს და
სახელმწიფო რეალურად მუშაობა.

720
00:35:00,162 --> 00:35:08,990
ასე რომ, ახლა რომ ჩვენ გვაქვს ჩვენი activeCard,
ჩვენ მოვუწოდებთ მას activeCard,

721
00:35:08,990 --> 00:35:10,470
და ვნახოთ, თუ ეს სამუშაოები.

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
>> ოჰ, რომ ტექსტი შეცდომა.

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, yep, ასე რომ, ახლა ჩვენ უკან
სად ვიყავით ადრე, არა?

729
00:35:54,840 --> 00:35:57,100
იმავე წლის პროგრამის გარდა
ახლა ჩვენ შეგვიძლია

730
00:35:57,100 --> 00:35:59,390
სია ბარათები, არა მხოლოდ ერთი ბარათი.

731
00:35:59,390 --> 00:36:04,130
და ახლა, კიდევ ერთხელ, თუ შევცვლით
activeIndex, ჩვენ შეგვიძლია წავიდეთ 0-დან 1,

732
00:36:04,130 --> 00:36:07,330
და ახლა, რომ მეორე ბარათი,
და მერე წავედით 0.

733
00:36:07,330 --> 00:36:10,390
ასე რომ, აქ არის ახალი
souped-up ვერსია ჩვენი.

734
00:36:10,390 --> 00:36:16,000
>> OK, ასე რომ, ახლა მოდით აქვს სია, რომელიც
აჩვენებს ყველა კარტს თქვენს პროგრამაში,

735
00:36:16,000 --> 00:36:19,980
ასე რომ, ჩვენ, რათა ახალი
კომპონენტი მოუწოდა listview.

736
00:36:19,980 --> 00:36:22,155
მოდით listview ტოლია react.createClass.

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

738
00:36:32,890 --> 00:36:38,800
ასე რომ, ჩვენ გვინდა, რომ გაუწიოს უწესრიგო
სიაში სიის ელემენტი ყველა ბარათი.

739
00:36:38,800 --> 00:36:41,490
ასე რომ, ჩვენ გვაქვს რამოდენიმე ბარათები.

740
00:36:41,490 --> 00:36:44,990
ჩვენ გვინდა, რომ ერთ-ერთი ხაზი
ყველა ბარათი, უფლება?

741
00:36:44,990 --> 00:36:47,490
ჩვენ შეგვიძლია გავაკეთოთ ამისთვის მარყუჟის ან
რაღაც, რათა ახალ სიას ერთეულზე.

742
00:36:47,490 --> 00:36:50,522
მაგრამ გზა თქვენ ამას
რეაგირებას, გამოიყენოთ რამ მოუწოდა რუკაზე.

743
00:36:50,522 --> 00:36:57,150
რუკა არის ინსტრუმენტი ან ფუნქცია თქვენ იყენებთ
რომ ყოველი ნივთი, გადის რამდენიმე ფუნქცია,

744
00:36:57,150 --> 00:36:59,510
იღებს დაბრუნების ღირებულება, და
გაძლევთ, რომ უკან.

745
00:36:59,510 --> 00:37:06,310
>> ასე რომ, როგორც მაგალითად, ჩვენ გვაქვს მასივი
1, 2, 3.map ფუნქცია და ეს

746
00:37:06,310 --> 00:37:12,120
არის სტენოგრამის ამისთვის
ფუნქცია x arrow x * x.

747
00:37:12,120 --> 00:37:16,110
ეს ამბობს, ყველა ნომერი
1, 2, 3, მას.

748
00:37:16,110 --> 00:37:17,800
მოედანზე, და მისცეს მას უკან.

749
00:37:17,800 --> 00:37:22,090
ასე რომ, რას ფიქრობთ, 1,
2, 3.map x მიდის x-ჯერ

750
00:37:22,090 --> 00:37:25,480
x გაძლევთ უკან მოცემული
რომ ეს ფუნქცია

751
00:37:25,480 --> 00:37:27,680
აწარმოებს ყველა ელემენტს რომ მასივი.

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

753
00:37:30,837 --> 00:37:32,190
>> აუდიტორია: 1, 4 9?

754
00:37:32,190 --> 00:37:35,709
>> NEEL Mehta: Yep, 1, 4, 9
იმიტომ, რომ თქვენ 1 ჯერ 1.

755
00:37:35,709 --> 00:37:36,500
ეს გაძლევთ ერთი.

756
00:37:36,500 --> 00:37:37,690
ეს არის პირველი ელემენტს.

757
00:37:37,690 --> 00:37:38,530
>> 2 ჯერ 2 4.

758
00:37:38,530 --> 00:37:39,570
ეს არის მეორე ელემენტს.

759
00:37:39,570 --> 00:37:40,310
3-ჯერ 3 არის 9.

760
00:37:40,310 --> 00:37:41,540
ეს არის მესამე ელემენტს.

761
00:37:41,540 --> 00:37:42,640
აზრი?

762
00:37:42,640 --> 00:37:45,015
ასე რომ რუკა აქვს ტექნიკით თქვენ
გამოყენება ფუნქციური პროგრამისტების,

763
00:37:45,015 --> 00:37:48,090
ახალი სტილი
პროგრამირების, რომ რამე

764
00:37:48,090 --> 00:37:50,500
ყველა ელემენტს თქვენს სიაში.

765
00:37:50,500 --> 00:37:51,970
ასე რომ, ეს ნაცნობია.

766
00:37:51,970 --> 00:37:53,370
გვაქვს სია ბარათები.

767
00:37:53,370 --> 00:37:56,860
ჩვენ გვინდა ხაზი ყველა
ერთ-ერთი, ასე რომ ჩვენ უბრალოდ გამოიყენოთ რუკა აქ.

768
00:37:56,860 --> 00:38:00,250
ჩვენ ვამბობთ, მოდით სია ტოლობის
this.props, ბარათები, რუკაზე.

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

770
00:38:10,580 --> 00:38:15,070
>> ასე რომ, მოცემულ ბარათი, ჩვენ
აპირებს გენერირება სიაში საქონელი

771
00:38:15,070 --> 00:38:17,580
რომ ბარათის შინაარსი მხარეს.

772
00:38:17,580 --> 00:38:20,660
მოდით უბრალოდ, ვამბობთ ჩვენ გვინდა, რომ გარეთ
ბარათები ეჭვქვეშ ასე card.question.

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

774
00:38:24,990 --> 00:38:30,649
ასე რომ, ეს სია შეიცავს
მასივი LI ან სია საკითხი

775
00:38:30,649 --> 00:38:32,440
იქ, სადაც ერთ-ერთი სია
ნივთი ყველა ბარათი,

776
00:38:32,440 --> 00:38:35,150
და რომელიც შეიცავს ბარათები კითხვა.

777
00:38:35,150 --> 00:38:37,640
აზრი?

778
00:38:37,640 --> 00:38:39,450
>> Cool, ახლა მოდით
რეალურად ბეჭდვა რომ.

779
00:38:39,450 --> 00:38:46,521
ასე რომ, ჩვენ დაგიბრუნებთ ul.

780
00:38:46,521 --> 00:38:49,020
Inside რომ უწესრიგო სია,
ჩვენ მხოლოდ გამყარებაში მთელი სია

781
00:38:49,020 --> 00:38:49,890
რომ ისინი მოგვცა.

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

783
00:38:52,851 --> 00:38:53,350
ზემოთ.

784
00:38:53,350 --> 00:38:56,060
>> ყველა უფლება, ასე რომ, ახლა ეს
სია სამუშაოები მხოლოდ იპოვოს.

785
00:38:56,060 --> 00:38:59,842
რაიმე შეკითხვები სია?

786
00:38:59,842 --> 00:39:01,270
თქვენ გაქვთ bunch of ბარათები.

787
00:39:01,270 --> 00:39:02,800
თქვენ მიიღოს სიაში ნივთი ყველა ბარათი.

788
00:39:02,800 --> 00:39:05,466
და დააყენა მათ შიგნით უწესრიგო
სია, და მისცეს მას უკან.

789
00:39:05,466 --> 00:39:09,410
ახლა მოდით იმოქმედოს ისე, ჩვენ ხმა
ეს შიგნით ჩვენი app,

790
00:39:09,410 --> 00:39:14,310
ასე რომ, ჩვენ შეგვიძლია ამის გაკეთება, სია.

791
00:39:14,310 --> 00:39:17,070
რა არგუმენტი ჩვენ გაივლის სია?

792
00:39:17,070 --> 00:39:18,320
რა თვისებები არ ვაძლევთ მას?

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

794
00:39:25,111 --> 00:39:26,860
გახსოვდეთ, თუ მისცეს
ეს bunch of ბარათები,

795
00:39:26,860 --> 00:39:29,590
ის ყველაფერს იმისათვის, რომ სიაში
ნახატის მათთვის ბარათები.

796
00:39:29,590 --> 00:39:32,267
ასე რომ, რა ჩვენ გაივლის
აქ როგორც არგუმენტი?

797
00:39:32,267 --> 00:39:33,350
აუდიტორია: სია ბარათი?

798
00:39:33,350 --> 00:39:37,130
NEEL Mehta: ჰო, ასე ბარათები
უდრის this.props.cards, არა?

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

800
00:39:39,850 --> 00:39:44,370
ასე რომ, ერთადერთი პრობლემა
არის, რომ თქვენ შეგიძლიათ მხოლოდ

801
00:39:44,370 --> 00:39:48,600
აღმოჩნდა ერთი უმაღლესი დონის ელემენტს გაწევა,
ასე რომ თქვენ მოხვდით გადაიტანოთ იგი div.

802
00:39:48,600 --> 00:39:49,100
ეს არის უცნაური.

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

804
00:39:56,190 --> 00:39:57,530
მოდით ვნახოთ, თუ რომ.

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

806
00:40:09,790 --> 00:40:10,560
თუ არა, რომ მუშაობს?

807
00:40:10,560 --> 00:40:29,774

808
00:40:29,774 --> 00:40:31,030
>> Yep, რომ თქვენ გადასვლა.

809
00:40:31,030 --> 00:40:33,700
ასე რომ, ახლა ჩვენ გვაქვს სია
ბარათები ბოლოში,

810
00:40:33,700 --> 00:40:36,180
და მაშინ ჩვენ გვაქვს ჩვენი
CardView თავად თავზე,

811
00:40:36,180 --> 00:40:40,486
და რომელიც flip შორის
ორ მხარეს ბარათი.

812
00:40:40,486 --> 00:40:42,610
ახლა აკეთებს, რომ აზრი როგორ გავაკეთე ეს?

813
00:40:42,610 --> 00:40:45,165

814
00:40:45,165 --> 00:40:46,790
ჰო, ისე, ისევ, ჩვენ გვაქვს ორი კომპონენტი.

815
00:40:46,790 --> 00:40:49,666
პირველი კომპონენტი ანაბეჭდები
out ყველა ბარათი სიაში.

816
00:40:49,666 --> 00:40:50,540
სწორედ სია.

817
00:40:50,540 --> 00:40:54,770
ხოლო მეორე კომპონენტი
ბეჭდავს მხოლოდ, რომ ბარათი.

818
00:40:54,770 --> 00:40:58,840
თუ თქვენ მისცეს მას გარკვეული ბარათი, იგი ყველაფერს
ბეჭდვა ინფორმაციას, რომ ანკეტა

819
00:40:58,840 --> 00:41:01,870
და მოდით თქვენ Flip უკან და მეოთხე.

820
00:41:01,870 --> 00:41:05,850
>> ასე რომ, თუ ჩვენ გვინდა, ჩვენ შეგვიძლია ვცდილობთ და განხილვა
შესახებ და დასძინა, ახალი თვისებები ამ.

821
00:41:05,850 --> 00:41:09,482
წინააღმდეგ შემთხვევაში, ჩვენ შეგვიძლია ვისაუბროთ ცოტა მეტი
დაახლოებით, სიჩქარე reactor,

822
00:41:09,482 --> 00:41:11,190
ან ჩვენ შეგვიძლია პასუხი
კითხვები ალბათ

823
00:41:11,190 --> 00:41:15,050
იმიტომ, რომ ეს არის ყველა ძირითადი ნაწილები
საქართველოს რეაგირება, რომ მე მინდა ვისაუბრო.

824
00:41:15,050 --> 00:41:16,540
ჩვენ შეგვიძლია წავიდეთ წინ.

825
00:41:16,540 --> 00:41:17,590
ჩვენ შეგვიძლია უპასუხოს კითხვებს.

826
00:41:17,590 --> 00:41:18,560
რაც შენ გინდა.

827
00:41:18,560 --> 00:41:21,694

828
00:41:21,694 --> 00:41:24,205
>> აუდიტორია: შეგიძლიათ გამოიყენოთ
JSX ნორმალურ JavaScript?

829
00:41:24,205 --> 00:41:27,150
ან არის, რომ ის, რაც
მოვიდა [INAUDIBLE]?

830
00:41:27,150 --> 00:41:30,760
>> NEEL Mehta კითხვა არის რა
თქვენ იყენებთ JSX ნორმალური JavaScript?

831
00:41:30,760 --> 00:41:32,620
პასუხი არის დიახ.

832
00:41:32,620 --> 00:41:41,070
JSX არის მხოლოდ გზა მას სჭირდება თქვენი
JavaScript, რომელსაც აქვს HTML შიგნით,

833
00:41:41,070 --> 00:41:44,215
და იგი ადგენს შევიდა JavaScript, რომ
არ აქვს HTML შიგნით მას.

834
00:41:44,215 --> 00:41:47,880
ასე რომ, შენიშნავს, რომ ასე რომ შეამჩნია აქ.

835
00:41:47,880 --> 00:41:50,820
ეს ჰგავს თქვენ გაქვთ, როგორიცაა div
და თქვენ გაქვთ პერსონალის შიგნით.

836
00:41:50,820 --> 00:41:54,970
>> რომელიც ადგენს, რომ JavaScript,
ისევე როგორც საერთოდ იგივე.

837
00:41:54,970 --> 00:41:59,590
ვფიქრობ, რა მე ვამბობ, არის ის, რომ
JSX მხოლოდ სინტაქსური, მოსწონს ეს

838
00:41:59,590 --> 00:42:03,530
preprocessor for JavaScript ბევრი
როგორც PHP არის preprocessor HTML.

839
00:42:03,530 --> 00:42:05,490
სს არის preprocessor
for JavaScript, რომელიც საშუალებას

840
00:42:05,490 --> 00:42:12,970
დააყენა HTML შიგნით თქვენი JavaScript.

841
00:42:12,970 --> 00:42:16,425
ასე რომ, თუ თქვენ გაქვთ უფლება სატრანსფორმატორო
რაც რამ მოუწოდა [INAUDIBLE],

842
00:42:16,425 --> 00:42:17,300
რომელიც გარდაქმნის.

843
00:42:17,300 --> 00:42:19,360
უფლება preprocessor,
ეს მოგცემთ ამის გაკეთება.

844
00:42:19,360 --> 00:42:20,235
>> აუდიტორია: [INAUDIBLE]

845
00:42:20,235 --> 00:42:23,026
NEEL Mehta: როგორც წესი, თქვენ არ უნდა
იმისათვის, რომ HTML შიგნით JavaScript

846
00:42:23,026 --> 00:42:24,110
თუ თქვენი აკეთებს რეაგირებას.

847
00:42:24,110 --> 00:42:27,146
მაგრამ თქვენ შეგიძლიათ ამის გაკეთება მაინც.

848
00:42:27,146 --> 00:42:27,645
Yep?

849
00:42:27,645 --> 00:42:29,353
>> აუდიტორია: ვფიქრობ, თქვენ
იყო აღწერილი რეაგირებას

850
00:42:29,353 --> 00:42:31,970
როგორც ფუნქციური programing ენაზე.

851
00:42:31,970 --> 00:42:35,646
ჩვენ უკვე სწავლის C in CS50.

852
00:42:35,646 --> 00:42:38,032
არის C ასევე ფუნქციური ენა?

853
00:42:38,032 --> 00:42:39,990
NEEL Mehta: ასე კითხვა
დაახლოებით ფუნქციური

854
00:42:39,990 --> 00:42:43,010
წინააღმდეგ კიდევ ერთი რამ მოუწოდა
აუცილებელია, ან საპროცესო პროგრამირების.

855
00:42:43,010 --> 00:42:44,820
არსებობს ორი სახის პროგრამების პოპულარული.

856
00:42:44,820 --> 00:42:48,550
ერთ-ერთი ე.წ. საპროცესო, რომელიც
არის ყველაფერი, როგორც აკეთებს ბრძანებები,

857
00:42:48,550 --> 00:42:51,510
და ერთი ფუნქციური, რომელიც ყველა
შესახებ, რომელსაც ფუნქციები და რომელსაც

858
00:42:51,510 --> 00:42:52,930
შემავალი და გამომავალი იმ.

859
00:42:52,930 --> 00:42:55,930
რეაგირებას არის ფუნქციონალური პარადიგმა.

860
00:42:55,930 --> 00:42:58,010
C არის ძალიან საპროცესო პარადიგმა.

861
00:42:58,010 --> 00:43:02,360
>> და, როგორც, მაგალითად, C მაგალითად,
თქვენ არ გააკეთებს დეკლარაციული გზა

862
00:43:02,360 --> 00:43:04,390
მიღების პროგრამის, უფლება?

863
00:43:04,390 --> 00:43:06,826
თქვენ უნდა ვთქვა, ბეჭდვა ეს.

864
00:43:06,826 --> 00:43:07,950
შეცვლა ამ მონაცემების სტრუქტურას.

865
00:43:07,950 --> 00:43:08,530
ბეჭდვა ეს.

866
00:43:08,530 --> 00:43:10,160
ეს ყველაფერი ბრძანებები.

867
00:43:10,160 --> 00:43:12,640
>> In რეაგირებას, იქ არ არის
რომ ბევრი ბრძანებები.

868
00:43:12,640 --> 00:43:15,145
ეს ყველაფერი, რომ
კომპონენტი ერთად.

869
00:43:15,145 --> 00:43:16,300
ისინი მოსწონს ფუნქციები.

870
00:43:16,300 --> 00:43:26,360
თქვენ, როგორც ფუნქცია
მოუწოდა CardView,

871
00:43:26,360 --> 00:43:28,680
რომელიც არის ფუნქცია
რომ აქვს შემავალი, გამომავალი,

872
00:43:28,680 --> 00:43:30,660
და ასე რეაგირებას ყველა
ამ ფილოსოფია

873
00:43:30,660 --> 00:43:32,700
ჩვენთვის having-- თქვენ გაქვთ მონაცემები.

874
00:43:32,700 --> 00:43:34,910
თქვენ გაივლის მას ამ
ალგორითმი, და ეს თქვენ

875
00:43:34,910 --> 00:43:36,800
გამომავალი HTML, რომ თქვენ
ნაბეჭდი გვერდი,

876
00:43:36,800 --> 00:43:39,180
და ასე რომ თქვენ უნდა
ავაშენოთ ეს ნაჭერი.

877
00:43:39,180 --> 00:43:42,800
>> ასე რომ, მიაპყროს მეტაფორა რა
ვთქვი, თქვენ იცით, თუ როგორ

878
00:43:42,800 --> 00:43:47,050
on Facebook თუ თქვენ გაგზავნა,
და თქვენ რა ნაწილები განახლება,

879
00:43:47,050 --> 00:43:47,882
რომ არის პროცედურული.

880
00:43:47,882 --> 00:43:48,840
ეს აუცილებელია, არა?

881
00:43:48,840 --> 00:43:49,806
OK, მე მივიღე გაგზავნა.

882
00:43:49,806 --> 00:43:50,930
მოდით შეცვალოს ანგარიშის არსებობს.

883
00:43:50,930 --> 00:43:52,110
>> მოდით პოპ window აქ.

884
00:43:52,110 --> 00:43:52,780
მოდით შეცვალოს ანგარიშის არსებობს.

885
00:43:52,780 --> 00:43:53,700
მოდით დავხატოთ ამ აქ.

886
00:43:53,700 --> 00:43:55,220
სწორედ პროცედურული მიდგომა.

887
00:43:55,220 --> 00:44:00,240
>> ეს არის ის, რაც რამ, როგორიცაა კუთხის,
Boost, ხერხემალი, სხვა ფარგლებში გამოიყენოს.

888
00:44:00,240 --> 00:44:01,200
რეაგირებას ფუნქციური.

889
00:44:01,200 --> 00:44:03,324
ეს არის ძალიან განსხვავებული გზა
ფიქრი რამ.

890
00:44:03,324 --> 00:44:07,950
იგი იღებს ამ იდეის მოდით
ფუნქციები და ალგორითმები, რომ თქვენ

891
00:44:07,950 --> 00:44:08,800
მისცეს მას მონაცემები.

892
00:44:08,800 --> 00:44:11,820
ეს თქვენ შამფურზე ის, რაც
უნდა იყოს, და კომპიუტერი

893
00:44:11,820 --> 00:44:13,490
იზრუნებს მასით out.

894
00:44:13,490 --> 00:44:15,890
თქვენ არ ერევა საკუთარ თავს.

895
00:44:15,890 --> 00:44:18,470
არა, რომ ცოტა აზრი?

896
00:44:18,470 --> 00:44:18,970
ჰო?

897
00:44:18,970 --> 00:44:24,180
>> აუდიტორია: ფუნქციური ენა,
ყველაფერი ხდება ერთდროულად?

898
00:44:24,180 --> 00:44:26,800
>> NEEL Mehta: არა, რამ მოხდეს, რათა.

899
00:44:26,800 --> 00:44:29,320
ისევე როგორც აქ, რომ ჯერ კიდევ
იმისათვის, მაგრამ ეს არ

900
00:44:29,320 --> 00:44:32,390
მოხდეს, რათა მოსწონს
მივესალმებით, ბრძანება, ბრძანება.

901
00:44:32,390 --> 00:44:36,459
ეს ხდება იმ მიზნით,
ფუნქცია გაძლევთ გამომავალი.

902
00:44:36,459 --> 00:44:37,750
იმისათვის, რომ კიდევ ერთი ფუნქცია.

903
00:44:37,750 --> 00:44:39,550
იმისათვის, რომ სხვა
ფუნქცია, სხვა ფუნქცია.

904
00:44:39,550 --> 00:44:41,470
>> თუ თქვენ CS51, თქვენ
ვისწავლოთ ფუნქციური პროგრამები

905
00:44:41,470 --> 00:44:42,886
ცოტა გარეთ ფარგლებში ამ.

906
00:44:42,886 --> 00:44:45,090
მაგრამ, ძირითადად, რაც
რეაგირებას მაგარი არ არის მხოლოდ

907
00:44:45,090 --> 00:44:46,840
ერთი გზა მონაცემების ნაკადი
და ვირტუალური Dom,

908
00:44:46,840 --> 00:44:48,700
არამედ ეს იდეა
ფუნქციური პროგრამირების.

909
00:44:48,700 --> 00:44:51,720
და ფუნქციური პროგრამირების ძალიან მარტივია
შესაქმნელად და მიიღოს cool პერსონალის გარეთ,

910
00:44:51,720 --> 00:44:53,844
და ეს ძალიან ადვილია, რომ ვიფიქროთ
შესახებ და მიზეზი შესახებ.

911
00:44:53,844 --> 00:44:55,450
ასე რომ, ეს არის კიდევ ერთი კარგი გათამაშება რეაგირებას.

912
00:44:55,450 --> 00:44:58,489

913
00:44:58,489 --> 00:44:59,280
ნებისმიერი უფრო მეტი შეკითხვა?

914
00:44:59,280 --> 00:45:02,650

915
00:45:02,650 --> 00:45:03,150
ჰო?

916
00:45:03,150 --> 00:45:06,840
>> აუდიტორია: Um, რატომ
გამოყენება მიადევნე განსხვავებით var?

917
00:45:06,840 --> 00:45:10,450
>> NEEL Mehta: ასე რომ, კითხვა
რატომ გამოვიყენოთ მიადევნე ნაცვლად var?

918
00:45:10,450 --> 00:45:13,220
ეს არის ის, რაც ე.წ.
ES6 ან ECMAScript 6.

919
00:45:13,220 --> 00:45:15,820
ეს არის ახალი ვერსია JavaScript.

920
00:45:15,820 --> 00:45:19,050
აქ არის რამოდენიმე ტექნიკური მიზეზების გამო,
მაგრამ, მოდით, არის უკეთესი ვერსია var.

921
00:45:19,050 --> 00:45:20,724
>> ეს არის, თუ როგორ აცხადებენ ცვლადი.

922
00:45:20,724 --> 00:45:21,390
თქვენ შეგიძლიათ გამოიყენოთ ნება.

923
00:45:21,390 --> 00:45:22,140
თქვენ შეგიძლიათ გამოიყენოთ var.

924
00:45:22,140 --> 00:45:23,825
მოდით აქვს რამოდენიმე ტექნიკური
reasons-- შეგიძლიათ შევხედოთ მათ

925
00:45:23,825 --> 00:45:25,610
up later-- რატომ ეს უკეთესი.

926
00:45:25,610 --> 00:45:28,780
ძირითადად, ES6 აქვს ლამაზი
ახალი სინტაქსი, ახალი თვისებები

927
00:45:28,780 --> 00:45:30,720
თავზე ძველი JavaScript.

928
00:45:30,720 --> 00:45:32,782
>> ასე რომ, ჩვენ, როგორც ხუთი წუთის განმავლობაში.

929
00:45:32,782 --> 00:45:34,990
მე უბრალოდ მინდოდა ლაპარაკი
კიდევ ერთი რამ რეალური სწრაფად.

930
00:45:34,990 --> 00:45:36,450
თუ რაიმე კითხვები,
მოდით ვისაუბროთ მას შემდეგ, რაც ეს.

931
00:45:36,450 --> 00:45:38,366
მაგრამ ასე რომ ამ იღებს
დაიჭირეს წლის კამერა, უბრალოდ

932
00:45:38,366 --> 00:45:41,550
მინდა გაიგო ცოტა შესახებ, თუ როგორ
რეალურად გამოიყენოს რეაგირებას თქვენს ნაკადი.

933
00:45:41,550 --> 00:45:47,220

934
00:45:47,220 --> 00:45:58,640
>> თუ თქვენ აქ,
Facebook.GitHub.IO/react,

935
00:45:58,640 --> 00:46:03,320
ეს არის მთავარი გვერდი რეაგირებას და
ის ყველაფერს გაჩვენებთ, თუ როგორ რეალურად გამოიყენოს

936
00:46:03,320 --> 00:46:05,320
რეაგირებას თქვენს გვერდებზე.

937
00:46:05,320 --> 00:46:08,845
ძირითადად, ეს არის პატარა
რთული ცდილობს დააყენოთ რეაგირებას.

938
00:46:08,845 --> 00:46:12,300
ეს არ არის მარტივი როგორც უბრალოდ გადაიტანეთ
ჩამოაგდეს JavaScript არსებობს.

939
00:46:12,300 --> 00:46:15,890
>> თქვენ უნდა ჰქონდეს თქვენს სატრანსფორმატორო
შეიქმნა, რომელიც, როგორც ეს ადრე,

940
00:46:15,890 --> 00:46:18,120
აქციოს თქვენი JSX შევიდა
ნორმალური JavaScript.

941
00:46:18,120 --> 00:46:21,030
თქვენ უნდა რამ, რომ ყველაფერს
შედგენა თქვენ ES6 ნორმალური.

942
00:46:21,030 --> 00:46:24,720
JavaScript არსებობს ბევრი მოძრავი
ნაწილები თქვენ უნდა გავაკეთოთ, ასე რომ, რაც

943
00:46:24,720 --> 00:46:27,200
მოუწოდა Yeoman, Yeoman.io.

944
00:46:27,200 --> 00:46:31,110
და ეს არის ბრძანების ინსტრუმენტი, რომელიც ყველაფერს
დაგეხმარებათ დასაყრდენი თქვენი რეაგირებას

945
00:46:31,110 --> 00:46:32,380
პროექტები მარტივად.

946
00:46:32,380 --> 00:46:38,660
>> ასე რომ თქვენ შეგიძლიათ წაიკითხოთ ამ
მოგვიანებით, მაგრამ არსებობს გარკვეული ინსტრუმენტები

947
00:46:38,660 --> 00:46:40,160
რომ Yeoman სთავაზობს.

948
00:46:40,160 --> 00:46:43,280
ისინი ყველაფერს მოგცემთ შექმნათ რეაგირებას
app ყველაფერი აგებული.

949
00:46:43,280 --> 00:46:46,030
ისევე, როგორც ეს თქვენ არ აშენდა
ამ კომპონენტების აშენდა.

950
00:46:46,030 --> 00:46:47,880
ეს უნდა თქვენი სატრანსფორმატორო აშენდა.

951
00:46:47,880 --> 00:46:50,699
მათ აქვთ ბევრი მაგარი
პერსონალის აშენდა ავტომატურად

952
00:46:50,699 --> 00:46:52,240
გამოყენებით ამ რამ მოუწოდა გენერატორები.

953
00:46:52,240 --> 00:46:54,620
>> ასე რომ, წაკითხვის შესახებ, თუ გნებავთ.

954
00:46:54,620 --> 00:46:59,110
უბრალოდ წასვლა Yeoman, Y-E-O-M-A-N და
იპოვნით გენერატორების მოსწონს ეს.

955
00:46:59,110 --> 00:47:01,263
და გენერატორების მოსწონს
ეს, უბრალოდ, როგორც ერთი

956
00:47:01,263 --> 00:47:03,010
არის რამდენიმე ბრძანების ბრძანებები.

957
00:47:03,010 --> 00:47:05,530
ეს თქვენ დასაყრდენი გარეთ
მთელი რეაგირებას ოთახი თქვენთვის.

958
00:47:05,530 --> 00:47:10,470
ეს მიიღებთ ყველა სახელმძღვანელო piping,
და grunt მუშაობა კეთდება თქვენთვის,

959
00:47:10,470 --> 00:47:13,010
და ამიტომ უბრალოდ ფოკუსირება
უბრალოდ წერა რეაგირებას.

960
00:47:13,010 --> 00:47:16,739
>> ასე რომ, ძირითადად აშენებენ
რეაგირებას app არის nontrivial.

961
00:47:16,739 --> 00:47:19,530
ეს სახაზო ყველა ერთად, მაგრამ არსებობს
არის ინსტრუმენტი, რომელიც ამას თქვენთვის.

962
00:47:19,530 --> 00:47:23,070
ასე რომ, თუ გსურთ, რათა რეაგირებას
app, ცდილობენ აკეთებს, რომ გზა.

963
00:47:23,070 --> 00:47:26,360
თუ გსურთ, რომ ექსპერიმენტი,
შეგიძლიათ ცდილობენ გამოყენებით ამ CodePen

964
00:47:26,360 --> 00:47:28,550
იმიტომ, რომ ეს CodePen აქვს
ყველა რეაგირება გაყვანილობა.

965
00:47:28,550 --> 00:47:30,240
მე ვაკეთებ ყველა სამუშაოები თქვენ უკვე.

966
00:47:30,240 --> 00:47:34,610
>> ასე რომ, თუ გსურთ, რომ, როგორც
წარმოების გათავისუფლების ფაქტზე რეაგირებას app,

967
00:47:34,610 --> 00:47:37,220
სცადეთ ერთი ამ გენერატორების.

968
00:47:37,220 --> 00:47:40,240
თუ თქვენ უბრალოდ უნდა ითამაშოს
გარშემო, ის ხშირად ღირს მხოლოდ

969
00:47:40,240 --> 00:47:44,490
მოსწონს ცდილობენ თამაშობენ გარშემო CodePen აქ.

970
00:47:44,490 --> 00:47:45,470
გასწავლოთ კარგი?

971
00:47:45,470 --> 00:47:45,970
ზემოთ.

972
00:47:45,970 --> 00:47:47,890
>> ასე რომ, ყველა მაქვს.

973
00:47:47,890 --> 00:47:52,470
ისევ და ისევ, ყველა კოდი და მაგალითები
იქნება ამ საიტზე აქ.

974
00:47:52,470 --> 00:47:55,509
ასე რომ, კიდევ ერთხელ, ჩვენ ვერ გაიგო
გაცილებით სინტაქსის რეაგირებას,

975
00:47:55,509 --> 00:47:57,550
არამედ ყველა იმ
ცოტა სინტაქსური დეტალები,

976
00:47:57,550 --> 00:48:00,320
ეს ყველაფერი იქნება შესაძლებელი
ამ საიტზე აქ.

977
00:48:00,320 --> 00:48:02,660
>> ასე რომ, მე რეკომენდაციას მოსწონს
პირველი ნაბიჯი.

978
00:48:02,660 --> 00:48:06,277
განათავსეთ იგი თქვენს CodePen.

979
00:48:06,277 --> 00:48:08,110
სცადეთ მუშაობა მიღების
მას მეორე ნაბიჯი.

980
00:48:08,110 --> 00:48:11,310
აქ არის მეოთხე ნაბიჯი, და მხოლოდ
ვხედავ, სადაც თქვენ, რომ.

981
00:48:11,310 --> 00:48:14,840
>> ნებისმიერი უფრო მეტი შეკითხვა, შეამოწმეთ
რომ გვერდზე ან მომაწოდეთ.

982
00:48:14,840 --> 00:48:16,490
ეს არის ჩემი ელ.

983
00:48:16,490 --> 00:48:19,885
მაგრამ მე მიყვარს დაგეხმაროთ ნებისმიერი
კითხვები ალბათ დაახლოებით რეაგირებას.

984
00:48:19,885 --> 00:48:21,010
ასე რომ, yep, რომ ყველა მაქვს.

985
00:48:21,010 --> 00:48:23,410
დიდი მადლობა ყველა ძალიან ბევრი
თვალს ან ესწრება.

986
00:48:23,410 --> 00:48:26,820
მე კი რაიმე შეკითხვები
ალბათ მას შემდეგ, რაც ეს ახლა.

987
00:48:26,820 --> 00:48:29,140
ასე რომ, მადლობა ყველა თვალს.

988
00:48:29,140 --> 00:48:31,270