آموزش جاوا اسکریپت وانیلی: Ajax و Fetch

سرفصل ها و درس ها

مقدمه Introduction

• ایجاد و کار با درخواست API Creating and working with API requests

• محیط خود را تنظیم کنید Setting up your environment

1. شروع کار 1. Getting Started

• آژاکس چیست؟ What is Ajax?

• جریان برنامه ناهمزمان را درک کنید Understand asynchronous program flow

• یک کلید API دریافت کنید Get an API key

• تحقیق و ایجاد URL درخواست Ajax Research and create an Ajax request URL

• درخواست XHR ایجاد کنید Create an XHR request

• درخواست XHR را امتحان کنید Test an XHR request

• موفقیت و شکست XHR را کنترل کنید Handle XHR success and failure

• چالش: یک درخواست XHR بسازید Challenge: Build an XHR request

• راه حل: یک درخواست XHR بسازید Solution: Build an XHR request

2. اصلاح DOM 2. Modifying the DOM

• DOM چیست؟ What is the DOM?

• عناصر دارای JavaScript با وانیل را انتخاب کنید Select elements with vanilla JavaScript

• در پاسخ به یک رویداد داده را درخواست کنید Request data in response to an event

• شنونده رویداد را اضافه کنید Add an event listener

• با داده های JSON کار کنید Work with JSON data

• مقادیر فرم را با JavaScript وانیلی اصلاح کنید Modify form values with vanilla JavaScript

• محتوای عنصر را با JavaScript وانیلی تغییر دهید Modify element content with vanilla JavaScript

• چالش: DOM را اصلاح کنید Challenge: Modify the DOM

• راه حل: DOM را اصلاح کنید Solution: Modify the DOM

3. کار با API Fetch 3. Working with the Fetch API

• API Fetch را درک کنید Understand the Fetch API

• درخواست واکشی را ایجاد کنید Create a fetch request

• خطاهای اساسی واکشی را کنترل کنید Handle basic fetch errors

• درخواست واکشی را سفارشی کنید Customize a fetch request

4- بهینه سازی و عیب یابی درخواست های آژاکس 4. Optimizing and Troubleshooting Ajax Requests

• ساختار آژاکس درخواست عملکرد می کند Structure Ajax requests for performance

• مشاهده درخواست ها و پاسخ ها در مرورگر View requests and responses in the browser

• با خطاهای مجوز کار کنید Work with authorization errors

• با درخواست های نادرست کار کنید Work with malformed requests

• با خطاها در Fetch کار کنید Work with errors in Fetch

• خطاهای خطا ارائه دهید Provide error fallbacks

• چالش: درخواست آژاکس را برطرف کنید Challenge: Fix an Ajax request

• راه حل: درخواست آژاکس را برطرف کنید Solution: Fix an Ajax request

5- ساختن سرور پروکسی برای مخفی کردن کلیدهای API 5. Building a Proxy Server to Hide API Keys

• چرا سرورهای پروکسی ضروری هستند؟ Why are proxy servers necessary?

• ابزارها: Git ، GitHub و Heroku Tools: Git, GitHub, and Heroku

• برنامه ای را در Heroku تنظیم کنید Set up an app on Heroku

• گزینه های پروکسی را پیکربندی کنید Configure proxy options

• یک پروکسی را مستقر کرده و تست کنید Deploy and test a proxy

• امنیت پروکسی را پیکربندی کنید Configure proxy security

• چالش: سفارشی کردن کد برای یک پروکسی آژاکس Challenge: Customize code for an Ajax proxy

• راه حل: سفارشی کردن کد برای یک پروکسی آژاکس Solution: Customize code for an Ajax proxy

نتیجه Conclusion

• مراحل بعدی Next steps