افزودنی های پیشنهادی من برای Visual Studio Code برای طراحان وب(قسمت 2)

سلام

توی قسمت قبل از تم ها، آیکون پک ها و افزودنی های HTML که استفاده می کنم رو معرفی کردم.

اما توی این پست میخوام افزودنی های CSS و PHP رو معرفی کنم.

CSS

css-auto-prefix

افزونه css-auto-prefix همونطور که از تصویرش هم پیداست، برای اکشن هایی که پیشوند هایی مثل -webkit- , -moz- و… رو دارن، میاد خودش بصورت خودکار برای همه پیشوند ها کد رو مینویسه و مقادیری که به اکشن میدید رو هم برای همه اکشن های دیگش هم اضافه میکنه.

اما مشکلی که این افزونه داره اینه که این اکشن های اضافه رو همیشه آخر محدوده سلکتور مینویسه و گاهی باعث مزاحمت میشه.

IntelliSense for CSS class names in HTML

این یکی مطمئن نبودم باید برای HTML باشه یا CSS ولی خب اینجا اسمش رو آوردم دیگه د: . کار IntelliSense for CSS class names in HTML اینه که میاد فایل های CSS که به فایل HTML شما لینک شده رو بررسی میکنه و کلاس ها و آیدی های مختلفی که توی فایل CSS ساختید رو ذخیره میکنه و وقتی میخواید به تگی کلاس یا آیدی بدید لیست که ذخیره کرده رو براتون نمایش میده که کارتون راحتتر باشه.

PHP

افزودنی های CSS من تموم شد! د:

و اما از شیرین ترین بخش این مقاله، PHP و WordPress د:

PHP DocBlocker

اگه برنامه نویس باشید احتمالا با DocBlocker آشنایی دارید. روشی استاندارد برای نوشتن کامنت برای متغییر ها، توابع، کلاس ها و… هست که از الگو خاصی پیروی میکنه. مثال:

12345678910<?php
/**
  * @example example1.php Counting in action.
  * @example http://example.com/example2.phps Counting in action by a 3rd party.
  * @example &quotMy Own Example.php&quot My counting.
  */
 function count()
 {
     <...>
 }

افزونه PHP DocBlocker برای نوشتن سریعتر این کامنت هست. شما با قرارا دادن /** بالای سر تابع، متغییر، کلاس یا… و زدن اینتر میبیند که الگو خاصی نوشته میشه که شما فقط باید توضیحات خودتون رو جایگزین کنید.

سایت phpDocumentor هم اگه فایلهاتون رو بهش بدید براتون یه راهنما میسازه که از همین DocBlocker استفاده می کنه.

Autocomplete WordPress Hooks

عبارت هوک(Hook) برای برنامه نویس های وردپرس خیلی آشناست. چون هر کاری توی وردپرس بخواید انجام بدید باید از یه Hook استفاده کنید. د:

البته به هوک ها API هم میگن. خب وردپرس تعداد زیادی هوک داره که به دو دسته اکشن و فیلتر تقسیم میشن. حفظ کردن این هوک ها کار بیهوده ای هست و معمولا وقتی یه چیزی نیاز داریم از حضرت گوگل استفاده می کنیم د:

اما خب بعضی از هوک ها از بس پر استفاده هستن دیگه حفظ میشن. افزونه Autocomplete WordPress Hooks میاد لیست این هوک ها رو به VSCode اضافه میکنه و وقتی میخواید از توابع add_action یا add_filter استفاده کنید، این لیست رو براتون نمایش میده(مثل تصویر).

WooCommerce – Snippets & autocomplete

اگه برنامه نویس وردپرس باشید میدونید که یکی از افزونه های محبوب وردپرس، ووکامرس هست. ووکامرس برای ساخت فروشگاه اینترنتی کاربرد داره.

این افزونه توابع ووکامرس به همراه توضیحاتشون رو به VSCode اضافه می کنه و کد نویسی برای ووکامرس رو خیلی راحتتر میکنه. این افزونه از فیلتر ها و اکشن های ووکامرس هم پشتیبانی میکنه.

WordPress Snippets

این افزونه هم نیازی به توضیح نداره و از عنوانش معلومه د:

با استفاده از WordPress Snippets می تونید توابع وردپرس رو به همراه توضیحات به ادیتور اضافه کنید. میشه گفت این افزونه ضروری ترین افزونه برای یه برنامه نویس وردپرس هست.

قسمت بعدی درباره چند افزونه عمومی رو معرفی میکنم و دیگه تمومه! د:

قسمت اول – تم ها، آیکون ها و افزونه های HTML

قسمت آخر – افزودنی های عمومی

خوش باشید د:

نویسنده مطلب: محمدجعفر خواجه

منبع مطلب