دوره آموزشی استفاده از HTMX همراه با Thymeleaf در فریمورک Spring Boot
8 ساعت 38 دقیقهمتوسط2025-04-15
مدرسین

Michael D. Rodgers, Jr
Java Web Applications Engineer and Consultant
جزئیات دوره
اگه دوست داری اپلیکیشنهای وب داینامیک و جذاب بسازی، این دوره کامل و جامع بهترین راهنمای توئه برای یادگیری HTMX، Thymeleaf و Spring Boot. تو این دوره یاد میگیری چطور HTMX رو به راحتی تو پروژههای Spring Bootت ادغام کنی، قالبهای Thymeleaf رو بهتر کنی و درخواستهای AJAX رو سادهتر و کارآمدتر بسازی.
با یادگیری ترفندهای مختلف HTMX مثل تریگرها و مدیریت رویدادها، میتونی صفحات وب خیلی تعاملی و واکنشگرا بسازی که تجربه کاربری خیلی خوبی به بازدیدکنندهها میده. علاوه بر این، میفهمی چطوری با تغییر بخشهای مختلف DOM و استفاده از قابلیت «out-of-band swapping» عملکرد سایت رو بهینه کنی.
همچنین میتونی کنترل کامل روی دیده شدن یا رفتاری که عناصر صفحه دارن با استفاده از هدرهای درخواست و پاسخ HTMX داشته باشی و امنیت برنامهات رو با ادغام Spring Security تضمین کنی.
دوره بهت یاد میده چطور بهروزرسانیهای زنده و لحظهای با WebSocket و Server-Sent Events (SSE) تو اپلیکیشن Spring Bootت پیاده کنی و چطور با استفاده از اکستنشنهای قوی HTMX، قابلیتهای برنامهت رو افزایش بدی و عملکردش رو به سطح بالاتری برسونی.
اهداف یادگیری دوره (به زبان ساده و قابل فهم)
بفهمی HTMX چطور نسبت به روشهای دیگه تو ساخت اپلیکیشنهای وب داینامیک بهتر عمل میکنه و چطور قالبهای Thymeleaf و درخواستهای AJAX تو Spring Boot رو تقویت میکنه.
یاد بگیری چطور HTMX رو نصب کنی، تو پروژه Spring Bootت وارد کنی و با استفاده از تریگرها و مدیریت رویدادها صفحات تعاملی بسازی.
نحوه انجام عملیات swapping تو HTMX، دستکاری بخشهای مختلف DOM و استفاده از قابلیت out-of-band swapping رو یاد بگیری تا تجربه کاربری بهتری بسازی.
یاد بگیری چطور با هدرهای درخواست و پاسخ HTMX، کنترل روی نمایش و رفتار عناصر صفحه داشته باشی و HTMX رو با Spring Security تطبیق بدی.
نحوه توسعه و ادغام WebSocket و Server-Sent Events (SSE) برای بهروزرسانی زنده در اپلیکیشن Spring Boot رو یاد بگیری.
توانایی بررسی، دستهبندی و پیادهسازی اکستنشنهای قدرتمند HTMX برای ارتقاء عملکرد و قابلیتهای برنامه رو به دست بیاری.
با یادگیری ترفندهای مختلف HTMX مثل تریگرها و مدیریت رویدادها، میتونی صفحات وب خیلی تعاملی و واکنشگرا بسازی که تجربه کاربری خیلی خوبی به بازدیدکنندهها میده. علاوه بر این، میفهمی چطوری با تغییر بخشهای مختلف DOM و استفاده از قابلیت «out-of-band swapping» عملکرد سایت رو بهینه کنی.
همچنین میتونی کنترل کامل روی دیده شدن یا رفتاری که عناصر صفحه دارن با استفاده از هدرهای درخواست و پاسخ HTMX داشته باشی و امنیت برنامهات رو با ادغام Spring Security تضمین کنی.
دوره بهت یاد میده چطور بهروزرسانیهای زنده و لحظهای با WebSocket و Server-Sent Events (SSE) تو اپلیکیشن Spring Bootت پیاده کنی و چطور با استفاده از اکستنشنهای قوی HTMX، قابلیتهای برنامهت رو افزایش بدی و عملکردش رو به سطح بالاتری برسونی.
اهداف یادگیری دوره (به زبان ساده و قابل فهم)
بفهمی HTMX چطور نسبت به روشهای دیگه تو ساخت اپلیکیشنهای وب داینامیک بهتر عمل میکنه و چطور قالبهای Thymeleaf و درخواستهای AJAX تو Spring Boot رو تقویت میکنه.
یاد بگیری چطور HTMX رو نصب کنی، تو پروژه Spring Bootت وارد کنی و با استفاده از تریگرها و مدیریت رویدادها صفحات تعاملی بسازی.
نحوه انجام عملیات swapping تو HTMX، دستکاری بخشهای مختلف DOM و استفاده از قابلیت out-of-band swapping رو یاد بگیری تا تجربه کاربری بهتری بسازی.
یاد بگیری چطور با هدرهای درخواست و پاسخ HTMX، کنترل روی نمایش و رفتار عناصر صفحه داشته باشی و HTMX رو با Spring Security تطبیق بدی.
نحوه توسعه و ادغام WebSocket و Server-Sent Events (SSE) برای بهروزرسانی زنده در اپلیکیشن Spring Boot رو یاد بگیری.
توانایی بررسی، دستهبندی و پیادهسازی اکستنشنهای قدرتمند HTMX برای ارتقاء عملکرد و قابلیتهای برنامه رو به دست بیاری.
مهارت ها
Spring BootWeb Development ToolsWeb DevelopmentOpen SourceOne-Off
سرفصل ها
مقدمه
- HTMX for Spring Boot - توسعه دهنده Thymeleaf
- آنچه باید بدانید
شروع به کار با HTMX
- تجزیهوتحلیل چرا و زمان استفاده و عدم استفاده از HTMX
- مزایای استفاده از HTMX با Thymeleaf و Spring Boot
- منابع HTMX (htmx.org، Twitter، GitHub)
- نمای کلی پروژه
HTMX را در Spring Boot نصب و استفاده کنید
- HTMX را در پروژه Thymeleaf Spring Boot نصب و راهاندازی کنید
- پلاگین HTMX & Thymeleaf IntelliJ را ادغام و استفاده کنید
- اصول HTMX بدون دادههای JSON را درک کنید
- MPA خود را با HTMX به SPA تبدیل کنید
- HTMX را با Thymeleaf - hx-get و hx-target پیادهسازی کنید
- وقایع اولیه طبیعی و عوامل محرک را درک کنید
- از اصلاح کنندههای ماشه HTMX استفادهکنید - keyup، تغییر و زمان بندی
- از hx-trigger در هدر درخواست برای راهاندازی بار استفاده کنید
تسلط بر تعویض HTMX و ارتقاء پیشرونده
- استفاده از مبادله HTMX را یاد بگیرید
- بین مبادله HTML درونی و بیرونی تفاوت قائل شوید
- تصمیم بگیرید که چه زمانی از hx-swap - afterbegin و beforebegin استفاده کنید
- برای گوش دادن به رویدادهای hx-swap عملکرد hx-on را اجرا کنید
- hx-swap - قبل از پایان، پس از پایان، و حذف عناصر
- hx-swap را پیادهسازی کنید و از view transition API استفاده کنید
- استفاده از اصلاح کنندههای اسکرول hx-swap را یاد بگیرید
- افعال HTTP را با هایپر مدیا درک کنید
- hx-post و hx-delete را با Spring Security نشان دهید
- hx-patch و hx-put را با Spring Security نمایش دهید
بهینهسازی HTMX با مدیریت پاسخ پیشرفته و ادغام فنری بوت
- کنترل دید با استفاده از هدرهای درخواست HTMX
- تأثیر مرورگر با هدرهای پاسخ HTMX با HX-Trigger
- HX-Retarget را با استفاده از HttpServletResponse تنظیم کنید
- از HX-Reselect و HX-Reswap با HttpServletResponse استفاده کنید
- کتابخانه htmx-spring-boot را ادغام کرده و از آن استفاده کنید
- فیلتر فراخوانی روش با حاشیه نویسی HxRequest
- پردازندههای راحتی Thymeleaf برای ادغام HTMX
- از هدرهای پاسخ HTMX برای تنظیم هدرهای پاسخ HTMX استفاده کنید
- حاشیه نویسی سرصفحه پاسخ
افزایش تعامل با تعویض خارج از باند و تکنیکهای پیشرفته HTMX
- سایر مطالب را به طور همزمان به روز کنید
- تبادلات OOB و موقعیت رفتار را درک کنید
- تعویض OOB را روی دانش آموز با انیمیشن اجرا کنید
- تعویض OOB را روی دانش آموز با ویرایش ردیف اجرا کنید
- تعویض OOB را با Spring Boot 3.4.0 اجرا کنید
- تغییرات با Spring Boot و htmx-spring-boot-thymeleaf
- OOB با حذف ردیف با استفاده از Spring Boot 3.4.0 تعویض میشود
- رویدادها و عناصر گوش دادن را تحریک کنید
- تعویض OOB و OOB را با هم با استفاده از Thymeleaf انتخاب کنید
تکنیکها و پیشرفتهای پیشرفته سمت مشتری با HTMX
- با استفاده از hx-indicator برای ردیابی پیشرفت نشان دهید
- اشکال زدایی را برای رویدادهای HTMX روشن کنید
- تأییدیههای رابط کاربری HTMX را سفارشی کنید
- HTMX را با مدال بوت استرپ ادغام کنید
- اسکرول بی نهایت را پیادهسازی کنید
- جستجوی فعال را اجرا کنید
- کشیدن و رها کردن را با Sortable.js پیادهسازی کنید
ارتباط بلادرنگ با HTMX - سوکتهای وب و رویدادهای ارسال شده از سرور
- افزونههای HTMX و گزینههای موجود را کاوش کنید
- بررسی WebSockets و رویدادهای ارسال شده توسط سرور
- افزونه WebSocket را با قابلیت چت فعال کنید
نتیجه گیری
- HTMX با چکمه فنری و آویشن - مراحل بعدی