ثبت‌نام دوره🔸متخصص اتوماسیون با N8N🔸سون‌لرن شروع شد 🔥🤖 مشاهده دوره ←
۰ ثانیه
۰ دقیقه
۰ ساعت
۰ امیر حق شناس
خلاصه مطالب جلسه هفتم - ماژولار کردن فایل‌های html در pug
جامعه Html & CSS ایجاد شده در ۲۷ آبان ۱۴۰۴

در این جلسه یاد گرفتیم که چگونه با استفاده از قابلیت include در Pug فایل‌های تکراری (مثل header، footer و …) را جدا کرده و آن‌ها را در صفحات مختلف استفاده کنیم. این روش باعث کاهش تکرار کد و افزایش نظم و نگهداری آسان‌تر پروژه می‌شود.


🔹 مفهوم ماژولار کردن

یعنی فایل‌های HTML را به بخش‌های کوچک‌تر تقسیم کنیم:

  • Header (هدر سایت)
  • Footer (پایان صفحه)
  • Navigation (منو)
  • فرم‌ها یا بخش‌های قابل استفاده مجدد

سپس در فایل اصلی آنها را فقط صدا بزنیم.


📌 دستور include در Pug

 

include مسیر/فایل

مثال ارائه شده:

 

include ../includes/header.pug

🔍 با این دستور، محتوای داخل فایل header.pug دقیقاً در همین بخش جایگزین می‌شود.


📒 نکات کلیدی جلسه

✔️ برای ماژولار کردن صفحات باید فایل‌های جداگانه بسازی (مثلاً: header.pug, footer.pug, nav.pug).
✔️ دستور include فقط محتوا را وارد می‌کند، بدون امکان ارسال داده (برخلاف extends یا mixin).
✔️ مسیر فایل باید نسبی (Relative) باشد.
✔️ می‌توان هر نوع کدی (HTML، شرط، حلقه و…) داخل فایل include قرار داد.
✔️ استفاده از include باعث افزایش سرعت کدنویسی و نگهداری پروژه می‌شود.


🧠 یادآوری

  • اگر چند فایل مختلف از یک بخش مثل هدر استفاده می‌کنند → از include استفاده کن.
  • اگر خواستی ساختار صفحه (layout) را تعریف کنی → جلسه بعدی احتمالاً extends و block خواهد بود.