در این مطلب، ویدئو HTMX + Flask: برنامه های وب مدرن پایتون، جاوا اسکریپت را نگه دارید – مایکل کندی با زیرنویس فارسی را برای دانلود قرار داده ام. شما میتوانید با پرداخت 15 هزار تومان ، این ویدیو به علاوه تمامی فیلم های سایت را دانلود کنید.اکثر فیلم های سایت به زبان انگلیسی می باشند. این ویدئو دارای زیرنویس فارسی ترجمه شده توسط هوش مصنوعی می باشد که میتوانید نمونه ای از آن را در قسمت پایانی این مطلب مشاهده کنید.
مدت زمان فیلم: 00:25:31
تصاویر این ویدئو:
قسمتی از زیرنویس این فیلم:
00:00:00,480 –> 00:00:01,839
سلام
2
00:00:01,839 –> 00:00:03,840
من مایکل کندی هستم و
3
00:00:03,840 –> 00:00:05,839
بسیار هیجان زده هستم که این ارائه را
4
00:00:05,839 –> 00:00:10,320
برای شما اینجا در flaskcon 2021 انجام
5
00:00:10,320 –> 00:00:13,200
می دهم. می خواهم در مورد این چارچوب جاوا اسکریپت با شما صحبت کنم که به
6
00:00:13,200 –> 00:00:15,679
ما امکان می دهد
7
00:00:15,679 –> 00:00:17,520
اساساً از نوشتن جاوا اسکریپت خودداری کنیم. این
8
00:00:17,520 –> 00:00:19,439
یک چیز بسیار جالب است که می توان فکر کرد
9
00:00:19,439 –> 00:00:20,720
ممکن است آخرین
10
00:00:20,720 –> 00:00:23,279
بیت جاوا اسکریپت باشد که باید با
11
00:00:23,279 –> 00:00:25,599
آن سر و کار داشته باشید و به ما این امکان را می دهد که فقط روی
12
00:00:25,599 –> 00:00:28,640
نوشتن کد در پایتون و فلاسک تمرکز کنیم و
13
00:00:28,640 –> 00:00:31,519
این فریم ورک htmx نامیده می شود
14
00:00:31,519 –> 00:00:33,440
و هیجان زیادی در اطراف آن وجود دارد و بعد از آن.
15
00:00:33,440 –> 00:00:34,960
شما این صحبت را می بینید، اکنون خواهید دید
16
00:00:34,960 –> 00:00:38,399
که کاملاً موجه است،
17
00:00:38,399 –> 00:00:40,239
یکی از سؤالاتی که مطمئن هستید
18
00:00:40,239 –> 00:00:42,160
این است که آیا می توانم کد را دریافت کنم زیرا
19
00:00:42,160 –> 00:00:43,680
این یک برنامه نسبتاً پیچیده است که ما
20
00:00:43,680 –> 00:00:45,920
یک ویژگی را به چیزی اضافه می کنیم نه
21
00:00:45,920 –> 00:00:48,399
کاملاً از ابتدا می توانید تایپ کنید
22
00:00:48,399 –> 00:00:50,000
و بله می توانید کد را دریافت کنید فقط کافی است به
23
00:00:50,000 –> 00:00:52,680
talkpython.fm
24
00:00:52,680 –> 00:00:55,120
flaskcon2021 مراجعه کنید و شما را به
25
00:00:55,120 –> 00:00:58,320
مخزن github می برد، جایی که کدی
26
00:00:58,320 –> 00:01:01,280
را شنیده اید که در مورد میانگین پشته mongo
27
00:01:01,280 –> 00:01:03,600
express angular و node حتماً شنیده اید. ve
28
00:01:03,600 –> 00:01:06,960
از پشته لامپ لینوکس apache
29
00:01:06,960 –> 00:01:09,600
mysql و php
30
00:01:09,600 –> 00:01:12,880
شنیده اید آیا در مورد پشته Howell htmx شنیده اید
31
00:01:12,880 –> 00:01:15,680
که ما را با این ایده انعطاف پذیری خوب آشنا می
32
00:01:15,680 –> 00:01:17,439
33
00:01:17,439 –> 00:01:20,640
کند. پشته خانه به هر
34
00:01:20,640 –> 00:01:23,439
زبان یا فریم ورکی که می خواهید فرامتن است،
35
00:01:23,439 –> 00:01:25,200
بنابراین این فریم ورک های دیگر می گویند که
36
00:01:25,200 –> 00:01:27,200
باید از این موارد مختلف استفاده کنید.
37
00:01:27,200 –> 00:01:28,320
فنآوریها برای
38
00:01:28,320 –> 00:01:29,920
ساختن برنامه وب خود و نکته جالب
39
00:01:29,920 –> 00:01:32,720
در مورد htmx این است که میگوید ما به
40
00:01:32,720 –> 00:01:35,600
شما امکان میدهیم در هر چارچوبی
41
00:01:35,600 –> 00:01:36,720
که دوست
42
00:01:36,720 –> 00:01:40,240
دارید بمانید، بنابراین اگر پایتون و فلاسک را دوست دارید در فلاسک بمانید
43
00:01:40,240 –> 00:01:41,280
44
00:01:41,280 –> 00:01:43,040
، از طرف دیگر اگر یک از طرفداران بزرگ
45
00:01:43,040 –> 00:01:45,600
php میتوانید در php بمانید
46
00:01:45,600 –> 00:01:47,920
و در حالی که به نظر میرسد به این معناست که
47
00:01:47,920 –> 00:01:50,560
اگر واقعاً عاشق node هستید و
48
00:01:50,560 –> 00:01:53,040
در سرور بیان میکنید، میتوانید
49
00:01:53,040 –> 00:01:54,640
در node در express بمانید،
50
00:01:54,640 –> 00:01:56,240
بنابراین ایده این است که شما مجبور نباشید
51
00:01:56,240 –> 00:01:58,640
سوئیچ متنی را تغییر دهید. بعضی اوقات من در حال
52
00:01:58,640 –> 00:02:00,159
نوشتن کد برای قسمت جلویی در
53
00:02:00,159 –> 00:02:01,439
جاوا اسکریپت
54
00:02:01,439 –> 00:02:03,439
هستم و در بعضی مواقع در حال نوشتن کد به زبان دیگری
55
00:02:03,439 –> 00:02:06,000
در سروری هستم که شما همیشه
56
00:02:06,000 –> 00:02:07,920
در سرور هستید، بسیار عالی خواهد بود.
57
00:02:07,920 –> 00:02:09,758
58
00:02:09,758 –> 00:02:12,080
این قرار است اتفاق می افتد اما
59
00:02:12,080 –> 00:02:14,239
اگر آن را ندیده باشید بسیار زیبا است، بنابراین اگر
60
00:02:14,239 –> 00:02:17,680
در مورد htmx چیزی نشنیده اید، این یک کتابخانه است،
61
00:02:17,680 –> 00:02:20,000
یک کتابخانه جاوا اسکریپت که در
62
00:02:20,000 –> 00:02:22,239
برنامه وب خود و قسمت جلوی
63
00:02:22,239 –> 00:02:24,239
آن قرار می دهید و کاری که انجام می
64
00:02:24,239 –> 00:02:26,239
دهد این است که عملکرد جدیدی را اضافه می کند که صادقانه بگوییم
65
00:02:26,239 –> 00:02:28,160
باید همیشه در html بود،
66
00:02:28,160 –> 00:02:29,360
67
00:02:29,360 –> 00:02:30,720
بنابراین می توانید دقیقاً در اینجا زیر
68
00:02:30,720 –> 00:02:32,319
بخش انگیزه مشاهده کنید، سؤالاتی می پرسد
69
00:02:32,319 –> 00:02:35,200
مانند اینکه چرا باید a و
70
00:02:35,200 –> 00:02:36,800
فرم تنها چیزی باشد که می تواند
71
00:02:36,800 –> 00:02:38,720
درخواست های http را
72
00:02:38,720 –> 00:02:40,480
ایجاد کند. یک
73
00:02:40,480 –> 00:02:42,560
درخواست http یا بگویید یک تصویر
74
00:02:42,560 –> 00:02:45,680
مطمئناً با htmx، چرا باید کلیک کنید
75
00:02:45,680 –> 00:02:47,120
و ارسال کنید تنها رویدادهایی باشد که
76
00:02:47,120 –> 00:02:48,640
آنها را تحریک می کند.
77
00:02:48,640 –> 00:02:51,519
78
00:02:51,519 –> 00:02:52,800
79
00:02:52,800 –> 00:02:54,560
80
00:02:54,560 –> 00:02:55,840
81
00:02:55,840 –> 00:02:57,680
در وهله اول باید در html می بود و این
82
00:02:57,680 –> 00:02:59,840
همان چیزی است که htmx به ما اجازه می دهد تا
83
00:02:59,840 –> 00:03:00,959
84
00:03:00,959 –> 00:03:04,879
ویژگی های html را به html موجود خود
85
00:03:04,879 –> 00:03:08,000
اضافه کنیم و سپس این تعامل اضافی
86
00:03:08,000 –> 00:03:09,280
را به شما درک کنید که این تفاوت چگونه
87
00:03:09,280 –> 00:03:12,000
است. و من پیامی را در توییتر ارسال کردم که می گفت:
88
00:03:12,000 –> 00:03:13,760
سلام، من واقعاً در مورد این فلاسک
89
00:03:13,760 –> 00:03:15,920
به علاوه بحث
90
00:03:15,920 –> 00:03:17,440
htmlx هیجان زده هستم، یکی به من پاسخ داد و گفت اوه
91
00:03:17,440 –> 00:03:19,200
این فوق العاده است، من همچنین از اینکه
92
00:03:19,200 –> 00:03:22,080
flask و htmx خارج از
93
00:03:22,080 –> 00:03:24,720
html تمیزتر و مستقیم تر از ajax
94
00:03:24,720 –> 00:03:26,799
هستند هیجان زده هستم. جاوا اسکریپت واقعا چیز دیگری وجود دارد که
95
00:03:26,799 –> 00:03:28,799
من به دست میآورم
96
00:03:28,799 –> 00:03:29,760
بله
97
00:03:29,760 –> 00:03:30,959
، چیزهای زیادی وجود دارد
98
00:03:30,959 –> 00:03:33,200
و من گفتم چیزی که شما دریافت میکنید این است که شما به
99
00:03:33,200 –> 00:03:35,599
کدهای سمت سرور دسترسی کامل دارید، درست همانطور که
100
00:03:35,599 –> 00:03:37,040
توضیح دادم به جای نوشتن چیزهایی در
101
00:03:37,040 –> 00:03:38,319
قسمت
102
00:03:38,319 –> 00:03:39,599
جلویی چیزهایی که تعاملی هستند،
103
00:03:39,599 –> 00:03:42,319
همچنان آنها را روی آن مینویسید. سرور و سپس
104
00:03:42,319 –> 00:03:44,080
آنها برمی گردند، آنها فقط به عنوان قطعات کوچک html پایین می آیند.
105
00:03:44,080 –> 00:03:46,640
این شخصی
106
00:03:46,640 –> 00:03:48,159
که در توییتر با او صحبت می کردم،
107
00:03:48,159 –> 00:03:49,920
گفت این چیزی نیست که من اینجا انجام می دهم، مثلا
108
00:03:49,920 –> 00:03:51,360
به این اسکریپت نگاه کنید، من این
109
00:03:51,360 –> 00:03:53,599
جاوا اسکریپت را نوشتم که می گوید اگر
110
00:03:53,599 –> 00:03:56,959
انجام می دهید یک کلید در ورودی فرم جستجو، من
111
00:03:56,959 –> 00:03:58,640
می خواهم یک درخواست ajax انجام دهم و
112
00:03:58,640 –> 00:04:00,480
جایی در اینجا همانجا را ببینید،
113
00:04:00,480 –> 00:04:01,840
من می خواهم پاسخ را از
114
00:04:01,840 –> 00:04:04,879
سرور بگیرم و فقط html را در صفحه قرار
115
00:04:04,879 –> 00:04:05,599
116
00:04:05,599 –> 00:04:08,000
دهم، پس چرا به این چیز htmx نیاز دارم به این کار را انجام دهید
117
00:04:08,000 –> 00:04:11,360
چگونه در htmlx به نظر می رسد بیایید ببینیم
118
00:04:11,360 –> 00:04:13,360
آه بله، در پایین پایین، این
119
00:04:13,360 –> 00:04:16,238
یکسان نیست نه نه واقعاً به
120
00:04:16,238 –> 00:04:18,880
جای همه این جاوا اسکریپت که با آن
121
00:04:18,880 –> 00:04:21,440
کد است، ما فقط ورودی
122
00:04:21,440 –> 00:04:23,680
hx را می نویسیم.
123
00:04:23,680 –> 00:04:26,000
پیشنهادات اسلش و
124
00:04:26,000 –> 00:04:29,280
هدف مکانی برای پیشنهادات
125
00:04:29,280 –> 00:04:31,520
کد فوق العاده تمیز است، بنابراین به جای
126
00:04:31,520 –> 00:04:33,360
نوشتن موارد در کادر سفید،
127
00:04:33,360 –> 00:04:34,639
بیایید موارد را در کادر خاکستری بنویسیم و این
128
00:04:34,639 –> 00:04:36,720
کار را با htmlx در طول این
129
00:04:36,720 –> 00:04:38,800
گفتگو انجام خواهیم داد، بنابراین بهترین راه برای درک نحوه عملکرد
130
00:04:38,800 –> 00:04:41,759
htmx برای دیدن آن در عمل
131
00:04:41,759 –> 00:04:43,520
دیدن چند نمونه است،
132
00:04:43,520 –> 00:04:45,680
بنابراین بیایید به اینجا برویم و به htmx.org برویم
133
00:04:45,680 –> 00:04:48,000
134
00:04:48,000 –> 00:04:50,240
و نمونه ها را مشاهده کنیم و یک راه واقعی خوب
135
00:04:50,240 –> 00:04:51,680
برای یادگیری این است که تمام این
136
00:04:51,680 –> 00:04:54,000
مثال های مختلف را مرور کنیم، اما اجازه دهید فقط
137
00:04:54,000 –> 00:04:57,280
اینجا را بررسی کنید، بیایید برای ویرایش کلیک کنیم،
138
00:04:57,280 –> 00:04:58,800
بنابراین
139
00:04:58,800 –> 00:05:01,440
کدی که با آن شروع می کنیم این است که با
140
00:05:01,440 –> 00:05:03,600
آن شروع می کنیم که یک برچسب وجود دارد که
141
00:05:03,600 –> 00:05:06,880
مقداری مقدار دارد یک نام مقداری مقدار
142
00:05:06,880 –> 00:05:09,440
ایمیل مقداری مقدار دارد و سپس دکمه ای که
143
00:05:09,440 –> 00:05:12,320
می توانید برای ویرایش کلیک کنید، بنابراین اینجا را به پایین نگاه کنید. مثل
144
00:05:12,320 –> 00:05:13,520
این
145
00:05:13,520 –> 00:05:15,840
حالا به یاد داشته باشید هیچ جاوا
146
00:05:15,840 –> 00:05:18,560
اسکریپتی به جز htmx وجود ندارد که با
147
00:05:18,560 –> 00:05:20,160
آن نوع ویژگی چیزهایی که
148
00:05:20,160 –> 00:05:22,639
قبلاً دیدهاید در تعامل است،
149
00:05:23,199 –> 00:05:25,440
بنابراین اگر برای ویرایش کلیک کنم، متوجه میشوید که
150
00:05:25,440 –> 00:05:28,320
فقط به صورت درون خطی به یک فرم قابل ویرایش تغییر میکند
151
00:05:28,320 –> 00:05:29,840
و شما میتوانید لغو کلیک کنید برای ویرایش کلیک کنید اجازه دهید این را
152
00:05:29,840 –> 00:05:33,520
صدا کنیم اوه این کار میشود. مایکل بودن
153
00:05:36,639 –> 00:05:37,680
در آنجا و فرض کنید میخواهیم
154
00:05:37,680 –> 00:05:40,080
آن را به آن تغییر دهیم که من save boom را
155
00:05:40,080 –> 00:05:41,440
بزنم، به همان حالت برمیگردد،
156
00:05:41,440 –> 00:05:42,320
پس
157
00:05:42,320 –> 00:05:44,560
چگونه بدون رفرش کردن
158
00:05:44,560 –> 00:05:47,520
صفحه بدون جاوا اسکریپت کار کرد، خوب این مورد
159
00:05:47,520 –> 00:05:48,800
را در پایین این چیز خاکستری کوچک بررسی
160
00:05:48,800 –> 00:05:50,240
کنید، میتوانید این را نشان دهید
161
00:05:50,240 –> 00:05:52,639
نوار ابزار تعامل در اینجا به
162
00:05:52,639 –> 00:05:54,240
حالت اولیه می رویم و دیدیم که
163
00:05:54,240 –> 00:05:55,840
این
164
00:05:55,840 –> 00:05:57,600
مجموعه از div ها را در اینجا داریم و یک دکمه داریم
165
00:05:57,600 –> 00:05:58,800
که می گوید وقتی با دکمه تعامل می
166
00:05:58,800 –> 00:06:01,600
کنید وقتی روی آن کلیک می کنید به یک hx بروید
167
00:06:01,600 –> 00:06:03,520
در مقابل آن
168
00:06:03,520 –> 00:06:05,600
و سپس بالای هدف
169
00:06:05,600 –> 00:06:07,360
این div بیرونی خواهد بود و کاری که ما می
170
00:06:07,360 –> 00:06:08,479
خواهیم انجام دهیم این است که آن را با
171
00:06:08,479 –> 00:06:10,319
هر چیزی که از اینجا برمی گردد عوض می کنیم، خوب آن چیزی که
172
00:06:10,319 –> 00:06:11,840
برگشت
173
00:06:11,840 –> 00:06:14,639
ما یک فرم گرفتیم اینجا یک فرم است که یک div دارد
174
00:06:14,639 –> 00:06:17,919
حالا یک ورودی با نام جو
175
00:06:17,919 –> 00:06:20,400
و واردات با نام زیر و
176
00:06:20,400 –> 00:06:23,680
غیره و به همین ترتیب رفتارهای hx دارد،
177
00:06:23,680 –> 00:06:26,400
ما برخی از ویرایشهای دیگر را در اینجا انجام میدهیم، یکی از
178
00:06:26,400 –> 00:06:28,240
این موارد را ارسال کردیم،
179
00:06:28,240 –> 00:06:30,160
میرویم در حال بازگردانی به آن
180
00:06:30,160 –> 00:06:31,840
مکان در اینجا مقادیر و سپس
181
00:06:31,840 –> 00:06:33,919
در نهایت پاسخی است که ما به عقب برمی گردیم
182
00:06:33,919 –> 00:06:36,960
این مجموعه جدیدی از داده ها است که ثابت است،
183
00:06:36,960 –> 00:06:37,680
بنابراین
184
00:06:37,680 –> 00:06:40,319
این محرک ها، این محرک های مختلف
185
00:06:40,319 –> 00:06:43,199
ویژگی ها و مقادیر کنترل
186
00:06:43,199 –> 00:06:44,720
تنها چیزی است که باید قرار دهیم، هیچ
187
00:06:44,720 –> 00:06:46,800
جاوا اسکریپتی برای انجام هر یک از این موارد وجود ندارد، ما
188
00:06:46,800 –> 00:06:48,319
فقط این رفتارهای تعاملی کوچک را می نویسیم
189
00:06:48,319 –> 00:06:49,599
190
00:06:49,599 –> 00:06:51,919
که سرور آن ها را می بیند. پیامها را ارسال میکند
191
00:06:51,919 –> 00:06:54,160
و هر کاری را که قرار است انجام دهد انجام میدهد،
192
00:06:54,160 –> 00:06:56,240
بنابراین به این صورت است که شما این تعامل جالب را دریافت میکنید
193
00:06:56,240 –> 00:06:57,759
و چگونه در
194
00:06:57,759 –> 00:06:59,919
سرور میمانید درست زمانی که این را پس گرفتیم،
195
00:06:59,919 –> 00:07:02,319
این فقط با نوعی درخواست یا پاسخ در سرور ایجاد شده است،
196
00:07:02,319 –> 00:07:04,960
197
00:07:04,960 –> 00:07:06,400
بنابراین ما میخواهیم قادر به انجام این کار در
198
00:07:06,400 –> 00:07:08,560
فلاسک بدون بازگشت به نوشتن
199
00:07:08,560 –> 00:07:11,440
کد در سمت کلاینت
200
00:07:11,440 –> 00:07:13,039
هستیم، ما یک ویژگی به این چیز اضافه می
201
00:07:13,039 –> 00:07:14,639
کنیم که جمع آوری کننده ویدیو را صدا می زنم، ما
202
00:07:14,639 –> 00:07:16,880
این برنامه را در یک لحظه
203
00:07:16,880 –> 00:07:18,560
می بینیم و شما خواهید دید چگونه e asy این است که
204
00:07:18,560 –> 00:07:20,479
این ویژگی را اضافه کنم، در حال حاضر این
205
00:07:20,479 –> 00:07:21,840
صفحه جستجو را دارد و ایده این است که شما
206
00:07:21,840 –> 00:07:23,199
مجموعه ای از ویدیوها را جمع
207
00:07:23,199 –> 00:07:25,280
آوری کنید مانند یوتیوب و
208
00:07:25,280 –> 00:07:26,880
بگویید من به همه این ویدیوها علاقه
209
00:07:26,880 –> 00:07:28,160
مند هستم می خواهم آنها را در حساب خود ذخیره کنم یا
210
00:07:28,160 –> 00:07:29,440
چیزی شبیه به آن
211
00:07:29,440 –> 00:07:31,039
و در اینجا می توانید ببینید که من می توانم ویدیوها را جستجو کنم
212
00:07:31,039 –> 00:07:32,960
و نتایج در اینجا پایین می آیند،
213
00:07:32,960 –> 00:07:35,120
بنابراین indycar را تایپ می کنم و
214
00:07:35,120 –> 00:07:36,960
این دو نتیجه را برای indycar درست در
215
00:07:36,960 –> 00:07:37,840
آنجا دریافت
216
00:07:37,840 –> 00:07:40,880
می کنم همچنین توجه کنید اینجا در بالای صفحه ما
217
00:07:40,880 –> 00:07:41,919
تاریخچه ای
218
00:07:41,919 –> 00:07:43,840
در مرورگر خود داریم بنابراین یک URL داریم.
219
00:07:43,840 –> 00:07:45,360
در واقع تاریخچه را در آنجا قرار می دهد، بنابراین اگر
220
00:07:45,360 –> 00:07:46,479
من چیزهای مختلف را جستجو کنم، می توانم به
221
00:07:46,479 –> 00:07:48,160
جلو و عقب بروم
222
00:07:48,160 –> 00:07:49,680
و می خواهم همه اینها بدون
223
00:07:49,680 –> 00:07:52,000
بارگیری مجدد صفحه در حین تایپ اتفاق بیفتد، بنابراین اگر
224
00:07:52,000 –> 00:07:53,759
Indie تایپ کنم و مکث کنم، می خواهم
225
00:07:53,759 –> 00:07:55,280
همه نتایج را ببینم indie و سپس
226
00:07:55,280 –> 00:07:57,680
ماشین را کامل می کنم می خواهم ماشین ایندی را ببینم فقط
227
00:07:57,680 –> 00:07:59,039
در آنجا ادامه می دهم و همچنین می خواهم برای به
228
00:07:59,039 –> 00:08:02,080
روز رسانی نوار ناوبری نوار آدرس
229
00:08:02,080 –> 00:08:03,919
و تاریخچه به
230
00:08:03,919 –> 00:08:05,680
نظر می رسد بسیار زیاد است ما
231
00:08:05,680 –> 00:08:07,759
زمان زیادی برای انجام آن نداریم اما شما ببین خیلی
232
00:08:07,759 –> 00:08:09,759
سخت نیست،
233
00:08:09,759 –> 00:08:12,800
پس بیا به اینجا بروید و پروژه ما را باز کنید
234
00:08:12,800 –> 00:08:15,039
235
00:08:15,039 –> 00:08:16,400
236
00:08:16,400 –> 00:08:18,479
و سریعاً روشن شد، فقط نگاهی به
237
00:08:18,479 –> 00:08:20,800
این برنامه جمعآوری ویدیو بیاندازید، اگر از اینجا پایین
238
00:08:20,800 –> 00:08:22,080
239
00:08:22,080 –> 00:08:24,479
آمدیم، به عنوان مثال میتوانیم ببینیم که چند ویدیو
240
00:08:24,479 –> 00:08:27,440
داریم که دوست داریم در اینجا و در اینجا یک
241
00:08:27,440 –> 00:08:30,479
واقعا دیوانه است که این مرد این دکل مسابقه سیم کارت را ساخته
242
00:08:30,479 –> 00:08:33,599
است، در واقع او داخل آن نشسته است،
243
00:08:33,599 –> 00:08:36,080
در واقع بازوهای او هستند،
244
00:08:36,080 –> 00:08:37,679
اما این یک چیز غوطه ور کننده واقعا عجیب
245
00:08:37,679 –> 00:08:39,599
است، اوه شما می توانید بررسی کنید که فوق
246
00:08:39,599 –> 00:08:41,599
العاده جالب است، اما کاری که ما می خواهیم انجام دهیم این
247
00:08:41,599 –> 00:08:42,799
است که ما میخواهم بتوانم به اینجا بروم
248
00:08:42,799 –> 00:08:45,440
و ماشین ایندی را جستجو کنم، بنابراین میتوانم
249
00:08:45,440 –> 00:08:46,880
همانطور که تایپ
250
00:08:46,880 –> 00:08:48,000
251
00:08:48,000 –> 00:08:50,080
میکنم هیچ اتفاقی نمیافتد، اما اگر اینتر را بزنم مطمئناً نتایج را دریافت میکنیم،
252
00:08:50,080 –> 00:08:52,959
هیچ چیزی در اینجا انجام نمیدهیم، به
253
00:08:52,959 –> 00:08:54,399
ما میگوید عجیب است که آیا میخواهید دوباره ارسال کنید
254
00:08:54,399 –> 00:08:56,320
در این صفحه ممکن است چیزی را دوبار بخرید
255
00:08:56,320 –> 00:08:58,080
که عجیب باشد،
256
00:08:58,080 –> 00:08:59,680
ما هیچ یک از آن چیزی را که می
257
00:08:59,680 –> 00:09:02,080
خواهیم مانند یک صفحه معمولی نمی خواهیم، ما همچنین می خو
258
00:09:02,080 –> 00:09:03,920
هیم نتیجه بگیریم همانطور که تایپ می کنیم حتی نمی خو
259
00:09:03,920 –> 00:09:06,000
هیم به آن دکمه جستجو نیاز داشته با
260
00:09:06,000 –> 00:09:08,240
یم. در اینجا در کد ما چند
261
00:09:08,240 –> 00:09:09,120
چیز وجود دارد t کلاهی که باید با آن
262
00:09:09,120 –> 00:09:11,680
تعامل داشته
263
00:09:11,680 –> 00:09:15,279
باشیم، فرم html برای جستجو است، بنابراین
264
00:09:15,279 –> 00:09:17,519
این بسیار ساده است، در اینجا فرمی است
265
00:09:17,519 –> 00:09:20,640
که ما یک پست جستجوی ویدیویی انجام می
266
00:09:20,640 –> 00:09:22,480
دهیم و مقداری داده داریم که داده ها
267
00:09:22,480 –> 00:09:24,160
به صورت متن جستجو در
268
00:09:24,160 –> 00:09:25,760
هنگام بازگشت نتایج به دست می آیند. بگویید اگر
269
00:09:25,760 –> 00:09:27,839
متنی برای جستجو وجود دارد، میخواهیم نشان
270
00:09:27,839 –> 00:09:29,680
دهیم که تعداد آنها چقدر است، آن آزمایش را
271
00:09:29,680 –> 00:09:30,720
انجام میدهیم، زیرا نمیخواهیم بگوییم که
272
00:09:30,720 –> 00:09:32,640
وقتی فقط در صفحه جستجو قرار میگیرید، نتیجه صفر است
273
00:09:32,640 –> 00:09:33,760
274
00:09:33,760 –> 00:09:34,800
و سپس ما فقط کمی از آن را انجام میدهیم
275
00:09:34,800 –> 00:09:36,880
. حلقه زدن روی
276
00:09:36,880 –> 00:09:39,120
هر ویدیویی که در نتایج برگشت
277
00:09:39,120 –> 00:09:41,120
و فقط چاپ آن در آنجا، آن را
278
00:09:41,120 –> 00:09:42,640
در صفحه قرار می
279
00:09:42,640 –> 00:09:44,560
دهد بسیار ساده است
280
00:09:44,560 –> 00:09:47,760
که چگونه این کار را با htmx انجام دهیم
281
00:09:47,760 –> 00:09:49,760
خوب اجازه دهید به سرعت به اینجا نیز نگاه کنیم
282
00:09:49,760 –> 00:09:50,720
283
00:09:50,720 –> 00:09:52,080
این
284
00:09:52,080 –> 00:09:54,240
تمام روش جستجو است که ما انجام می دهیم.
285
00:09:54,240 –> 00:09:55,680
در سمت سرور
286
00:09:55,680 –> 00:09:58,000
با استفاده از این مفهوم از مدلهای view،
287
00:09:58,000 –> 00:09:59,360
این کلاس به نوعی تبادل دادهها
288
00:09:59,360 –> 00:10:00,880
و موارد دیگر را انجام میدهد
289
00:10:00,880 –> 00:10:02,720
و سپس نتایجی را که
290
00:10:02,720 –> 00:10:05,120
شامل نتایج جستجو میشود، در صورتی که
291
00:10:05,120 –> 00:10:06,399
292
00:10:06,399 –> 00:10:08,079
مشکلی پیدا کرد، برمیگرداند، بنابراین آنچه ما میخواهیم انجام دهیم این است که ما می خواهم به
293
00:10:08,079 –> 00:10:10,640
wo rk با این روش و این html برای
294
00:10:10,640 –> 00:10:13,360
اضافه کردن آن ویژگی آن جستجوی فعالی را
295
00:10:13,360 –> 00:10:15,519
که الان توضیح دادم را اضافه کنید، اول از همه باید
296
00:10:15,519 –> 00:10:18,240
htmx را با فریمورک های جاوا اسکریپت زیادی نصب کنیم
297
00:10:18,240 –> 00:10:20,800
، مانند cli و pack
298
00:10:20,800 –> 00:10:22,640
و انواع چیزها
299
00:10:22,640 –> 00:10:25,440
با htmx، فقط یک فایل است، بنابراین در اینجا ما
300
00:10:25,440 –> 00:10:28,240
این htmlx را در آنجا داشته باشید، بیایید به نقل از
301
00:10:28,240 –> 00:10:29,839
آن را نصب کنید، می توانید ببینید که ما یک
302
00:10:29,839 –> 00:10:32,560
صفحه طرح بندی مشترک برای کل سایت خود داریم، بیایید
303
00:10:32,560 –> 00:10:34,240
به پایین اینجا برویم و در این
304
00:10:34,240 –> 00:10:36,720
جاوا اسکریپت اضافی، من می خواهم
305
00:10:36,720 –> 00:10:39,760
منبع اسکریپت را قرار دهم،
306
00:10:39,760 –> 00:10:41,600
این را بررسی کنید، بنابراین ما می خواهیم بگوییم
307
00:10:41,600 –> 00:10:43,440
static
308
00:10:43,440 –> 00:10:44,880
javascript
309
00:10:44,880 –> 00:10:48,560
htmx ما به سراغ min
310
00:10:48,720 –> 00:10:51,519
ta-da می رویم که شما اکنون نصب کرده اید htmx
311
00:10:51,519 –> 00:10:55,760
فعال است و در تمام سایت ها اجرا می شود بنابراین
312
00:10:55,760 –> 00:10:58,000
ادغام با سیستم ما در اینجا
313
00:10:58,000 –> 00:10:58,880
314
00:10:58,880 –> 00:11:01,279
بسیار آسان است.
315
00:11:01,279 –> 00:11:02,240
316
00:11:02,240 –> 00:11:04,000
317
00:11:04,000 –> 00:11:05,600
برای قرار دادن آن در بیرون در صورتی که
318
00:11:05,600 –> 00:11:07,680
دیگری این کار را انجام دهد، اما من به آنها اجازه میدهم
319
00:11:07,680 –> 00:11:09,680
موارد اضافی را در آنجا قرار دهند تا ما آن را
320
00:11:09,680 –> 00:11:11,600
در پایین صفحه برای همه
321
00:11:11,600 –> 00:11:14,160
صفحات داشته باشیم، بنابراین htmx فعال باشد،
322
00:11:14,160 –> 00:11:16,079
استفاده از آن بسیار ساده است. اسما من
323
00:11:16,079 –> 00:11:20,240
فایل 10k را دوست دارم، بنابراین
324
00:11:20,240 –> 00:11:22,880
برای اینکه بتوانیم این جستجوی فعال را انجام دهیم
325
00:11:22,880 –> 00:11:24,320
و نه فقط
326
00:11:24,320 –> 00:11:26,000
با یک فرم جستجو
327
00:11:26,000 –> 00:11:28,320
کنیم این است که باید
328
00:11:28,320 –> 00:11:30,160
چند عامل را اضافه کنیم که قبلاً آن
329
00:11:30,160 –> 00:11:31,839
چیزهای hx را دیده اید، بنابراین ما قرار خواهیم داد
330
00:11:31,839 –> 00:11:33,279
محرکهای ورودی سمت راست،
331
00:11:33,279 –> 00:11:34,480
کادر متنی است
332
00:11:34,480 –> 00:11:37,200
که میخواهم بگویم hx dash دریافت کنید و
333
00:11:37,200 –> 00:11:38,959
چه کاری انجام میدهیم، برای دریافت ویدیوها به اینجا
334
00:11:38,959 –> 00:11:40,000
335
00:11:40,000 –> 00:11:43,040
336
00:11:43,040 –> 00:11:44,560
337
00:11:44,560 –> 00:11:47,360
میرویم.
338
00:11:47,360 –> 00:11:49,440
ما به یک ماشه نیاز داریم که چه زمانی
339
00:11:49,440 –> 00:11:52,639
شروع میشود،
340
00:11:52,639 –> 00:11:54,399
اگر آن را روی کلید بالا قرار دهیم، اگر آن را روی کلید تا بزنیم،
341
00:11:54,399 –> 00:11:56,399
از جمله کلیدهای
342
00:11:56,399 –> 00:11:57,600
جهتنما و چیزهای عجیب و غریب
343
00:11:57,600 –> 00:12:00,240
،
344
00:12:00,240 –> 00:12:03,120
مبادله با سروری را آغاز میکند که ایدهآل نیست،
345
00:12:03,120 –> 00:12:05,600
بنابراین میخواهیم میگوییم ما فقط میخواهیم این کار را
346
00:12:05,600 –> 00:12:06,399
347
00:12:06,399 –> 00:12:08,320
بعد از تایپ کردن آنها انجام دهیم، بنابراین
348
00:12:08,320 –> 00:12:12,480
میگوییم تاخیر بیایید 500 میلیثانیه بگذاریم
349
00:12:12,480 –> 00:12:14,240
تا بتوانید چند بار تایپ کنید، اما اگر
350
00:12:14,240 –> 00:12:16,240
بیش از 500 میلیثانیه م