توضیحات پیشنهادی نظرات اشتراک
تبلیغات

SASS چیست؟ چه کاربردی دارد؟ و چگونه از آن استفاده کنیم؟

SASS چیست؟ چه کاربردی دارد؟ و چگونه از آن استفاده کنیم؟

SASS چیست؟
چه کاربردی دارد؟ و چگونه از آن استفاده کنیم؟


SASS، مخفف Syntactically Awesome Style Sheets می‌باشد؛ که یک زبان پیش پردازنده‌ی CSS یا CSS Preprocessor Language به حساب می‌آید. SASS اساسا یک روش توسعه یافته از کدنویسی در CSS همراه با سینتکس به حساب می‌آید.
تعدادی از تصورات غلط از SASS، برای افرادی که اصلا از آن استفاده نکرده‌اند وجود دارد؛ یکی از آن تصورات غلط این است که آیا SASS جایگزین CSS می باشد؟!
در پاسخ به این سوال باید گفت خیر ، جواب منفی است؛ SASS جایگزین CSS نمی‌باشد؛ بلکه یک روش برای کوتاه‌تر نویسی CSS است که در نهایت بعد از کامپایل شدن، به همان CSS تبدیل می‌شود.

تبدیل SASS به CSS

برداشت اشتباهی که خیلی از افراد از SASS دارند، این است که پس از اتمام کار، می‌بایست فایل‌ها (SASS،SCSS) مستقیما بر روی سرور قرار بگیرند تا مرورگر آن‌ها را بخواند!

متاسفانه این برداشت غلط می‌باشد و شما بعد از اتمام کار، می‌بایست برای خوانده شدن توسط مرورگرها، آن فایل‌ها را به CSS تبدیل کنید. به این صورت که شما باید به روش لوکال کد نویسی خود را انجام دهید و بعد از کامپایل آن، خروجی CSS را بر روی سرور قرار دهید.


برای کامپایل یا تبدیل SASS به CSS می‌توانید با استفاده از Ruby و نصب SASS روی آن و یا نرم افزارهایی همچون Prepros این کار را به صورت لحظه به لحظه و یا به یکباره انجام داد. در این مورد، می‌توانید به پست “آموزش استفاده از SASS بر روی Intellij IDEA” (به‌زودی) نیز مراجعه کنید.

چرا باید از SASS استفاده کرد؟!

اگر شما با برنامه نویسان کامپیوتری در مورد کدنویسی front-end صحبت کرده باشید، آن‌ها به شما گفته‌اند که HTML و CSS، زبان احمقانه ایست؛ چون کدهای آن از پیش تعریف شده است و بارها و بارها تکرار می شود؛ حقیقت این است که آن‌ها در این مورد نصف شما حق دارند.

زبان‌های برنامه‌نویسی همچون C++ دارای یک مفهوم رایج به نام DRY یا (Don’t Repeat Yourself) مواجه هستند و نمی‌توانند همچون طراحان front-end کدهای زیادی را کپی کنند. آن ها با مفاهیم ساختی همچون تعریف توابع و … رو به رو هستند.

اما این دلیل نمی‌شود که شما در برابر دوستان برنامه‌نویس خود سرخورده شوید؛ اینجاست که SASS به کار می‌آید.

شما می‌توانید با استفاده از سینتکس‌ها و نوشتن توابع، سرعت و قدرت خود را در کدنویسی front-end افزایش دهید و هم به دوستان برنامه نویس خود بگویید که کدنویسی front-end، آن‌چنان که فکر می‌کنند بد نیست.


SASS، امکان استفاده از متغیرها (Variables)، دستورات تودرتو (Nesting)، وارد کردن قطعه کدها (Partial Imports)، گروه‌بندی کدها (Mixins)، وراثت (Inheritance) و عملگرها (Operators) را در کدهای Css را فراهم می‌کند. کدهای SASS در نهایت کامپایل و به Css تبدیل می‌شوند.

خودت تکرار نکن DRY!

خودت تکرار نکن (Don’t Repeat Yourself)، اصلی در برنامه‌نویسی و به معنای عدم تکرار یک یا چند خط کد در قسمت‌های مختلف برنامه است. برنامه‌نویس‌ها برای ایجاد امکان استفاده مجدد از یک تکه کد، آن را در قالب تابع یا کلاس تعریف می‌کنند و در صورت نیاز، تابع مورد نظر فراخوانی و یا شی جدیدی از کلاس تعریف می‌شود.

در صورت رعایت اصل DRY تغییر در یک جزء از برنامه، نیازی به تغییر در قسمت‌های دیگر کد ندارد؛ در نتیجه رفع ایرادهای برنامه و توسعه دادن آن، بسیار ساده‌تر می‌شود.

یکی از مشکلات Html و Css، نداشتن امکان استفاده از اصل DRY است که منجر به تعریف پی‌درپی کدهای تکراری و هم‌چنین، دشوار بودن تغییر و توسعه‌ی کد می‌شود. استفاده از SASS می‌تواند این مشکل را حل و ساختاری قانون‌مند برای کدهای CSS شما ایجاد کند!


منبع: برگرفته از سایت cms و beyamooz

کانال تلگرام فول کده

درباره نویسنده

هادی اکبرزاده

[ مدیر فول کده ]

علاقه‌مند به اشتراک‌گذاری اطلاعات در هر زمینه‌ای
برنامه‌نویس فول استک

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

نظرات ثبت شده بدون دیدگاه