مرورگر گوگل کروم فعالیت خود را از سال 2008 شروع کرده است و در 10 سال اخیر توانسته خود را تبدیل به محبوب ترین مرورگر در بین تمام مرورگرهای وبِ در دسترس کند.
اگرچه کروم در اولین روزهای انتشار نتوانست محبوبیتی مثل اینترنت اکسپلورر (IE) را تجربه کند. (IE دارای بیش از 90٪ سهم بازار و Chrome 53.9٪) اما کم کم کسانی که حتی یکبار از اینترنت اکسپلورر استفاده کردند آن را کنار زده و به گوگل کروم پیوستند، زیرا سریع،ساده و از امکانات و افزونه هایی مانند پسوند ها و تم ها استفاده می کند.
به عنوان یک توسعه دهنده وب، می خواهید مطمئن شوید که آنچه شما طراحی کرده اید قادر به سازگاری با هر دستگاه یا مرورگری هست؟. برای شروع، گوگل کروم (مرورگر مورد استفاده بیشتر) باید در بالای لیستتان باشد. اما علاوه بر استفاده از Chrome به عنوان بخشی از تست شما، استفاده از ابزار (یا برنامه های افزودنی) که به طور خاص برای توسعه دهندگان وب ایجاد شده است می تواند مفید باشد.
در اینجا چند مورد از بهترین افزونه های Google Chrome برای توسعه دهندگان وب را بررسی و معرفی می کنیم.
General Tool: Web Developer
با بیش از یک میلیون کاربر و رتبه بندی 4.5 ستاره، می توان گفت که یکی از بهترین افزونه های گوگل کروم برای توسعه دهندگان وب است. این افزونه توسط Chris Pedrick توسعه یافته است، یک نوار ابزار کوچک با ابزارهای مختلف توسعه وب برای تصاویر، اطلاعات، تغییر اندازه، فرم ها و خیلی چیزهای دیگر …
Tech Stacks: Wappalyzer
ابزار توسعه یافته توسط Elbert Alias در سال 2009، Wappalyzer یک افزونه گوگل کروم است که به توسعه دهنده اجازه می دهد تکنولوژی های مختلفی را که در بدنه یک وب سایت تشکیل شده است شناسایی کند.
Wappalyzer یک ابزار منبع باز و متقابل است که قادر به تشخیص بیش از 1000 فن آوری، از جمله سیستم های مدیریت محتوا، سیستم عامل های تجارت الکترونیک، چارچوب وب، نرم افزار سرور، ابزار تجزیه و تحلیل و غیره است.
Responsive Design: Window Resizer
باید تشکر کنیم از گوگل که اولین اولویت را تلفن همراه قرار داده که برای توسعه دهندگان جهت تست وب سایت ها برای طراحی از اهمیت چندانی برخوردار است. این افزونه Google Chrome پنجره مرورگر را تغییر می دهد تا بتوانید طراحی مورد نظر خود را با توجه به پلت فرم های مختلف تست کنید. رایج ترین اندازه های صفحه نمایش در دسترس است (برای لپ تاپ، دسکتاپ و تلفن همراه)، شما همچنین می توانید اندازه پنجره ها را سفارشی کنید.
Page/Element Dimensions: Page Ruler
فریم ورک صفحه گوگل کروم یک خط کش در صفحه وب ارائه می دهد و به شما این امکان را می دهد عرض، ارتفاع و موقعیت (بالا، پایین، سمت چپ و راست) و هر عنصری که روی صفحه می خواهید را اندازه گیری کنید. شما می توانید لبه های خط کش را برای تغییر اندازه آن بکشید، یا از کلیدهای جهت دار برای حرکت یا تغییر اندازه آن استفاده کنید.
Wireframing: Instant Wireframe
ابزار Instant Wireframe به شما اجازه می دهد تا صفحات وب (محلی یا آنلاین) را در دیدگاه های مختلف مشاهده کنید، با قرار دادن یک پوشش سیمی در بالای آنها. این یک روش عالی برای تجزیه و تحلیل عناصر موجود در صفحه بصورت ساده است.
Code Snapshots: Marmoset
افزونه Marmoset Google Chrome امکان ایجاد عکس های زیبا از کدها را در عرض چند ثانیه می دهد. اگر چه در مقایسه با بعضی از گزینه های دیگر در این لیست ممکن است به نظر کمی عجیب و غریب باشد، اما برای ایجاد نمایه های گرافیکی از کار شما برای استفاده در رسانه های اجتماعی، در نمونه کارها و غیره مفید است.
Broken Links: Check My Links
این افزونه Google Chrome بطور دستی به مرتب سازی لینک های خراب و شکسته میپردازد.هم چنین این افزونه به طور خودکار به پیدا کردن تمام پیوندها در یک صفحه وب مشخص شده می پردازد و لینک های خراب و شکسته را بطور برجسته به شما نمایش میدهد.
Font Identification: WhatFont
افزونه WhatFont Google Chrome به توسعه دهندگان کمک می کند تا فونت های مورد استفاده در یک صفحه وب را به راحتی شناسایی کنند. پس از نصب، کاربران فقط با بردن ماوس بر روی فونت مورد نظر می توانند فونت را شناسایی کنند.
Color Picker: ColorZilla
با بیش از 5 میلیون دانلود و 1.3 میلیون کاربر، ColorZilla یکی از محبوب ترین افزونه های موجود در Google Chrome است. در اصل، این همان چیزی است که JustFont (یعنی برای رنگ) ذکر شده است – تمام کاری که باید انجام دهید این است که روی رنگ کلیک کنید تا یک کد رنگ ایجاد شود. ColorZilla دارای بسیاری از ابزارهای رنگی برای هر نیاز شماست، از جمله: eyedropper، جمع کننده رنگ، بیننده پالت و یک ژنراتور شیب.
Best Practices Audit: Web Developer Checklist
یکی از ابزارهای مفید برای توسعه دهندگان، Web Developer Checklist است که از طریق آن و مرورگر به بررسی وبسایت خود برای هر گونه نقص عمده، SEO، قابلیت استفاده، قابلیت دسترسی و عملکرد (سرعت صفحه)، می پردازد.
View Source Code: Code Cola
Code Cola به شما امکان می دهد کد منبع پروژه ای که در حال کار بر روی آن هستید را مشاهده کنید، در عین حال، به عنوان یک ویرایشگر CSS عمل کنید تا بتوانید به آسانی خواص CSS را ویرایش و به اشتراک بگذارید.
CSS Properties Viewer: CSSViewer
CSSViewer توسط Nicolas Huon ساخته شده است، CSS خواص ساده مرورگر است که توسعه دهنده وب می تواند چیزهایی از جمله فونت، متن، رنگ، پس زمینه، بردر، موقعیت، و ویژگی های اثر بخش را تغییر دهد و با کمک ماوس به آن سر بزند.
Check JSON Code: JSONView
افزونه JSONView Google Chrome به توسعه دهندگان اجازه می دهد تا به جای اینکه اسناد در مرورگر وب را به صورت متن دانلود و یا کپی کنند،میتوانند شبیه به فایل های XML مشاهده کنند.
Google Analytics Debugger
این افزونه Google Chrome اطلاعات مفیدی در مورد کنسول جاوا اسکریپت را با فعال کردن نسخه اشکال زدایی جاوا اسکریپت Google Analytics فراهم می کند. پیغام های حاصل شامل پیام های خطا و هشدارهایی است که می تواند به شما بگوید که کد ردیابی تجزیه و تحلیل شما اشتباه تنظیم شده است.
Managing MySQL Databases: MySQL Admin
این افزونه Google Chrome شما را برای مدیریت پایگاه داده MySQL آسان تر می کند. این افزونه برای شما رابط کاربری GUI سرور MySQL، مشابه phpMyAdmin، Sequel Pro را فراهم می کند.
ویژگی های مدیریت MySQL عبارتند از:
• اتصال به MySQL سرور (4.1 یا بالاتر)، اتصال به سرور MySQL با SSL، اتصال به سرور MySQL از طریق ارسال SSH2 پورت
• نمایش آمار و لیست پروسس سرور متصل (به طور خودکار به روز رسانی)، لیست جدول و ردیف جدول انتخاب شده
• ایجاد و رها کردن جداول، اضافه کردن و به روز رسانی ردیف
• انتقال پایگاه داده
PHP Debugging: Clockwork
Clockwork مجموعه ای از ابزارهای مفید برای توسعه دهندگان PHP را فراهم می کند. این پانل جدید تمام اطلاعات مورد نیاز برای اشکال زدایی و پروفیل اسکریپتهای PHP، از جمله اطلاعات درخواست، ورود به سیستم، نمایش اطلاعات پایگاه داده، مسیرها و تجسم برنامه زمان اجرا، فراهم می کند.
Clockwork از یک طرف سمت سرور استفاده می کند که تمام داده های مرتبط را جمع آوری می کند و به راحتی با هر پروژه PHP ادغام می شود. این شامل پشتیبانی از برنامه های Laravel، Slim 2 و CodeIgniter 2.1 است.
PHP Debugging: XDebug Helper
این افزونه Google Chrome به جای مبارزه با متغیرهای POST / GET یا کوکی ها، با اشکال زدایی، پروفایل کردن و ردیابی کد PHP به شما کمک می کند.
بهترین افزونه های گوگل کروم برای توسعه دهندگان وب
گوگل کروم در حال حاضر به دلیل سرعت، سادگی، انعطاف پذیری و در دسترس بودن و ابزارهایی که شامل پسوند ها و تم ها هستند، مرورگر ترجیحی برای اکثر کاربران اینترنت است. توسعه دهندگان کروم نیز بخشی از کار خود را برای ارائه ابزار برای توسعه دهندگان وب، از ابزارهای اصلی و عمومی طراحی و توسعه به ابزارهای خاصی برای HTML، PHP، CSS و غیره انجام داده اند.
