Створіть остаточний профіль веб-розробки для Firefox

Якщо правильно налаштовано, Firefox може стати основним інструментом веб-розробки, що надає вам прямий доступ до сторінки, над якою ви працюєте, і ви можете створити сторінку в режимі реального часу, налагодити JavaScript або навіть відредагувати html.

Створіть окремий профіль для веб-розробки

Встановлення всіх цих інструментів розробки зробить Firefox дуже важким браузером, тому ми повинні спочатку створити новий профіль для Firefox.

Ви можете запустити окремий профіль одночасно з звичайним профілем, створивши новий ярлик з цими аргументами, замінивши WebDev на ім'я вашого профілю. Також є більш докладне пояснення того, як це зробити.

firefox.exe -P WebDev -не-віддалений

Тепер, коли у вас налаштований Firefox окремим профілем лише для веб-розробки, давайте подивимося на розширення, які ми можемо використовувати, щоб зробити Firefox основним інструментом веб-розробки.

Потрібно мати веб-розширення

Це всі розширення, які я регулярно використовую для веб-розробки.

Firebug

Firebug є найпотужнішим розширенням для налагодження javascript, перегляду CSS і html. Ви можете вносити динамічні зміни в код і CSS, і використовувати його для налагодження коду Ajax. Це дійсно найкраще розширення.

Розширення веб-розробника

Один з кращих розширень для х років запуску. Це обов'язково для будь-якого розробника, але ви вже чули про нього.

Розширення Aardvark

Це розширення є дуже легким розширенням, яке легко покаже вам елементи на сторінці та їх призначений клас / ідентифікатор. Це простіше використовувати, ніж розширення для веб-розробників для тих часів, коли вам просто потрібна швидка інформація про елемент. Ви також можете використовувати його для видалення елементів зі сторінки.

Colorzilla

Вибирайте кольори легко. Немає більше болю в пошуку кольорів, вбудованих десь у таблицю стилів.

Переглянути джерело з

Можна налаштувати декілька профілів джерел перегляду, щоб відкрити джерело в різних програмах.

HTML Validator

Це розширення дозволяє легко перевірити HTML-сторінку сторінки та встановити її на панель "Джерело перегляду".

Greasemonkey

Це не просто розширення для веб-розробників, але Greasemonkey є приголомшливою, не в останню чергу за можливість автоматизувати звичайно виконувані дії, що заощаджує час для веб-розробників.

Вимірюйте його

З легкістю вимірюйте відстань на екрані за допомогою цього розширення. Після вимірювання області можна перетягнути прямокутник навколо екрана, щоб використовувати його як порівняння.

Перегляд IE / IE Tab / OperaView / FirefoxView / Перегляд Safari / IE View Lite

Ці розширення (вибирайте) дозволяють легко переглядати поточну сторінку в різних веб-переглядачах. IE Tab навіть дозволить вам запустити IE всередині вкладки, якщо ви були так схильні.

Очистити кнопку кешу

Очищає кеш. Особливо корисно для перевірки нових змін CSS.

Перезапустіть Firefox

Розширення Restart Firefox є дуже корисним для закриття та перезапуску Firefox.

Tab Mix Plus

Розширення Tab Mix Plus є великим розширенням в цілому, але має декілька по суті корисних функцій для веб-розробників: Duplicate Tab і URL Copy Copy.

YSlow

Розширення YSlow - це нове розширення від Yahoo, яке буде аналізувати вашу сторінку та розповідати вам, де ви робите помилки. Це навіть дасть вам оцінку ефективності вашого сайту. Ви помітите, що в нижньому правому куті невеликий датчик ... він повідомляє вам загальний розмір сторінки, а також час завантаження. Дуже корисно розширення, але це вимагає розширення Firebug.

Манекен Lorem Ipsum

Розширення генератора Dummy Lipsum генеруватиме для вас фіктивний вміст на основі відомого тексту Lorem Ipsum, який дуже корисний для викладання фальшивого вмісту на вашому сайті.

Screengrab!

Розширення Screengrab дозволить вам робити скріншоти сторінок, але можете зробити щось, що неможливо зробити звичайним інструментом скріншоту - це може зайняти зображення всієї сторінки, а не лише видимої частини.

Є багато інших розширень, які можна використовувати, але це найкращі з кращих з усього, що я бачив. Якщо ви маєте інше розширення, яке ви регулярно використовуєте, залиште згадки в коментарях.

На даний момент, ви зараз перетворили Firefox на основний інструмент веб-розробки. Витратьте час, щоб дізнатися, як використовувати Firebug.