ویژوال استدیو کد جزو محبوب‌ترین ویرایشگر‌های کد در دنیا به حساب می‌آید که در حال حاضر توسط صدها هزار توسعه‌دهنده مورد استفاده قرار می‌گیرد. یکی از دلایلی که باعث محبوبیت بسیار زیاد ویژوال استدیو کد شده است وجود قابلیت افزونه پذیری آن است که در نهایت منجر به آن می‌شود که ویژوال استدیو کد بتواند برای توسعه‌دهندگان بسیار زیادی قابل استفاده باشد.
در این مقاله قصد داریم در رابطه با ۱۰ افزونه صحبت کنیم که برنامه‌نویسان انگولار می‌توانند به خوبی از آن بهره‌گیری کنند.
افزونه اول: Path Intellisense
زمانی که روی یک پروژه کار می‌کنیم مجبور خواهیم بود که به صورت همزمان روی چندین فایل مختلف کار کرده و آن‌ها را مدیریت کنیم. بعضی اوقات واقعا کار روی این حجم از فایل‌های مختلف دشوار و مشکل است به همین دلیل بیشتر اوقات افکار برنامه‌نویس به جای صرف شدن روی خود موضوع برنامه‌نویسی روی مدیریت فایل‌ها صرف شده و در نتیجه نوشتن کدهای بهینه و مناسب در این شرایط بسیار سخت است چرا که مدام نیاز دارید که تمرکز خودتان را جمع کدنویسی کنید. نام‌گذاری کردن بخصوص برای فایل‌هایی که نیاز به چندین کلمه دارند نیز خود یکی دیگر از مشکلات است. برای حل این مشکل افزونه Path Intellisense ارائه شده است. این افزونه به ما کمک می‌کند تا به صورت خودکار برای فایل‌های‌مان پروسه نام‌گذاری را انجام دهیم. در صورتی که هر فایل مخفی شده‌ای نیز در ساختار پروژه‌تان وجود داشته باشد Path Intellisense می‌تواند آن‌ها را به شما نمایش دهد.
افزونه دوم: Angular Snippets
Angular Snippets یکی از مربوط‌ترین افزونه‌های ویژوال استدیو کد برای فریمورک Angular است. با استفاده از این افزونه می‌توانید از قطعه کدهای نوشته شده با استفاده از HTML و Typescript استفاده کنید. این قطعه کدها بصورت آماده در اختیار برنامه‌نویسان قرار گرفته و هدف آن تسریع فرایند کدنویسی توسط برنامه‌نویسان است. یکی از بهترین نکات این افزونه قابلیت فعال‌سازی بخش کلیدهای میانبر برای هر کدام از قطعه کدهاست.
افزونه سوم: Angular2-Switcher
این افزونه به ما کمک می‌کند تا بین فایل‌های HTML، ts و CSS مربوط به یک کامپوننت کاوش کرده و به سادگی نیز این کار را انجام دهیم. با استفاده از کلیدهای میانبری که این افزونه در اختیار ما قرار می‌دهد به سادگی می‌توانیم بین فایل‌ها کاوش کرده و مورد لازمه را انتخاب کنیم.
- برای سوئیچ کردن روی فایل‌های HTML از میانبر Alt+O استفاده کنید.
- برای سوئیچ کردن روی فایل‌های CSS از میانبر Alt+I استفاده کنید.
- برای سوئیچ کردن روی فایل‌های ts از میانبر Alt+U استفاده کنید.
افزونه چهارم: Angular Files
زمانی که کامپوننتی را در پروژه‌تان ایجاد می‌کنید، وظیفه این افزونه این است که یک boilerplate code را به تمام فایل‌های وابسته به کامپوننت تزریق کند. از این رو دیگر نیازی ندارید که برای تمام فایل‌های یک کامپوننت، قطعه کدهایی را از ابتدا بنویسید.
افزونه پنجم: REST Client
به عنوان یک توسعه‌دهنده فرانت-اند شما اغلب اوقات نیاز دارید که از یک API در سمت بک-اند برای استفاده کردن از داده‌ها از طریق درخواست HTTP استفاده کنید. در حال حاضر اغلب توسعه‌دهندگان از ابزارهایی مانند postman برای بررسی REST API استفاده می‌کنند اما نظرتان چیست که بدون نیاز به این ابزار و تنها بصورت مستقیم از طریق خود ویژوال استدیو کد کارها را پیش ببریم. افزونه REST Client دقیقا قصد دارد که چنین کمکی را به ما بکند. دیگر نیازی نیست که بین ابزارهای مختلف برای انجام چنین کاری سوئیچ بکنید.
افزونه ششم: JSON to TS
این افزونه در تبدیل کردن داده‌های JSON به رابط‌ها یا اینترفیس‌های تایپ‌اسکریپتی کمک می‌کنند. زمانی که از یک API استفاده می‌کنید و قصد دارید آن را به یک قطعه کد برنامه‌نویسی‌پذیر تبدیل کنید این افزونه می‌تواند به خوبی به شما کمک بکند.
افزونه هفتم: Angular Language Service
این افزونه یک افزونه تکمیلی برای پشتیبانی کامل از انگولار در ویرایشگر ویژوال استدیو کد است. شما با نصب کردن این افزونه می‌توانید از قابلیت‌هایی مانند تکمیل خودکار (Auto Completion)، Go to Definition، نکات سریع و... استفاده کنید. نصب کردن این افزونه را به تمام توسعه‌دهندگان انگولار توصیه می‌کنم.
افزونه هشتم: Angular2-Inline
این افزونه برای زمانی که از HTML و CSS در انگولار استفاده می‌کنید بسیار کاربردی است. Angular2-Inline قابلیت هایلایت بسیار دقیقی را ایجاد می‌کند که در نهایت باعث می‌شود تا بتوانید بهتر کدهای مختلف را مطالعه کرده و تمیز دادن آن‌ها از یکدیگر برای‌تان آسان شود. زمانی که قصد استفاده از یک تمپلیت درون خطی یا inline template یا inline styling را داشته باشید این افزونه به کارتان خواهد آمد.
افزونه نهم: TSLint
TSLint به شما در خواناتر نوشتن کدها، پایداری و حل کردن خطاهای مربوط به کدهای تایپ‌اسکریپت به شما کمک می‌کند. بعد از آنکه این افزونه را نصب کردید، به صورت مدام قطعه کدهای شما بررسی شده و در صورت وجود خطا و یا راهکاری بهتر برای انجام کاری آن را به شما هشدار می‌دهد. با هاور کردن ماوس روی خطاها شما می‌توانید اطلاعاتی در رابطه با اشتباه‌تان را مشاهده کنید.
افزونه دهم: Material Icon Theme
این افزونه را در پایان مانند یک پیشنهاد برای دوست داران متریال دیزاین در نظر گرفتیم. با استفاده از این افزونه می‌توانید شکل و رنگ آیکون‌های داخل ویرایشگرتان را به حالت متریال درآورده و از آن لذت ببرید.
در پایان
در این مطلب از وبسایت راکت ما شما را با ۱۰ افزونه کاربردی برای توسعه‌دهندگان انگولار آشنا کردیم. در صورتی که نیاز به یادگیری انگولار دارید به شما پیشنهاد می‌کنم که دوره آموزشی «آموزش انگولار» را مشاهده کنید.
دیدگاه و پرسش
در حال دریافت نظرات از سرور، لطفا منتظر بمانید
در حال دریافت نظرات از سرور، لطفا منتظر بمانید