آموزش HTMX - راهنمای عملی

HTMX - The Practical Guide

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: یاد بگیرید که چگونه از کتابخانه HTMX برای گسترش HTML و نوشتن کدهای ساده و در عین حال قدرتمند استفاده کنید. گسترش HTML با استفاده از وب‌سایت و برنامه‌های وب HTMX Build بدون نوشتن کد JS پیچیده سمت کلاینت. اجازه دهید HTMX به درخواست‌های AJAX رسیدگی کند و بر روی رابط کاربری و منطق کسب‌وکار اصلی شما تمرکز کند در عوض پروژه‌های آزمایشی متعدد بسازید و در مورد همه ویژگی‌های کلیدی HTMX که باید بدانید، بیاموزید. HTMX به پروژه های فول استک موجود شما - مهم نیست از کدام زبان استفاده می کنید پیش نیازها: نیازی به دانش قبلی HTMX نیست! دانش اولیه توسعه وب مورد نیاز است دانش پایه جاوا اسکریپت به شما کمک می کند اما یک الزام سختگیرانه نیست

آیا از انتخاب کتابخانه JS مناسب از میان دریای وسیعی از کتابخانه ها خسته شده اید؟ و آیا گاهی اوقات احساس می‌کنید که کد توسعه JavaScript به‌طور غیرضروری پیچیده شده است؟

HTMX ممکن است راه حل مناسبی برای شما باشد!

زیرا HTMX یک کتابخانه جاوا اسکریپت شگفت انگیز است که به شما کمک می کند از نوشتن کد جاوا اسکریپت سمت سرویس گیرنده خودداری کنید!

این کتابخانه ای است که HTML را با افزودن ویژگی های جدید گسترش می دهد که می توانید از آنها برای اضافه کردن رفتار عنصر کنترل استفاده کنید. به طور خاص، HTMX کتابخانه ای است که فرآیند ارسال درخواست های AJAX و به روز رسانی DOM را بر اساس پاسخ ساده می کند.

اما در این دوره همه چیز را در مورد ویژگی های اصلی HTMX و همچنین مفاهیم پیشرفته HTMX که باید با جزئیات بدانید، یاد خواهید گرفت!

HTMX یک کتابخانه شگفت‌انگیز است که به شما امکان می‌دهد کدهای کارآمد سمت کلاینت بنویسید که من به سادگی مجبور شدم یک دوره آموزشی روی آن ایجاد کنم - حتی اگر در ابتدا قصد انجام آن را نداشتم!

بنابراین، در این دوره، تمام مفاهیم اصلی HTMX را به صورت گام به گام، بدون هیچ گونه دانش قبلی در مورد HTMX توضیح خواهم داد!

در جزئیات، یاد خواهید گرفت:

  • HTMX چگونه کار می کند

  • نحوه افزودن HTMX به وب سایت

  • نحوه استفاده از HTMX برای ارسال درخواست های AJAX HTTP

  • نحوه کنترل داده های درخواست

  • نحوه کنترل محل نمایش پاسخ

  • نحوه کنترل اینکه کدام قسمت از پاسخ ارائه شود

  • نحوه رسیدگی به پاسخ‌ها با چند عنصر محتوا

  • نحوه پیکربندی پاسخ‌های درخواست‌ها

  • نحوه ساخت برنامه های تک صفحه ای (SPA) با HTMX

  • و خیلی، خیلی بیشتر!

و با کار بر روی چندین پروژه آزمایشی که به شما امکان می‌دهد عمیق‌تر و عمیق‌تر در HTMX غواصی کنید، همه اینها را خواهید آموخت.

بنابراین، در پایان دوره، می‌توانید HTMX را به پروژه‌های وب بعدی خود اضافه کنید و از مزایای آن بهره ببرید!


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

شروع شدن Getting Started

  • خوش آمدی! Welcome!

  • HTMX چیست؟ و چرا از آن استفاده می کنید؟ What Is HTMX? And Why Would You Use It?

  • منابع دوره و جامعه Course Resources & Community

HTMX Essentials HTMX Essentials

  • معرفی ماژول Module Introduction

  • راه اندازی پروژه Project Setup

  • نصب HTMX Installing HTMX

  • استفاده از HTMX و ارسال درخواست های GET Using HTMX & Sending GET Requests

  • کنترل رندر محتوای پاسخ با hx-swap Controlling Response Content Rendering with hx-swap

  • Deep Dive: کجا و چگونه می توانید از HTMX استفاده کنید؟ Deep Dive: Where & How Can You Use HTMX?

  • تعریف هدف پاسخ با hx-target Defining Response Target with hx-target

  • تغییر ماشه درخواست با hx-trigger Changing the Request Trigger with hx-trigger

  • hx-trigger: تنظیمات پیشرفته hx-trigger: Advanced Settings

  • از GET تا POST با hx-post From GET to POST with hx-post

  • ارسال داده با HTMX Submitting Data with HTMX

  • رسیدگی به درخواست‌ها و پاسخ‌های POST با HTMX Handling POST Requests & Responses with HTMX

  • انتخاب بخش‌هایی از یک پاسخ با hx-select Picking Parts of a Response with hx-select

  • زمان برای تمرین! Time to Practice!

HTMX پیشرفته: فراتر از اصول Advanced HTMX: Beyond The Basics

  • معرفی ماژول Module Introduction

  • شروع پروژه Starting Project

  • ارسال درخواست های DELETE Sending DELETE Requests

  • اجتناب از مشکلات همگام سازی سرویس گیرنده-سرور Avoiding Client-Server Sync Issues

  • وراثت HTMX HTMX Inheritance

  • استفاده مجدد از قطعات HTML Reusing HTML Fragments

  • هدف گیری پیشرفته با hx-target Advanced Targeting with hx-target

  • درخواست تایید با hx-confirm Requesting Confirmation with hx-confirm

  • گوش دادن به رویدادها با hx-on Listening to Events with hx-on

  • مدیریت رویدادها با hx-on Handling Events with hx-on

  • کار با رویدادهای خاص HTMX Working with HTMX-specific Events

  • غیرفعال کردن عناصر در هنگام درخواست Disabling Elements During Requests

  • به بعد به یک پروژه جدید و ارسال یک درخواست پست بدون فرم Onwards To A New Project & Sending A POST Request Without A Form

  • اضافه کردن مقادیر درخواستی اضافی Adding Extra Request Values

  • برگرداندن یک قطعه لیست در پاسخ Returning a List Fragment in the Response

  • تنظیم ویژگی های HTMX به صورت پویا (روی سرور) Setting HTMX Attributes Dynamically (On The Server)

  • تنظیم پویا ویژگی های HTMX (در مشتری) Setting HTMX Attributes Dynamically (On The Client)

  • اجرای خارج از باند تعویض Performing Out Of Band Swaps

  • خارج از باند تعویض و حذف درخواست Out Of Band Swaps & Delete Requests

  • پیکربندی تعویض پیشرفته: پیمایش محتوا در نمای Advanced Swapping Configuration: Scrolling Content Into View

  • افزودن فایل‌ها و کدهای جاوا اسکریپت مجزا Adding Separate JavaScript Files & Code

  • به روز رسانی رابط کاربری بدون HTMX (با کد جاوا اسکریپت سفارشی) Updating The UI Without HTMX (With Custom JavaScript Code)

  • استفاده از داده های عنصر HTML با کمک HTMX Using HTML Element Data With Help Of HTMX

  • مدیریت رویدادهای پیش فرض با جاوا اسکریپت Handling Default Events With JavaScript

  • مکث و از سرگیری درخواست های HTMX Pausing & Resuming HTMX Requests

  • آماده سازی پروژه برای مراحل بعدی Preparing The Project For The Next Steps

  • بازبینی درخواست‌های HTMX و رسیدگی به رویداد Revisiting HTMX Requests & Event Handling

  • اجرای نظرسنجی Implementing Polling

  • پیکربندی HTMX در سطح جهانی Configuring HTMX Globally

  • کار با برنامه های افزودنی HTMX Working with HTMX Extensions

کار با درخواست ها و پاسخ های HTMX - مفاهیم پیشرفته Working with HTMX Requests & Responses - Advanced Concepts

  • معرفی ماژول Module Introduction

  • شروع پروژه Starting Project

  • گاهی اوقات، HTMX داده های مورد نیاز ما را ارسال نمی کند Sometimes, HTMX Doesn't Submit The Data We Need

  • کنترل داده های پیوست شده به درخواست خروجی با hx-params Controlling Attached Data to Outgoing Request with hx-params

  • اضافه کردن هدر به درخواست های خروجی Adding Headers to Outgoing Requests

  • پیاده سازی اعتبار سنجی فرم با HTMX Implementing Form Validation With HTMX

  • همگام سازی چندین درخواست Synchronizing Multiple Requests

  • راه اندازی "تغییر مسیرهای واقعی" Triggering "Real Redirects"

  • پاسخ‌های هدف‌گیری مجدد و پیکربندی مجدد مدیریت پاسخ Retargeting Responses & Reconfiguring Response Handling

  • رسیدگی به موارد چند پاسخ با یک پسوند ویژه Handling Multi-Response Cases With A Special Extension

ساخت اپلیکیشن های تک صفحه ای (SPA) با HTMX Building Single-Page-Applications (SPAs) With HTMX

  • معرفی ماژول Module Introduction

  • از اپلیکیشن چند صفحه ای (MPA) تا اپلیکیشن تک صفحه ای (SPA) From Multi-Page Application (MPA) to Single-Page-Application (SPA)

  • استفاده از ویژگی های HTMX برای واکشی و رندر کردن کل صفحات Using HTMX Attributes To Fetch & Render Entire Pages

  • به روز رسانی URL و ذخیره وضعیت صفحه قبلی Updating the URL & Saving Previous Page State

  • باز کردن قفل بهبود خودکار و پیشرونده با hx-boost Unlocking Automatic & Progressive Enhancement with hx-boost

  • تقویت فرم ها و درخواست های ارسال Boosting Forms & Post Requests

  • خلاصه Summary

جمع بندی Roundup

  • خلاصه دوره Course Roundup

نمایش نظرات

آموزش HTMX - راهنمای عملی
جزییات دوره
4 hours
65
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
1,714
4.8 از 5
ندارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Maximilian Schwarzmüller Maximilian Schwarzmüller

دارای گواهینامه AWS، توسعه دهنده وب و مدرس حرفه ای

Academind by Maximilian Schwarzmüller Academind by Maximilian Schwarzmüller

آموزش آنلاین