یک شروع خیلی سریع - Thymeleaf

بدون مقدمه بریم سر اصل مطلب. برای استفاده از تایم‌لیف در spring boot کافیه وابستگی اون رو داخل بیلدسیستم خودتونون چه maven و چه gradle قرار بدید. اما اصلا چرا باید اینکار رو بکنید :/ تایم‌لیف چه ویژگی داره که بتونه شمارو قانع به اینکار بکنه :تایم‌لیف برای دفاع از خودش اول به شما میگه که من یک Natural Template هستم. اما این یعنی چی؟تصور کنید در یک سناریو معمولی و متداول به ما یک صفحه ‌Html دادن مثل این صفحه و به ما گفته شده اون رو داینامیک کنیم و اطلاعات صفحه رو از دیتابیس بخونیم. خب اگر حواسمون نباشه (که دیگه معمولا هست ولی حالا فرض محال) و بدون اینکه پسوند فایل رو به JSP تغییر بدیم شروع به کد زدن کنیم نتیجه شبیه تصویر پایین میشه اما در ‌Thymeleaf نیازی به این کار نیست و پسوند فایل همون ‌html هست که از فرانت کارتون تحویل گرفتید. شاید بنظرتون این ویژگی پیش‌پا افتاده بیاد ولی باید بگم داستان به اینجا ختم نمیشه!یکی از رسالت‌های زیبای این ‌ Template engine اینه که قراره تعامل شما با فرانت کارتون رو بهبود ببخشه.یکی از راه‌های بهتر کردن رابطه دونفر که باهم تقابل دارن همیشه کاهش ارتباطشون و جلوگیری از رودرویی اونهاست :) (چه شخصی چه کاری ! ) بنابراین تایم‌لیف قراره جلوی تقابل شما با فرانت‌کار رو بگیره به این شکل که شما مطلقا و تاکید میکنم مطلقا نیازی به دست بردن در ساختار کدهای Html ندارید!!!خب پس چجوری اون رو داینامیک میکنیم؟جواب اینه که با Attribute هایی که تایم‌لیف در اختیار ما گذاشته و با این کار دیگه به ‌Body تگ‌ها دست نمیزنیم و مقادیر مثالی‌ای که فرانت کار گذاشته‌هم میذاریم باشه و نیازی به حذفشون نیست که جلوتر میگم چرا.بیاید یه مثال بزنیم مثلا یک تگ ساده در نظربگیرید :<p>Hello World!!!</p>حالا برای داینامیک کردن اون کافیه بگیم :<p th:text = &quot${varName}&quot > Hello World!!! </p>در مثال بالا varName اسم attribute‌ای هست که احتمالا در کنترلر تعریف کردید اگر پیدا نشه به هر دلیلی مقدار پیش فرض نشون داده میشه. نکته اینه که مقدار پیش‌فرضی که از طرف بک‌اند درنظر دارید هم باید در ‌th:text قراربگیره و body تگ قلمرو فرانت‌اند کار باقی میمونه :).تایم‌لیف به ازای هر یک از attribute های معمولی html یک معادل با پسوند th دارد که بشه اون رو داینامیک کردمثال<a href=&quot#&quot th:href=&quot@{\folan}&quot>test</a>اما نگران نباشید راه دررو هم داره که البته پیشنهاد نمیشه اما میدونیم همیشه ما وقت رعایت اصول رو نداریم مثلا برای نمایش متغییرها هرکجای صفحه میتونید اینجوری عمل کنید[[ ${varName} ]]چیزی که میخواستم جلوتر بگم اینه که اگر اصول رو رعایت کنید اتفاق جذابی که میوفته اینه که وقتی Html هارو بصورت offline و بدون وب‌سرور هم که باز کنید کاراکترهای عجیب نمیبینید و حتی ممکنه اونها رو بدرستی و با همون استایل‌ها ببینید که البته احتمالش کمه اما ویژگی‌‌های اجرای ‌‌offline وجود داره و با یکم وقت گذاشتن کاملا میتونید اینکار رو بکیند.اگر تا اینجا قانع شدید که اون رو به پروژه اضافه کنید باید بگم بعد از اضافه کردن Html های خودتون رو در مسیر/resources/templatesبذارید و اونهارو فقط با نام و بدون پسوند از کنترلر خودتون صدابزنید.دوتا دستور کاربردی دیگه میگم و ختم جلسه :شرط گذاشتن برای نمایش یک تگ :<div th:if=&quot${varBoolean}&quot> <div>Welcome, Guest</div> </div>بجای varBoolean همونجور که حدس میزنید میشه شرط هم گذاشت .ایجاد حلقه برای تکرار تگ‌ها :<div th:each = &quotcontact : ${contacts} &quot> <h3 th:text= &quot ${contact.name} &quot ></h3> </div>در آخر بگم که برای بهتر شدن پیشنهادهایی که ‌IDE میخواد بده و درکل شناختن ویژگی های ‌th باید برای تگ html صفحه‌ای که روش کار میکند namespace تعریف کنید که بدونه این th ها چی هستن و از کجا میان. این کار مطلقا برای تفسیر template مشکلی درست نخواهد کرد اما برای شما هنگام توسعه ممکنه مشکل ساز باشه. تعریف namespace به همین راحتی انجام میشه:<html xmlns:th = &quothttp://www.thymeleaf.org&quot>امیدوارم که تونسته باشم بهتون کمک کنم خوشحال میشم توی صفحه توئیترم باهم بیشتر معاشرت کنیم ممنون که وقت گذاشتید