Sass چیست؟
تا حالا شده به وب سایتی سر بزنید و برای یک لحظه فکر کنید کاش شما هم همچین وب سایتی داشتید؟ اگر این حس را تجربه کرده اید پیشنهاد میکنم روی این لینک را کلیک نمایید.
Sass مخفف کلمات Syntactically Awesome Stylesheets است. Sass را می توان به عنوان یک افزونه برای css در نظر گرفت که کار با استایل ها را برای ما بسیار ساده می کند. به خصوص زمانی که فایل های css شما بسیار بزرگ و پیچیده باشند. Sass مدیریت و نگهداری استایل های css را سادهتر میکند. به لطف وجود متغیرها، mixins ها، nesting ها و وراثت در این پیش پردازنده، کد های نوشته شده کاملاً سازماندهی می شود.
این کار باعث می شود کار خود را سریعتر پیش ببریم. به خاطر داشته باشید زمانی که در Sass کدهای خود را مینویسیم، مرورگر ها نمی توانند این کدها را درک کنند و دلیل این عدم درک هم این است که کدهای نوشته شده به زبان css نیستند.
پس ما به یک کامپایلر نیاز داریم تا کد های نوشته شده در Sass را به css تبدیل کنیم. نرم افزار های زیادی برای این کار وجود دارند که بعضی از آنها عبارتند از :
با این حال ما قصد نداریم در این مقاله همه مراحل نصب و کامپایل Sass را بیان کنیم. اگر میخواهید تجربه بیشتری در این مورد به دست آورید، به شما پیشنهاد می کنم از یک ویرایشگر آنلاین همچون Codepad استفاده کنید. با این کار نیاز ندارید نرم افزارهای مربوطه را بر روی کامپیوتر خود نصب کنید.
به صورت خلاصه باید بگویم Sass یک پیش پردازنده برای زبان css است. پیش پردازنده ها به ما کمک می کنند از ویژگی های منحصر به فردی در css استفاده کنیم. یک پیش پردازنده زبانی اسکریپتی بوده که به توسعه دهندگان اجازه می دهد کدها را به آن زبان نوشته و سپس به صورت css از آن خروجی بگیرند.
اگر شما در css مبتدی هستید پیشنهاد می کنم فعلا از رفتن به سراغ پیش پردازنده ها صرف نظر کنید.
چیزی که برای ورود به این دنیای جذاب نیاز دارید این است که درک کاملی از موارد پایه ای و کدهای css داشته باشید. Sass یکی از محبوبترین پیش پردازنده های css است اما Sass تنها پیش پردازنده موجود نیست. موارد دیگری نیز مانند Less و Stylus وجود دارند.
مزایای Sass
از آن جایی که این Framework با زبان CSS کاملا سازگار میباشد بنابراین مزایای بسیاری را در اختیار کاربران خود قرار میدهد. پردازشگر SASS که یک زبان پیش پردازنده میباشد برای ایجاد کدهای CSS بهتری به کار میرود برخی افراد تصور میکنند که این پردازشگر جایگزین زبان CSS خواهد بود اما این تصور کاملا اشتباه است و این پردازشگر به هیچ عنوان نمیتواند جایگزین زبان CSS باشد چرا که کارایی آن فقط برای بهتر پیش بردن کدهای CSS میباشد. Framework SASS ا با استفاده از برخی دستورات میتواند امکانات CSS را بیش@تر برای کاربران خود نمایش دهد که عبارتند از:
• Extend
با استفاده از وراثت یا Extend که یکی از ویژگی های SASS میباشد میتوانید از محتوای یک Class در یک Class دیگر استفاده نمایید.
• Partial
شما میتوانید فایلهای SASS خود را به فایلهای کوچکی تقسیم بندی کنید Partials دارای فایلهای کوچکی میباشند که میتوان در دیگر فایلها مورد استفاده قرار داد با استفاده از این ویژگی میتوانید به عیب یابی کد نویسی خود کمک کنید.
• Modules
شما میتوانید با استفاده از قانون @ فایل های sass جزئی را ایجاد نمایید که دارای قطعه های کمی از css میباشند. از این فایل های کوچک میتوانید در فایل های SASS دیگری نیز استفاده نمایید.
• Mixin
در برخی اوقات نوشتن موارد در CSS به خصوص با CSS3 کمی خسته کننده می باشد که یکی دیگر از مزیتهای استفاده از sass ویژگی Mixin بوده که به ساده کردن کدهای پیچیده و خسته کننده کمک میکند.
• Operators
یکی دیگر از ویژگیهای خوبی که sass در اختیار کاربران خود قرار داده است انجام محاسبات، در css میباشد از آن جایی که انجام محاسبات در برنامه نویسی بسیار مهم می باشد با استفاده از این ویژگی میتوانید به محاسبات بهتری در CSS بیانجامید.
• Dry
یکی از مشکلاتی که در زبانهای html و CSS وجود دارد این است که کدهای تکراری زیادی اجرا میشود و منجر به سردرگمی برنامه نویسان و متخصصین میشود که با استفاده از SASS میتوان به تکرار کد نویسی در قسمت های مختلف ویرایشگر، جلوگیری به عمل آید.
تفاوت LESS و SASS