illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید تا کنون 6337 نفر در 14 دوره آموزشی سون لرن ثبت نام کرده اند !

Code Guide یا راهنمای کدنویسی HTML و CSS (جلسه آخر) : آموزش کار با editorconfig

0 183 ۱۱ آذر ۹۵

در این مطلب با ادامه راهنمای کدنویسی HTML و CSS در خدمتتون هستم.code guide

در جلسه قبل در مورد Class names یا نامگذاری کلاسها و Selectors یا انتخابگرها، نکاتی رو بیان کردیم. در این جلسه قصد داریم نکات دیگه رو در اختیارتون قرار بدیم. این جلسه آخرین قسمت از این دوره هست و در اینجا در مورد ابزار EditorConfig صحبت میکنیم. تا حالا شده یک کد رو درون یک ادیتور بنویسید و به دلیلی اون رو در محیط و ادیتور دیگه ای باز کنید و همه چیز اون فرق داشته باشه؟ مثلا indentation اونا با هم فرق داره و استایل کدها شبیه به قبل نیست.consistent-editing-with-editorconfig

ابزار EditorConfig به توسعه دهندگان کمک میکنه که استایل کدی رو که مدنظرشون هست برای همه ادیتورها و IDE ها اعمال بشه و در همه جا با یک استایل سروکار داشته باشن. برای استفاده از این ابزار باید یک فایل رو درست کنید و استایلهای مورد نظرتون رو درون اون قرار بدین. بعد از اون باید پلاگینی رو برای ادیتور مورد نظر نصب کنید تا قواعد موجود درون اون فایل رو بخونه و بر روی کدهای پروژتون اعمال کنه. با اینکار در همه جاهایی که پلاگین رو نصب کردید و اون فایل تنظیمات قرار داره، کدها به یک صورت و با یک استایل نمایش داده میشن. این ابزار در بیشتر ابزارهایی که بصورت OpenSource درون Github قرار دارن استفاده میشه. مثلا میتونین قواعد مربوط به Bootstrap رو در اینجا ببینید.

ابزارهای زیر از EditorConfig بصورت پیش فرض پشتیبانی میکنن و نیاز به نصب افزونه و پلاگین ندارند:editorconfig

اما ادیتورها و IDE های زیر نیاز به نصب پلاگین برای پشتیبانی از این ابزار دارند:editorconfig 2

نحوه کار این فایل تقریبا شبیه به htaccess هست. برای مثال اگر شما بخاید یک استایل قرار بدین که برای همه فایلهای و فولدرهای درون پروژتون اعمال بشه، باید یک فایل بنام .editorconfig بسازید و قواعد مربوطه رو درون اون قرار بدین. اگر خواستید یک فولدر قواعد متفاوتی داشته باشه، میتونین درون اون پوشه هم یک فایل .editorconfig دیگه بسازید و کدهای مربوطه رو بازنویسی کنید. زمانی که درون ادیتورتون یک فایل مثلا html رو باز میکنید، پلاگین EditorConfig بدنبال یک فایل بنام .editorconfig درون پوشه فعلی میگرده. اگر چنین فایلی رو پیدا نکرد یک پوشه بالاتر میره و همینجور ادامه میده تا به یک فایل .editorconfig برسه و اگر درون اون خطی با کد root = true قرار داشت، همونجا متوقف میشه و کدهای اون رو اعمال میکنه.

برای ساختن فایلی بنام .editorconfig درون windows احتمالا به مشکل بر خواهید خورد. پس پیشنهاد ما اینه که اول یک فایل متنی رو بسازید و اون rename کنید. بجای گذاشتن مقدار .editorconfig، عبارت .editorconfig. رو قرار بدین و اینتر بزنید. میبینید که در اینجا یک . به انتهای نام اضافه کردیم و با اینکار درون ویندوز هم به راحتی میتونیم این فایل رو بسازیم.

این ابزار ویژگی های زیادی رو داره و میتونین لیست کامل اونا رو در اینجا ببینید. همه ویژگی ها درون همه Editor ها پشتیبانی نمیشه. ویژگی های متدوالی که استفاده میشه بصورت زیر هست:

  • root : ویژگی خاصی هست که باید برای فایلی که قصد داریم اعمال بشه قرار بدیم. با true قرار دادن این ویژگی باعث میشیم زمانی که پلاگین EditorConfig به این فایل رسید، متوقف بشه و جستجو رو به دایرکتوری های بالاتر ادامه نده و همین قواعد رو اعمال کنه.
  • indent_style : این ویژگی دو مقدار tab و space رو قبول میکنه. اگر tab رو قرار بدین برای تورفتگی از تب استفاده میکنه و اگر space قرار بدین برای تورفتگی از space یا فضای خالی استفاده میکنه. با قرار دادن tab از hard tabs استفاده میشه و اگر space رو انتخاب کنید، soft tabs استفاده میشه.
  • indent_size : با استفاده از این ویژگی میتونین مقدار تورفتگی رو مشخص کنید. مثلا اگر مقدار بالا رو برابر با space قرار داده باشید و در اینجا عدد 2 رو قرار بدین، باعث میشه که تورفتگی برابر با 2 فضای خالی باشه.
  • end_of_line : مقادیر lf و cr و crlf رو برای کنترل شکستن خطوط و رفتن به خط بعد رو مشخص میکنه.
  • charset : میتونین با استفاده از این ویژگی Encoding فایل ها رو مشخص کنید
  • trim_trailing_whitespace : اگر این ویژگی رو true قرار بدین باعث میشه که فاصله های خالی که در خط قبل و قبل از کاراکتر newline قرار داره حذف بشه.
  • insert_final_newline : اگر این ویژگی رو برابر با true قرار بدیم، مطمئن میشیم که زمانی که فایل رو save میکنیم و میبندیم، یک newline یا خط جدید در آخر اون اضافه میشه. این مورد بیشتر برای Source Code Management ها مثل Github کاربرد داره.

استایلی که CodeGuide پیشنهاد کرده که درون .editorconfig قرار بدیم، بصورت زیر هست:

بهمین راحتی.

برای مطالعه بیشتر در این زمینه میتونین به سایت اصلی این ابزار مراجعه کنید.

این جلسه آخرین جلسه این دوره بود و امیدوارم که بدردتون خورده باشه و چیزهایی هرچند اندکی رو یاد گرفته باشید.

موفق و پیروز باشید.

یا علی

Source

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها اولین دیدگاه این مطلب را ارسال کنید.

ارسال دیدگاه

ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

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

ورود به سایت

ورود سریع با :
در حال اتصال ...

جستجو در سون لرن

عبارت :
7LearnTelegram