آموزش Sass از صفر تا صد با زبان ساده

Sass یکی از پیش پردازنده های قدرتمند برای زبان طراحی css است اما پیش پردازنده چیست و چرا باید آن را یاد گرفت ؟ زبان css اصلی ترین زبان برای طراحی صفحات وب سایت است و در حقیقت بیش از 90% نماهایی که در وب سایت ها مشاهده می کنید توسط این زبان اجرا می شوند ، بنابراین این زبان به تنهایی بار بزرگی را بر دوش دارد لذا می بایست برخی ابزارها به کمک این زبان برسند تا هم استفاده کننده از آن راحت باشد و هم اینکه انعطاف پروژه بالاتر باشد .

زبان css به تنهایی قدرت لازم برای طراحی صفحات وب را دارد اما اگر شخصی به تنهایی قصد داشته باشد تا از هسته اصلی این زبان استفاده کند باید کدهای زیادی را نگارش کند . برای مثال در قسمت ایجاد واکنشگرایی برای سایت جهت نمایش مناسب در دستگاه هایی همچون موبایل و تبلت ، css دستوراتی به نام media در اختیار طراحان قرار داده است که در صورت آشنایی با این دستورات میتوانند به راحتی وضعیت های مختلف سایت را کنترل کنند .

اما مطمئنا طراحی یک سیستم دقیق و بی نقص به تنهایی از عهده یک شخص خارج است و به همین خاطر تیم هایی بر روی نیاز های طراحان کار کرده و ابزارهای مناسبی را ارائه می کنند که ضمن سرعت بخشی به کدنویسی ، با جا افتادن در سراسر دنیا ، یک استاندارد سراسری نیز ایجاد شود . برای مثال جهت استاندارد سازی بخش واکنشگرایی ، فریمورک هایی همچون بوت استرپ ، چندین سال است که در حال بروز رسانی هستند و بخوبی نیاز کاربران را برطرف می کنند . بنابراین معقولانه است که هم جهت تسریع در کدنویسی و هم پیروی از استاندارد های همگانی ، ابزارهای اساسی را یادگرفت .

پیش پردازند Sass نیز یکی از ابزارهایی است که در قسمت طراحی و فرانت اند میتواند بسیار ابزار خوبی باشد . اما Sass یک تفاوت با سایر ابزار های کمکی در بخش طراحی دارد . زبان css ، زبان html و یا فریمورک بوت استرپ مستقیما در داخل هسته سایت اجرا شده و خروجی های مدنظر را نمایش میدهند . اما Sass یک پیش پردازنده است به این معنی که کدهای نوشته شده به این روش و در داخل فایل های Sass ، توسط یک کامپایلر به دستورات سی اس اس و فایل های سی اس اس تبدیل می شوند تا داخل سایت اجرا شوند . بنابراین دستورات و فایل های Sass به شکل مستقیم داخل سایت شما اجرا نمی شوند اما کمی موضوع را باز کنیم !

Sass چگونه کار می کند !

دستورات Sass داخل فایل هایی با فرمت Scss نوشته می شوند که دستورات نیز تماما به زبان سی اس اس هستند پس برای یادگیری Sass و درک دستورات آن باید تسلط مناسبی در آموزش css داشت . اما حالت کدنویسی در Sass کمی متفاوت است و میتوان دستورات را به نوعی نوشت که در آینده با حداقل تغییرات در داخل کدهای سی اس اس و همچنین Sass ، در کل پروژه تحولات اساسی ایجاد کرد . در حقیقت اولین هدف استفاده از Sass ایجاد انعطاف برا تغییرات آتی داخل پروژه است .

اما Sass تنها محدود به این گزینه نیست و ده ها ویژگی مختلف داخل این پیش پردازنده وجود دارد . کار با Sass در قدم اول ممکن است کمی مشکل به نظر برسد چرا که نمیتوان کدهای Sass را داخل فایل هایی با فرمت Scss نوشته و از آنها خروجی گرفت . فایل های Sass برای پروزه شما قابل شناسایی نیستند و باید دستورات داخل این فایل ها به دستورات سی اس اس و فایل هایی با فرمت css کامپایل شوند که برای این تبدیل نیز از برخی ابزارها در داخل سیستم استفاده خواهیم کرد که در این دوره تمامی این موارد را خدمت شما آموزش خواهیم داد .

Sass باعث خواهد شد تا کدهای شما به حداقل میزان خود برسند و انعطاف پروژه شما به شدت بالا باشد . برای اینکه از Sass استفاده کنید لازم است تا برخی ابزار ها در داخل سیستم شما نصب شود و اندکی نیز با ترمینال ویندور یا همان بخش cmd کار کنید که در این دوره تمامی این موارد را نیز برای شما آسان خواهیم کرد .

صحبت درباره Sass بسیار میتواند لذت بخش باشد و در بخش سرفصل های دوره نیز میتوانید بخش های تدریس شده را مطالعه فرمائید . در حالت کلی Sass برای فرانت اند کاران یک ابزار اساسی است گرچه با نبودن این ابزار نیز شما می توانید قالب های خود را طراحی کنید و شاید اینگونه فکر کنید که یادگیری آن تاثیری در سطح درآمد شما نخواهد داشت . اما باید گفت که هرچیزی برای درآمد یادگرفته نمی شود و گاها باید ابزارهایی را برای راحتی کار و مهم تر از همه استاندارد سازی پروژه و پاسخ به تقاضاهای کارفرما در پروژه یاد گرفت . Sass نیز یکی از همین ابزارها است که پس از یادگیری Sass خواهید دید تا چه اندازه به آن نیاز داشتید !