در این مطلب، ویدئو نحوه ایجاد یک وب سایت با پایتون و جنگو – دارایی های جلوی ثابت (E06) با زیرنویس فارسی را برای دانلود قرار داده ام. شما میتوانید با پرداخت 15 هزار تومان ، این ویدیو به علاوه تمامی فیلم های سایت را دانلود کنید.اکثر فیلم های سایت به زبان انگلیسی می باشند. این ویدئو دارای زیرنویس فارسی ترجمه شده توسط هوش مصنوعی می باشد که میتوانید نمونه ای از آن را در قسمت پایانی این مطلب مشاهده کنید.
مدت زمان فیلم: 00:29:46
تصاویر این ویدئو:
قسمتی از زیرنویس این فیلم:
00:00:00,240 –> 00:00:01,839
سلام بچه ها آرون اینجا به
2
00:00:01,839 –> 00:00:03,679
یک آموزش جنگوی پایتون دیگر خوش آمدید،
3
00:00:03,679 –> 00:00:05,200
این بار در مورد
4
00:00:05,200 –> 00:00:06,799
دارایی های فرانت اند و نحوه ارائه
5
00:00:06,799 –> 00:00:09,360
آنها صحبت می کنیم، از بوت استرپ با یک
6
00:00:09,360 –> 00:00:10,960
قالب html استفاده می
7
00:00:10,960 –> 00:00:13,440
کنیم و این صفحه اصلی را با
8
00:00:13,440 –> 00:00:15,360
چند لینک ایجاد می کنیم. که میتوانید روی آن کلیک کنید
9
00:00:15,360 –> 00:00:17,920
و واکنشگرا است، بنابراین به
10
00:00:17,920 –> 00:00:18,560
موبایل تبدیل میشود،
11
00:00:18,560 –> 00:00:20,720
پس بیایید شروع کنیم خوب، بنابراین برای ایجاد
12
00:00:20,720 –> 00:00:22,080
قسمت جلویی، از
13
00:00:22,080 –> 00:00:23,359
پروژهای به نام بوت استرپ استفاده میکنیم،
14
00:00:23,359 –> 00:00:25,359
فکر میکنم بوت استرپ در ابتدا
15
00:00:25,359 –> 00:00:27,119
توسط توییتر ایجاد شد،
16
00:00:27,119 –> 00:00:30,480
اما از آن زمان به بعد منبع باز است.
17
00:00:30,480 –> 00:00:32,880
و اساساً یک راه آسان برای ساختن
18
00:00:32,880 –> 00:00:34,000
یک وب سایت واکنش گرا است،
19
00:00:34,000 –> 00:00:36,160
اگر اصلاً با front end آشنا
20
00:00:36,160 –> 00:00:38,239
هستید، می دانید که بوت استرپ چیست،
21
00:00:38,239 –> 00:00:40,239
این فقط یک دسته از کلاس های js و
22
00:00:40,239 –> 00:00:41,280
css است
23
00:00:41,280 –> 00:00:43,120
که می توانید برای ساخت وب سایت خود از آنها استفاده کنید
24
00:00:43,120 –> 00:00:44,559
،
25
00:00:44,559 –> 00:00:46,399
بنابراین اگر شما وارد مثالها میشوید، میتوانید
26
00:00:46,399 –> 00:00:47,840
همه چیزهایی را که افراد دیگر
27
00:00:47,840 –> 00:00:49,280
با این
28
00:00:49,280 –> 00:00:50,960
ساختهاند، ببینید و مجموعهای از مستندات وجود دارد
29
00:00:50,960 –> 00:00:52,800
که میتوانید
30
00:00:52,800 –> 00:00:54,960
در حین ساختن سایت خود از آنها استفاده کنید، اکنون
31
00:00:54,960 –> 00:00:55,920
کار دیگری که میخواهم انجام دهم
32
00:00:55,920 –> 00:00:58,160
دانلود یک تم است که میتوانیم از آن استفاده کنیم. برای
33
00:00:58,160 –> 00:00:58,960
وبسایت ما
34
00:00:58,960 –> 00:01:01,680
و بنابراین من این مورد بسیار ابتدایی
35
00:01:01,680 –> 00:01:03,120
به نام start bootstrap
36
00:01:03,120 –> 00:01:05,680
را پیدا کردم و فقط یک صفحه است در اینجا، اما
37
00:01:05,680 –> 00:01:06,799
احتمالاً میخواهم آن را به
38
00:01:06,799 –> 00:01:08,400
چندین صفحه تقسیم
39
00:01:08,400 –> 00:01:10,720
کنم، استایل بسیار زیبایی دارد که
40
00:01:10,720 –> 00:01:12,640
دوست دارم، بنابراین فکر میکنم این کار را انجام دهد.
41
00:01:12,640 –> 00:01:15,280
اگر به bootstrap.com راه اندازی می کنید استفاده از آن عالی است،
42
00:01:15,280 –> 00:01:17,280
می توانید دسته ای از
43
00:01:17,280 –> 00:01:18,880
تم های مختلف را ببینید که از
44
00:01:18,880 –> 00:01:21,200
بوت
45
00:01:21,200 –> 00:01:22,000
46
00:01:22,000 –> 00:01:24,240
47
00:01:24,240 –> 00:01:25,360
48
00:01:25,360 –> 00:01:27,280
استرپ استفاده می کنند. admin 2
49
00:01:27,280 –> 00:01:29,520
قبلاً و بسیار خوب است،
50
00:01:29,520 –> 00:01:31,600
اما بله، اگر بخواهید می توانید از یک تم متفاوت استفاده کنید،
51
00:01:31,600 –> 00:01:33,680
اما از آنجایی که این یکی ساده است
52
00:01:33,680 –> 00:01:35,040
، فکر می کنم
53
00:01:35,040 –> 00:01:36,560
54
00:01:36,560 –> 00:01:37,840
پس از دانلود قالب از
55
00:01:37,840 –> 00:01:40,079
آن وب سایت، فقط به تم فریلنسر پایبند خواهم بود، یک تم دریافت خواهید کرد. فایل zip را از حالت فشرده خارج کنید و
56
00:01:40,079 –> 00:01:41,360
اگر آن را از حالت فشرده خارج
57
00:01:41,360 –> 00:01:43,920
کنید، تمام دارایی های آن
58
00:01:43,920 –> 00:01:44,960
وب سایت
59
00:01:44,960 –> 00:01:47,600
را می بینید، بنابراین من می خواهم همه آنها را در
60
00:01:47,600 –> 00:01:49,680
فهرست پروژه خود کپی کنم
61
00:01:49,680 –> 00:01:51,360
و برای انجام این کار، فقط یک پوشه جدید ایجاد می کنیم
62
00:01:51,360 –> 00:01:53,759
و آن را static در داخل static می نامیم.
63
00:01:53,759 –> 00:01:55,840
64
00:01:55,840 –> 00:01:57,759
پوشه ای خواهد بود که به همه سرویس می دهد داراییهای ثابت ما،
65
00:01:57,759 –> 00:01:58,399
66
00:01:58,399 –> 00:02:00,079
من یک پوشه جدید ایجاد میکنم و
67
00:02:00,079 –> 00:02:01,439
این موضوع را فراخوانی
68
00:02:01,439 –> 00:02:04,000
میکنم، بنابراین فقط برای جدا کردن سایر داراییهایی
69
00:02:04,000 –> 00:02:05,360
که استفاده میکنیم از سایت در
70
00:02:05,360 –> 00:02:06,320
موضوع اصلی
71
00:02:06,320 –> 00:02:08,560
، یک پوشه دیگر ایجاد میکنیم و سپس
72
00:02:08,560 –> 00:02:10,399
فقط میروم همه این
73
00:02:10,399 –> 00:02:10,800
موارد
74
00:02:10,800 –> 00:02:14,400
را در پوشه تم و پوشههای کپی کپی کنید،
75
00:02:14,400 –> 00:02:17,120
بنابراین اکنون میتوانید همه داراییهای ما را ببینید و
76
00:02:17,120 –> 00:02:18,560
اگر چند چیز در اینجا وجود دارد که به
77
00:02:18,560 –> 00:02:20,239
آنها نیازی نداریم،
78
00:02:20,239 –> 00:02:22,400
اگر وارد پوشه ایمیل شویم، میتوانیم از
79
00:02:22,400 –> 00:02:23,879
شر تماس با ما خلاص
80
00:02:23,879 –> 00:02:26,720
شویم. .php
81
00:02:26,720 –> 00:02:29,360
این فقط بخشی از آن موضوع بود
82
00:02:29,360 –> 00:02:31,680
و ایمیلهایی را از فرم تماس ارسال میکرد، اما
83
00:02:31,680 –> 00:02:33,360
ما پیادهسازی خودمان را ایجاد
84
00:02:33,360 –> 00:02:35,360
میکنیم که برخی از
85
00:02:35,360 –> 00:02:37,040
js اعتبارسنجی در اینجا وجود دارد، فکر میکنم فقط آن را بگذاریم که
86
00:02:37,040 –> 00:02:39,120
در واقع
87
00:02:39,120 –> 00:02:41,760
یک فاویکون وجود دارد که میگذاریم.
88
00:02:41,760 –> 00:02:43,599
که بعداً آن موارد را حذف خواهیم کرد،
89
00:02:43,599 –> 00:02:45,519
بنابراین اکنون موضوع خود را داریم،
90
00:02:45,519 –> 00:02:47,120
باید چند کار انجام دهیم تا مطمئن شویم
91
00:02:47,120 –> 00:02:48,720
که برنامه ما واقعاً میتواند
92
00:02:48,720 –> 00:02:51,519
آن داراییهای ثابت را برای انجام این کار انجام دهد که
93
00:02:51,519 –> 00:02:54,640
باید به تنظیمات بروید
94
00:02:54,640 –> 00:02:57,040
و مطمئن شوید که ما برنامه
95
00:02:57,040 –> 00:02:57,760
داراییهای ثابت را
96
00:02:57,760 –> 00:03:00,959
نصب کردهایم، بنابراین این یکی درست است
97
00:03:00,959 –> 00:03:01,800
در اینجا
98
00:03:01,800 –> 00:03:03,440
فایل djangocontrib.static بسیار
99
00:03:03,440 –> 00:03:05,200
عالی است
100
00:03:05,200 –> 00:03:08,000
و اکنون می خواهیم چند پیکربندی دیگر را اضافه
101
00:03:08,000 –> 00:03:10,239
کنیم تا
102
00:03:10,239 –> 00:03:12,879
مطمئن شویم که آن دارایی ها را ارائه می
103
00:03:12,879 –> 00:03:15,360
دهیم، بنابراین URL استاتیک ما از قبل در اینجا تعریف شده است و
104
00:03:15,360 –> 00:03:17,519
به همه این
105
00:03:17,519 –> 00:03:19,040
فایل های ثابت و فایل های ثابت پیشوند می شود.
106
00:03:19,040 –> 00:03:21,280
107
00:03:21,280 –> 00:03:23,200
به همین ترتیب آدرسهای اینترنتی
108
00:03:23,200 –> 00:03:25,040
به همان شکلی که ساختار پوشه
109
00:03:25,040 –> 00:03:27,120
در پوشه استاتیک شما قرار دارد تولید میشوند،
110
00:03:27,120 –> 00:03:29,599
بنابراین اکنون میخواهم یک
111
00:03:29,599 –> 00:03:30,799
متغیر جدید در اینجا ایجاد کنم
112
00:03:30,799 –> 00:03:33,840
و این برنامه جنگو ما را نشان میدهد که کجا
113
00:03:33,840 –> 00:03:34,400
114
00:03:34,400 –> 00:03:37,120
برای استاتیک جستجو کنیم. فایلها، بنابراین من میخواهم
115
00:03:37,120 –> 00:03:37,760
نام این
116
00:03:37,760 –> 00:03:40,879
فایلهای استاتیک را زیر خط
117
00:03:40,879 –> 00:03:44,159
خطی dir برابر با آرایهای بگذارم، آرایه با
118
00:03:44,159 –> 00:03:44,879
119
00:03:44,879 –> 00:03:47,120
تمام فهرستهایی که میخواهیم
120
00:03:47,120 –> 00:03:49,280
فایلهای استاتیک را در آنها جستجو کنیم، پر میشود،
121
00:03:49,280 –> 00:03:51,040
بنابراین من فقط میخواهم چیزی را
122
00:03:51,040 –> 00:03:53,360
که قبلا ایجاد کردهام کپی
123
00:03:53,360 –> 00:03:55,920
کنم. اساساً فقط به دایرکتوری پایه ملحق می
124
00:03:55,920 –> 00:03:57,519
شویم، جایی که ما
125
00:03:57,519 –> 00:03:58,720
پوشه استاتیک را
126
00:03:58,720 –> 00:04:00,560
با static تعریف می کنیم، زیرا
127
00:04:00,560 –> 00:04:02,400
نام پوشه همین است
128
00:04:02,400 –> 00:04:05,680
و بنابراین اکنون باید خوب برویم
129
00:04:05,680 –> 00:04:09,200
و در واقع یک فایل ثابت است.
130
00:04:09,200 –> 00:04:11,920
131
00:04:11,920 –> 00:04:12,480
اگر من
132
00:04:12,480 –> 00:04:15,360
وارد قالب های خود شوم و شاید در
133
00:04:15,360 –> 00:04:17,120
فایل فهرست
134
00:04:17,120 –> 00:04:18,478
می توانم به دنبال تصویری بگردم که
135
00:04:18,478 –> 00:04:20,399
قبلاً در
136
00:04:20,399 –> 00:04:24,080
index.html الگوی من وجود دارد، این index.js
137
00:04:24,080 –> 00:04:26,000
دقیقاً همان
138
00:04:26,000 –> 00:04:28,160
html وب سایتی است که قبلاً در حال بررسی آن بودیم.
139
00:04:28,160 –> 00:04:30,240
صفحه شروع بوت استرپ،
140
00:04:30,240 –> 00:04:32,240
بنابراین ما میتوانیم چیزی
141
00:04:32,240 –> 00:04:34,720
مانند این تگ تصویر را در اینجا کپی کنیم
142
00:04:34,720 –> 00:04:37,360
و آن را نمایش دهیم تا مطمئن شویم
143
00:04:37,360 –> 00:04:39,280
همه چیز برای سرور دارایی ثابت ما تنظیم شده است،
144
00:04:39,280 –> 00:04:40,560
145
00:04:40,560 –> 00:04:42,800
اجازه دهید به فهرست برگردیم و فقط
146
00:04:42,800 –> 00:04:44,240
این را در
147
00:04:44,240 –> 00:04:45,919
اینجا بچسبانیم، همانطور که گفتم باید به
148
00:04:45,919 –> 00:04:47,919
149
00:04:47,919 –> 00:04:50,160
آدرس اینترنتی دیگری در اینجا ارجاع داده شود و من می توانم کاری شبیه به این انجام دهم
150
00:04:50,160 –> 00:04:51,440
که در آن فقط دارایی های
151
00:04:51,440 –> 00:04:55,280
اسلش تم اسلش ثابت
152
00:04:55,280 –> 00:04:58,320
و مسیر فایل را انجام می دهم،
153
00:04:58,320 –> 00:05:00,720
اما اگر این URL استاتیک را تغییر
154
00:05:00,720 –> 00:05:04,000
دهیم، می خواهیم مطمئن شویم
155
00:05:04,000 –> 00:05:07,039
که به طور خودکار به روز می شود. برای ما،
156
00:05:07,039 –> 00:05:11,360
بنابراین میتوانیم از یک فرمان الگو استفاده کنیم
157
00:05:11,360 –> 00:05:14,240
و برای انجام این کار، فقط باید داراییهای
158
00:05:14,240 –> 00:05:15,199
استاتیک خود را بارگیری کنیم
159
00:05:15,199 –> 00:05:18,240
و سپس باید اساساً از
160
00:05:18,240 –> 00:05:19,280
یک دستور الگو
161
00:05:19,280 –> 00:05:23,280
برای ساختن URL برای دارایی استاتیک استفاده کنیم،
162
00:05:23,280 –> 00:05:25,039
بنابراین من میخواهم دیگری را قرار دهم. برچسب
163
00:05:25,039 –> 00:05:26,320
داخل th در داخل پرانتز
164
00:05:26,320 –> 00:05:28,720
ما از تابع استاتیک استفاده می کنیم و سپس
165
00:05:28,720 –> 00:05:29,759
166
00:05:29,759 –> 00:05:31,840
مسیر آن فایل را مشخص می کنیم، بنابراین من فکر می کنم که
167
00:05:31,840 –> 00:05:33,759
موضوع موضوع بود
168
00:05:33,759 –> 00:05:35,360
متأسفم و شما باید این موضوع را با
169
00:05:35,360 –> 00:05:38,960
یک quotes theme slash assets
170
00:05:38,960 –> 00:05:42,960
slash img بپیچید و ما فقط این svg را کپی می کنیم
171
00:05:42,960 –> 00:05:45,600
172
00:05:46,160 –> 00:05:49,039
. می توانید آن را ذخیره کنید و مطمئن شوید که یک سرور
173
00:05:49,039 –> 00:05:50,400
راه اندازی مجدد شده است
174
00:05:50,400 –> 00:05:52,639
و سپس صفحه را بازخوانی کنید و شما
175
00:05:52,639 –> 00:05:54,800
باید بتوانید آن تصویر را ببینید و اگر
176
00:05:54,800 –> 00:05:56,400
به
177
00:05:56,400 –> 00:05:59,199
پنل شبکه بروم و به تصاویرم نگاه کنم می توانید
178
00:05:59,199 –> 00:05:59,680
ببینید
179
00:05:59,680 –> 00:06:02,080
که دارای تم
180
00:06:02,080 –> 00:06:03,759
اسلش ثابت است تصویر اسلش دارایی اسلش
181
00:06:03,759 –> 00:06:05,440
بنابراین میخواهم زمانی که
182
00:06:05,440 –> 00:06:06,800
این موارد را اشکالزدایی میکنید اشاره کنم که
183
00:06:06,800 –> 00:06:07,840
میخواهید مطمئن شوید که
184
00:06:07,840 –> 00:06:10,560
حافظه پنهان را در ابزارهای توسعهدهنده خود غیرفعال کردهاید،
185
00:06:10,560 –> 00:06:12,000
زیرا ما در حال حاضر راهاندازی busting حافظه پنهان خود را نداریم،
186
00:06:12,000 –> 00:06:12,960
187
00:06:12,960 –> 00:06:15,680
یعنی هر زمان که
188
00:06:15,680 –> 00:06:16,240
داراییای
189
00:06:16,240 –> 00:06:18,960
مانند js یا css یا چیز دیگری را ارائه میدهیم. اگر
190
00:06:18,960 –> 00:06:20,000
191
00:06:20,000 –> 00:06:23,120
کد خاصی نداشته باشد که نمایانگر
192
00:06:23,120 –> 00:06:24,800
هش محتویات فایل
193
00:06:24,800 –> 00:06:27,039
در نام فایل باشد، مرورگر آن را کش میکند
194
00:06:27,039 –> 00:06:28,479
تا مجبور نباشد
195
00:06:28,479 –> 00:06:29,759
هر بار که صفحه را بارگذاری میکنیم، آن
196
00:06:29,759 –> 00:06:31,680
را واکشی کند. فعال شد و ما تعدادی را می سازیم
197
00:06:31,680 –> 00:06:33,840
تغییرات محلی مرورگر ما
198
00:06:33,840 –> 00:06:35,680
این تغییرات را بهروزرسانی نمیکند زیرا آنها را در حافظه پنهان ذخیره میکند،
199
00:06:35,680 –> 00:06:37,360
بنابراین در حالی که در حال توسعه هستیم، فعلاً
200
00:06:37,360 –> 00:06:39,440
حافظه پنهان را غیرفعال میکنیم، اما زمانی که این برنامه
201
00:06:39,440 –> 00:06:40,560
تولیدی را آماده
202
00:06:40,560 –> 00:06:42,639
کنیم، مطمئن میشویم که مکانیسمهای مخرب حافظه پنهان
203
00:06:42,639 –> 00:06:44,400
را درست در جای خود
204
00:06:44,400 –> 00:06:46,639
قرار دادهایم. اکنون میخواهم چند
205
00:06:46,639 –> 00:06:48,720
فایل مورد نیاز دیگر را تنظیم
206
00:06:48,720 –> 00:06:52,280
کنم و اگر به index.html تم قالب خود برگردم
207
00:06:52,280 –> 00:06:54,720
، همه این موارد را در سر میبینید
208
00:06:54,720 –> 00:06:55,759
209
00:06:55,759 –> 00:06:59,840
که نشاندهنده وابستگیهایی است که این
210
00:06:59,840 –> 00:07:03,039
الگو برای اجرای درست به
211
00:07:03,039 –> 00:07:05,599
آن نیاز دارد. من فقط می خواهم همه این
212
00:07:05,599 –> 00:07:06,560
موارد را در head
213
00:07:06,560 –> 00:07:09,800
214
00:07:09,800 –> 00:07:12,240
215
00:07:12,240 –> 00:07:13,120
216
00:07:13,120 –> 00:07:15,680
کپی کنم
217
00:07:15,680 –> 00:07:16,319
و به پایگاه
218
00:07:16,319 –> 00:07:17,680
خودمان برویم.
219
00:07:17,680 –> 00:07:19,199
عنوان را در اینجا حذف کنید اما
220
00:07:19,199 –> 00:07:21,440
همه چیزهای دیگر می توانند باقی بمانند
221
00:07:21,440 –> 00:07:23,280
و در واقع شاید من از شر
222
00:07:23,280 –> 00:07:24,720
فاویکون نیز خلاص شوم زیرا
223
00:07:24,720 –> 00:07:27,280
احتمالاً فاویکون خودمان را خواهیم داشت
224
00:07:27,280 –> 00:07:29,520
و سپس باید برخی از این
225
00:07:29,520 –> 00:07:31,280
موارد را به روز کنم تا از فهرست فایل های ثابت
226
00:07:31,280 –> 00:07:32,479
227
00:07:32,479 –> 00:07:35,440
خارج شود. به فهرست برگردید و این
228
00:07:35,440 –> 00:07:36,800
تگ
229
00:07:36,800 –> 00:07:39,599
را در آن کپی کنید load static شما می توانید به پایه بروید
230
00:07:39,599 –> 00:07:40,880
و واقعاً مهم نیست که
231
00:07:40,880 –> 00:07:41,919
این را بیش از یک بار بارگذاری کنید
232
00:07:41,919 –> 00:07:45,520
زیرا ایندکس پایه را گسترش می دهد اما
233
00:07:45,520 –> 00:07:47,199
خوب است که static را در اینجا نیز بارگیری کنید
234
00:07:47,199 –> 00:07:49,520
و سپس
235
00:07:49,520 –> 00:07:51,919
ما فقط این تگ را کپی می کنیم تا بتوانیم
236
00:07:51,919 –> 00:07:53,840
آن را با
237
00:07:53,840 –> 00:07:57,599
این شیوه نامه css را
238
00:07:57,599 –> 00:07:58,400
239
00:07:58,400 –> 00:08:03,120
کپی می کنم و بعد از تم اینجا می چسبانم
240
00:08:03,120 –> 00:08:06,160
و می توانم آن را ذخیره کنم و سپس یک کار
241
00:08:06,160 –> 00:08:07,680
دیگر وجود دارد که باید انجام
242
00:08:07,680 –> 00:08:11,440
دهیم اگر دوباره به فهرست قالب ها برویم،
243
00:08:11,440 –> 00:08:12,000
244
00:08:12,000 –> 00:08:14,479
می توانید به پایین اسکرول کنید و
245
00:08:14,479 –> 00:08:17,360
خواهید دید که در اینجا تعداد زیادی اسکریپت js وجود دارد،
246
00:08:17,360 –> 00:08:20,240
بنابراین ما باید
247
00:08:20,240 –> 00:08:20,960
آن ها را نیز
248
00:08:20,960 –> 00:08:24,240
در پایگاه خود قرار دهیم، بنابراین من فقط می خواهم
249
00:08:24,240 –> 00:08:25,440
اینجا را به پایین اسکرول کنم
250
00:08:25,440 –> 00:08:27,120
و معتقدم این ها در بدنه هستند که
251
00:08:27,120 –> 00:08:28,080
احتمالاً فقط می خواهیم آنها را قرار دهیم. آنها در
252
00:08:28,080 –> 00:08:30,400
همان مکان هستند، بله،
253
00:08:30,400 –> 00:08:33,440
بنابراین من به ایندکس یا پایگاه متاسفم برمی
254
00:08:33,440 –> 00:08:36,000
گردم و فقط آنها را درست زیر
255
00:08:36,000 –> 00:08:37,519
اصلی اینجا قرار
256
00:08:37,519 –> 00:08:39,519
257
00:08:39,519 –> 00:08:40,640
می دهم تا برخی از موارد فرم تماس در اینجا وجود داشته باشد، فکر می کنم فعلاً می خواهم این را حذف
258
00:08:40,640 –> 00:08:42,559
کنم و می توانیم اضافه کنیم بعداً در صورت
259
00:08:42,559 –> 00:08:43,279
نیاز،
260
00:08:43,279 –> 00:08:44,720
بنابراین چند کتابخانه شخص ثالث دیگر
261
00:08:44,720 –> 00:08:46,320
در اینجا وجود دارد که
262
00:08:46,320 –> 00:08:47,839
یکی از آنها b است کتابخانه ootstrap
263
00:08:47,839 –> 00:08:49,200
که من در مورد آن صحبت کردم، بنابراین
264
00:08:49,200 –> 00:08:50,959
نیازی نیست که بعداً وقتی شروع به
265
00:08:50,959 –> 00:08:52,959
استفاده از موارد بوت استرپ خود می کنیم این کار را انجام دهیم
266
00:08:52,959 –> 00:08:55,839
و سپس اسکریپت های اصلی js
267
00:08:55,839 –> 00:08:56,560
برای موضوع وجود دارد،
268
00:08:56,560 –> 00:08:59,600
بنابراین من فقط می خواهم تگ استاتیک
269
00:08:59,600 –> 00:09:03,279
را دوباره در اینجا کپی کنم. و سپس آن را با
270
00:09:03,279 –> 00:09:06,959
فایل js جایگزین کنید، بنابراین اکنون اگر آن را ذخیره کنم
271
00:09:06,959 –> 00:09:10,399
و سپس به صفحه وب خود بازگردم،
272
00:09:10,399 –> 00:09:11,680
آن را بازخوانی کنید
273
00:09:11,680 –> 00:09:13,760
و سپس روی js کلیک کنید، باید
274
00:09:13,760 –> 00:09:14,959
موارد
275
00:09:14,959 –> 00:09:18,240
js را در اینجا مشاهده کنید و اگر روی cs کلیک
276
00:09:18,240 –> 00:09:19,920
کنم، می توانید آن سبک را ببینید. ورق بارگذاری
277
00:09:19,920 –> 00:09:21,279
278
00:09:21,279 –> 00:09:22,720
شد، کاری که میخواهم انجام دهم این
279
00:09:22,720 –> 00:09:25,120
است که روی نوار ناوبری
280
00:09:25,120 –> 00:09:28,720
که در صفحه فریلنسر بود کپی
281
00:09:28,720 –> 00:09:30,480
کنم و میخواهم آن را با برخی
282
00:09:30,480 –> 00:09:32,240
از مواردی که قبلاً داشتم پر کنم،
283
00:09:32,240 –> 00:09:34,720
بنابراین اجازه دهید به آن بازگردیم. html ایندکس
284
00:09:34,720 –> 00:09:35,680
و موضوع
285
00:09:35,680 –> 00:09:38,399
و اگر به بالا اسکرول کنیم همه چیز به
286
00:09:38,399 –> 00:09:40,560
خوبی برای ما توضیح داده شده است،
287
00:09:40,560 –> 00:09:43,200
بنابراین میتوانیم نوار ناوبری را
288
00:09:43,200 –> 00:09:44,880
در بالا در اینجا پیدا کنیم
289
00:09:44,880 –> 00:09:48,080
و آن را در آن کپی کنیم، بنابراین من
290
00:09:48,080 –> 00:09:50,560
به الگوهای خود برمیگردم و روی
291
00:09:50,560 –> 00:09:52,000
نوار ناوبری کلیک میکنم.
292
00:09:52,000 –> 00:09:53,760
و اکنون من فقط می خواهم چند
293
00:09:53,760 –> 00:09:55,120
فاصله را در اینجا قرار
294
00:09:55,120 –> 00:09:57,519
دهم و نوار ناوبری جدید خود را بچسبانم و سپس نظر بدهم
295
00:09:57,519 –> 00:09:58,240
296
00:09:58,240 –> 00:10:00,720
بنابراین اگر این را ذخیره کنم و آن را بهروزرسانی کنم، میتوانید
297
00:10:00,720 –> 00:10:01,760
298
00:10:01,760 –> 00:10:04,320
نوار ناوبری جدید را در بالا اینجا ببینید و
299
00:10:04,320 –> 00:10:06,079
این واقعاً خوب است زیرا واکنشگرا است،
300
00:10:06,079 –> 00:10:08,000
بنابراین لازم نیست نگران استایلی نباشیم
301
00:10:08,000 –> 00:10:08,800
302
00:10:08,800 –> 00:10:10,560
که فقط میخواهم آن را غیرفعال کنم. تصویری
303
00:10:10,560 –> 00:10:12,079
که قبلا ایجاد کردم تا مانع نشود
304
00:10:12,079 –> 00:10:12,560
305
00:10:12,560 –> 00:10:14,240
و من به html اصلی خود برمی گردم و
306
00:10:14,240 –> 00:10:15,680
307
00:10:15,680 –> 00:10:18,800
نوار ناوبری را زیر بدنه حرکت می دهم، بنابراین اگر
308
00:10:18,800 –> 00:10:21,440
به نوار ناوبر برگردم
309
00:10:21,440 –> 00:10:24,959
می توانید ببینید که چند مورد پیوندهای ناو به اینجا
310
00:10:24,959 –> 00:10:27,760
و آنها فقط به بخشهایی در صفحه اشاره میکنند
311
00:10:27,760 –> 00:10:28,959
312
00:10:28,959 –> 00:10:31,279
و من نمیخواهم این کار را انجام دهم، فقط میخواهم
313
00:10:31,279 –> 00:10:33,600
صفحات جداگانهای برای همه این
314
00:10:33,600 –> 00:10:35,839
موارد داشته باشم، بنابراین من فقط میخواهم آن را
315
00:10:35,839 –> 00:10:36,640
316
00:10:36,640 –> 00:10:39,680
با آدرسهایی که برای خود داشتم جایگزین کنم. نوار ناوبری قدیمی
317
00:10:39,680 –> 00:10:40,720
اینجاست،
318
00:10:40,720 –> 00:10:43,120
پس بیایید همه این
319
00:10:43,120 –> 00:10:45,040
متغیرها را که
320
00:10:45,040 –> 00:10:48,160
چند قسمت پیش ایجاد کردیم کپی کنیم
321
00:10:49,839 –> 00:10:52,000
و اکنون میتوانیم
322
00:10:52,000 –> 00:10:53,120
323
00:10:53,120 –> 00:10:56,000
324
00:10:57,920 –> 00:11:01,279
به جای خاکستری کردن پیوند، به آن متغیرها به جای تگهای بخش ارجاع دهیم
325
00:11:01,279 –> 00:11:03,279
و میدانید که مانند ما از شر تگ لنگر خلاص شوید.
326
00:11:03,279 –> 00:11:04,959
قبلاً با این
327
00:11:04,959 –> 00:11:07,440
عبارت if else انجام دادم من فقط می خواهم یک
328
00:11:07,440 –> 00:11:09,519
کلاس اضافی به
329
00:11:09,519 –> 00:11:12,320
این um اضافه کنم عنصر پیوند زیرا
330
00:11:12,320 –> 00:11:14,079
قبلاً تنظیم شده است تا با
331
00:11:14,079 –> 00:11:15,839
آن کلاس اضافی کار کند تا نشان دهد که
332
00:11:15,839 –> 00:11:18,640
فعال است، بنابراین تنها کاری که باید انجام دهم این است که فقط
333
00:11:18,640 –> 00:11:19,120
این
334
00:11:19,120 –> 00:11:23,200
عبارت if را کپی کنم و میخواهم
335
00:11:23,200 –> 00:11:26,240
بعد از این کلاسهای بارگذاری، آن را در اینجا قرار دهم تا
336
00:11:26,240 –> 00:11:28,000
اگر با css
337
00:11:28,000 –> 00:11:31,519
و html آشنا نیستم اینها همه کلاس های css هستند و
338
00:11:31,519 –> 00:11:35,200
هر کلاس با یک فاصله از هم جدا می شود،
339
00:11:35,200 –> 00:11:37,839
بنابراین من فقط یک فضای دیگر
340
00:11:37,839 –> 00:11:38,880
و یک
341
00:11:38,880 –> 00:11:42,320
تگ if و if را در اینجا اضافه می کنم و سپس در داخل این
342
00:11:42,320 –> 00:11:44,560
تگ می خواهم فعال بنویسم.
343
00:11:44,560 –> 00:11:46,320
344
00:11:46,320 –> 00:11:48,079
اگر مسیر درخواست برابر با URL ایندکس باشد، کلاس css فعال را اضافه می کند
345
00:11:48,079 –> 00:11:49,760
346
00:11:49,760 –> 00:11:52,880
و من فقط می توانم این را برای هر سه این
347
00:11:52,880 –> 00:11:57,839
348
00:11:59,120 –> 00:12:00,320
پیوندها کپی کنم و آخرین کاری که باید
349
00:12:00,320 –> 00:12:02,000
انجام دهم این است که فقط پیوند را تغییر دهم تا
350
00:12:02,000 –> 00:12:03,519
همه آنها مطابقت داشته باشند.
351
00:12:03,519 –> 00:12:06,000
بنابراین ما می گوییم خانه اولین پیوند خواهد بود
352
00:12:06,000 –> 00:12:08,240
زیرا صفحه فهرست را می خواهد
353
00:12:08,240 –> 00:12:10,320
و سپس درباره و تماس در واقع
354
00:12:10,320 –> 00:12:11,760
از قبل صحیح هستند بنابراین نیازی به
355
00:12:11,760 –> 00:12:12,880
تغییر آن ها نیست
356
00:12:12,880 –> 00:12:14,480
و سپس آخرین کاری که باید برای پیوندها انجام دهیم
357
00:12:14,480 –> 00:12:16,720
این است که مطمئن شویم که ما
358
00:12:16,720 –> 00:12:18,320
آن
359
00:12:18,320 –> 00:12:20,399
کدی را که پیوندها را فعال میکند، غیرفعال میکنیم
360
00:12:20,399 –> 00:12:22,639
361
00:12:22,639 –> 00:12:25,920
برای انجام این کار، میتوانم فقط
362
00:12:25,920 –> 00:12:28,959
به جاوا اسکریپت خود برای موضوع
363
00:12:28,959 –> 00:12:32,240
364
00:12:32,240 –> 00:12:33,360
365
00:12:33,360 –> 00:12:36,079
366
00:12:36,079 –> 00:12:36,480
367
00:12:36,480 –> 00:12:39,440
وارد شوم و اگر به نوار ناوبری نگاه کنید، این تگ را برای ناوبری اصلی دارد، بنابراین یک کتابخانه وجود دارد که در فایل scripps.js برای
368
00:12:39,440 –> 00:12:40,480
پیکربندی آن چیزها
369
00:12:40,480 –> 00:12:42,639
استفاده میشود. اسکرول جاسوس نامیده می شود، بنابراین به
370
00:12:42,639 –> 00:12:44,480
دنبال این تگ ها می گردد و سپس
371
00:12:44,480 –> 00:12:46,079
372
00:12:46,079 –> 00:12:48,000
هر زمان که روی یکی از آن ها پیمایش می کنید، عناصر لیست را در نوار ناوبر برجسته می کند،
373
00:12:48,000 –> 00:12:48,800
374
00:12:48,800 –> 00:12:50,399
زیرا من آن را نمی خواهم زیرا ما
375
00:12:50,399 –> 00:12:51,839
صفحه جداگانه ای برای همه چیز داریم، من فقط می
376
00:12:51,839 –> 00:12:53,760
خواهم این را غیرفعال کنم
377
00:12:53,760 –> 00:12:56,800
و اگر این برای شما گیجکننده است، میدانید که
378
00:12:56,800 –> 00:12:58,480
معمولاً کاری که من برای برخی از این
379
00:12:58,480 –> 00:13:00,399
تمها انجام میدهم این است که من فقط با گزینههای مختلف بازی میکنم
380
00:13:00,399 –> 00:13:03,040
و همانطور که چیزهایی در حال شکستن را میبینم
381
00:13:03,040 –> 00:13:05,040
، فقط به نوعی
382
00:13:05,040 –> 00:13:07,360
به کد تم نگاه میکنم و آنها را
383
00:13:07,360 –> 00:13:08,079
اصلاح میکنم.
384
00:13:08,079 –> 00:13:10,160
آزمون و خطا و کپی و
385
00:13:10,160 –> 00:13:11,680
چسباندن چیزهایی
386
00:13:11,680 –> 00:13:14,000
که اکنون تم برای پروژه شما کار می کند،
387
00:13:14,000 –> 00:13:15,200
اگر همه این موارد را از
388
00:13:15,200 –> 00:13:16,720
ابتدا می نویسید، مجبور نیستید این کار را انجام دهید، اما
389
00:13:16,720 –> 00:13:18,399
هک کردن این موارد با هم آسان تر است زیرا ما این کار را
390
00:13:18,399 –> 00:13:19,120
انجام
391
00:13:19,120 –> 00:13:21,760
نمی دهیم. واقعاً به m اهمیت نمی دهم
392
00:13:21,760 –> 00:13:23,279
css خودمان را اینجا میگیریم،
393
00:13:23,279 –> 00:13:25,519
بنابراین اگر این را بازخوانی کنم و به منوی خود نگاه
394
00:13:25,519 –> 00:13:26,560
کنم، میتوانید
395
00:13:26,560 –> 00:13:28,720
تمام صفحات را در اینجا ببینید، اگر واقعاً
396
00:13:28,720 –> 00:13:30,320
این را گسترش
397
00:13:30,320 –> 00:13:33,600
دهم و از طریق اینجا کلیک کنم، من را
398
00:13:33,600 –> 00:13:34,160
به
399
00:13:34,160 –> 00:13:36,480
هر صفحه جداگانه میبرد، بنابراین اگر میخواهید
400
00:13:36,480 –> 00:13:38,320
بررسی کنید عنصر و به پایین اسکرول کنید، خواهید
401
00:13:38,320 –> 00:13:40,079
دید که در واقع
402
00:13:40,079 –> 00:13:41,760
محتوایی را که قبلا داشتیم نمایش می دهد، اما
403
00:13:41,760 –> 00:13:43,839
فقط در پشت این نوار ناوبری پنهان شده است،
404
00:13:43,839 –> 00:13:46,560
بنابراین باید یک کلاس css ایجاد کنیم
405
00:13:46,560 –> 00:13:46,959
406
00:13:46,959 –> 00:13:49,440
تا همه چیز را به پایین تغییر دهیم تا
407
00:13:49,440 –> 00:13:50,240
بتوانید آن را ببینید
408
00:13:50,240 –> 00:13:51,920
و در پشت نوار ناوبری پنهان نیست،
409
00:13:51,920 –> 00:13:53,519
بنابراین من فقط میخواهم به این
410
00:13:53,519 –> 00:13:56,639
هدر بروم که در موضوع قدیمی بود
411
00:13:56,639 –> 00:13:58,880
و کلاسی به نام
412
00:13:58,880 –> 00:14:00,079
mass head وجود دارد
413
00:14:00,079 –> 00:14:02,800
که قبلاً برای ما به پایین منتقل شده است، اما
414
00:14:02,800 –> 00:14:04,639
ما فقط میخواهیم برخی از موارد را کپی کنیم. css برای
415
00:14:04,639 –> 00:14:07,199
این کلاس به طوری که مجبور نباشیم
416
00:14:07,199 –> 00:14:09,600
خودمان آن را بسازیم، بنابراین اگر
417
00:14:09,600 –> 00:14:11,920
وارد استایل ها شویم و فقط
418
00:14:11,920 –> 00:14:15,040
آن کلاس را جستجو کنیم، می بینیم
419
00:14:15,040 –> 00:14:17,440
که کلاسی با این padding top در اینجا وجود دارد و
420
00:14:17,440 –> 00:14:18,320
این
421
00:14:18,320 –> 00:14:19,920
اساساً همه چیز را به طور خودکار به پایین تغییر می دهد.
422
00:14:19,920 –> 00:14:22,399
برای شما، بنابراین یکی
423
00:14:22,399 –> 00:14:25,839
برای صفحه نمایش تلفن همراه وجود دارد اندازه و
424
00:14:25,839 –> 00:14:27,600
یکی برای اندازه صفحه دسکتاپ وجود دارد،
425
00:14:27,600 –> 00:14:29,920
بنابراین ما میتوانیم هر دوی اینها را کپی
426
00:14:29,920 –> 00:14:31,920
کنیم و باید آنها را
427
00:14:31,920 –> 00:14:35,680
در یک فایل css جدید قرار دهیم تا بتوانیم
428
00:14:35,680 –> 00:14:36,320
این پوشه
429
00:1