دوره آموزشی یادگیری برنامه سازی با جاوا اسکریپت وانیلی
1 ساعت 45 دقیقهمتوسط2017-10-11
مدرسین

Sasha Vodnik
Principal Technical Course Developer at DocuSign
جزئیات دوره
کتابخانه های جاوا اسکریپت مانند jQuery و چارچوب هایی مانند React مزایای زیادی برای ارائه دارند، اما عملکرد می تواند یک معامله باشد. حذف jQuery و React می تواند سرعت سایت را بدون تأثیر بر تجربه کاربر بهبود بخشد. اما بسیاری از توسعه دهندگان هرگز کد معادل آن را در جاوا اسکریپت یاد نگرفته اند. این دوره به شما آموزش می دهد که چگونه ویژگی ها و عملکردهای مشابه را با جاوا اسکریپت vanilla برنامه ریزی کنید.
مربی ساشا ودنیک با یک برنامه ساخته شده با jQuery و React شروع می کند و قطعه به قطعه آن را با وانیل جاوا اسکریپت جایگزین می کند. وی وابستگی ها را حذف می کند و نشان می دهد که برنامه هنوز کار می کند و آزمایش های عملکردی را برای مقایسه کد شروع و پایان انجام می دهد. موضوعات شامل جایگزینی دستکاری DOM، جایگزینی Ajax، جایگزینی شنوندگان رویداد و جایگزینی انیمیشن های ساده مانند نمایش، مخفی کردن و تغییر حالت است. نتیجه نهایی یک برنامه جاوا اسکریپت خالص است که با مرورگرهای قبلی سازگار است و نیازی به کتابخانه ندارد!
اهداف یادگیری
جایگزینی درخواست های jQuery Ajax با درخواست های Fetch
انتخاب عناصر با جاوا اسکریپت وانیلی
افزودن شنوندگان رویداد با جاوا اسکریپت وانیلی
پیاده سازی صحافی داده ها
جایگزینی انیمیشن های ساده
اطمینان از سازگاری با گذشته
ترجمه جاوا اسکریپت وانیلی برای سازگاری بین مرورگرها
مربی ساشا ودنیک با یک برنامه ساخته شده با jQuery و React شروع می کند و قطعه به قطعه آن را با وانیل جاوا اسکریپت جایگزین می کند. وی وابستگی ها را حذف می کند و نشان می دهد که برنامه هنوز کار می کند و آزمایش های عملکردی را برای مقایسه کد شروع و پایان انجام می دهد. موضوعات شامل جایگزینی دستکاری DOM، جایگزینی Ajax، جایگزینی شنوندگان رویداد و جایگزینی انیمیشن های ساده مانند نمایش، مخفی کردن و تغییر حالت است. نتیجه نهایی یک برنامه جاوا اسکریپت خالص است که با مرورگرهای قبلی سازگار است و نیازی به کتابخانه ندارد!
اهداف یادگیری
جایگزینی درخواست های jQuery Ajax با درخواست های Fetch
انتخاب عناصر با جاوا اسکریپت وانیلی
افزودن شنوندگان رویداد با جاوا اسکریپت وانیلی
پیاده سازی صحافی داده ها
جایگزینی انیمیشن های ساده
اطمینان از سازگاری با گذشته
ترجمه جاوا اسکریپت وانیلی برای سازگاری بین مرورگرها
مهارت ها
JavaScriptOracleFront-End Web DevelopmentLearningWeb DevelopmentProgramming LanguagesSoftware Development
سرفصل ها
0. مقدمه
- 01 - خوش آمدید
- 02 - آنچه باید بدانید
- 03 - فایلهای تمرینی
1. مروری بر Vanilla JS
- 04 - کتابخانه ها , چارچوبها و جاوا اسکریپت وانیلی
- 05 - تعیین زمان جایگزینی چارچوبها و کتابخانه ها
2. بررسی اجمالی پروژه
- 06 - معماری برنامه
3. تنظیم محیط
- 07 - راهاندازی محیط
- 08 - دریافت کلید API شما
4. جایگزین Ajax کنید
- 09 - Fetch API
- 10 - یک درخواست Ajax با Fetch ایجاد کنید
5. عناصر DOM را انتخاب و اصلاح کنید
- 11 - انتخاب عنصر با جاوا اسکریپت وانیلی
- 12 - عناصر را با querySelector انتخاب و اصلاح کنید
- 13 - عناصر را با querySelectorAll انتخاب و اصلاح کنید
6. شنوندگان رویداد را جایگزین کنید
- 14 - رویدادهای جاوا اسکریپت
- 15 - شنوندگان رویداد را با جاوا اسکریپت وانیلی اضافه کنید
- 16 - با شی رویداد کار کنید
7. Data Binding را پیادهسازی کنید
- 17 - اتصال داده ها
- 18 - ایجاد عناصر با جاوا اسکریپت وانیلی
- 19 - با وانیلی جاوا اسکریپت ویژگیها را اضافه و اصلاح کنید
- 20 - عناصر را با جاوا اسکریپت وانیلی اضافه کنید
- 21 - الفبای قالب برای ساخت محتوای DOM
8. انیمیشنهای ساده را جایگزین کنید
- 22 - انیمیشن با جاوا اسکریپت وانیلی
- 23 - نمایش و پنهان کردن عناصر با استفاده از جاوا اسکریپت وانیلی
- 24 - ظاهر عنصر انتقال با استفاده از CSS
9. از سازگاری با عقب اطمینان حاصل کنید
- 25 - سازگاری به عقب برای جاوا اسکریپت وانیلی
- 26 - جاوا اسکریپت وانیلی Transpile
نتیجه
- 27 - مراحل بعدی
دوره های مرتبط
- دوره آموزشی چالشهای کدنویسی جاوااسکریپت: ساخت اپلیکیشنهای وب
- دوره آموزشی الگوهای JavaScript: راهحلهای مدرن برای چالشهای رایج
- دوره آموزشی جاوااسکریپت: ساخت ساختار داده لیستهای پیوندی
- دوره آموزشی جاوا اسکریپت: نقشه ها و مجموعه ها
- دوره آموزشی آرایه ها در جاوا اسکریپت
- دوره آموزشی یادگیری جاوااسکریپت: نوشتن کد مدرن با JavaScript ESNext
- دوره آموزشی یادگیری برنامهنویسی تابعی با جاوااسکریپت +ES6
- دوره آموزشی ساخت برنامههای تایپاسکریپت با JSDoc