5 ms·

Ask HN: What chrome/Firefox extensions/devtools do you use for web development?

18 points by mmq 14y ago

jwoah12 14y ago
Pure Chrome dev tools and Firefox/Firebug. Maybe it's a case of not realizing I need something because I don't know about it yet, but they seem to work fine for me.
jrajav 14y ago
One upcoming feature that I'm very excited for is Workspaces in Chrome dev tools: https://plus.google.com/+GoogleChromeDevelopers/posts/644qQuBKZeL https://plus.google.com/+GoogleChromeDevelopers/posts/644qQu... It will allow developers to set local folders as first-class source folders so that they can be navigated and modified just like normal sources pulled over the network, with the added benefit that you can also save your changes back to the files. This still doesn't make it as suitable for development as, say, Sublime Text, but it's a big step in that direction. Now if only you could script it, we'd be golden! As far as extensions go, the only one I use on Chrome is Advanced Rest Client, and it works very well for what it does: https://chrome.google.com/webstore/detail/advanced-rest-client/hgmloofddffdnphfgcellkdfbfbjeloo https://chrome.google.com/webstore/detail/advanced-rest-clie... On Firefox, Firebug is still invaluable, don't work without it: http://getfirebug.com/ http://getfirebug.com/
FajitaNachos 14y ago
I just posted a link a few above yours to a Chrome extension I wrote called hotfix. It lets you push changes from Chrome Dev Tools to GitHub https://chrome.google.com/webstore/detail/hotfix/bfmckmhcljhakgkngnfjhmmffaabdafi?hl=en https://chrome.google.com/webstore/detail/hotfix/bfmckmhcljh...
nekgrim 14y ago
Firefox : - Firebug : http://getfirebug.com/ http://getfirebug.com/ - Live HTTP Headers : http://livehttpheaders.mozdev.org/ http://livehttpheaders.mozdev.org/ - User Agent Switcher : http://chrispederick.com/work/user-agent-switcher/ http://chrispederick.com/work/user-agent-switcher/
tharshan09 14y ago
After I started using chrome for my main development and debugging, I have never needed any extensions.
pdrummond 14y ago
Dev HTTP Client: http://goo.gl/BhFb9 http://goo.gl/BhFb9
sangupta 14y ago
IE: Firebug Lite, Firefox: Firebug, Chrome: Nothing Google PageSpeed and Yahoo YSlow! JSONFormatter and XMLFormatter for Chrome Advanced REST Client and Secure Shell for Chrome
gknoy 14y ago
My coworkers and I really like JSONView [1]. It pretty-prints JSON, which makes it much easier to visually inspect and explore the results of RPC calls for our web apps. One extremely useful feature is the ability to fold nested elements, which really helps to get a big picture of something's structure. 1: https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=en https://chrome.google.com/webstore/detail/jsonview/chklaanhf...
- kibwen 14y ago
  Indeed, and available for Firefox as well: http://jsonview.com/ http://jsonview.com/
  - simlevesque 14y ago
    The newer versions of Firefox have a JSON viewer stock.
dsmithn 14y ago
SQLite Manager for FireFox
weirdcat 14y ago
Basics: Firebug https://addons.mozilla.org/en-us/firefox/addon/firebug/ YSlow https://addons.mozilla.org/en-us/firefox/addon/yslow/ CSS Helpers: CSS Reloader https://addons.mozilla.org/en-us/firefox/addon/css-reloader/ Firepicker https://addons.mozilla.org/en-us/firefox/addon/firepicker/ FireDiff https://addons.mozilla.org/en-us/firefox/addon/firediff/ Proxy/HTTP: Tamper Data https://addons.mozilla.org/en-us/firefox/addon/tamper-data/ FoxyProxy https://addons.mozilla.org/en-us/firefox/addon/foxyproxy-standard/ Charles Proxy (has an autoconfigure add-on) http://www.charlesproxy.com/ Database: SQLite Manager https://addons.mozilla.org/en-us/firefox/addon/sqlite-manager/
minhajuddin 14y ago
Angularjs Batarang when building angularjs apps. Gives access to the $scope easily: https://chrome.google.com/webstore/detail/angularjs-batarang/ighdmehidhipcmcojjgiloacoafjmpfk?hl=en https://chrome.google.com/webstore/detail/angularjs-batarang...
corentino 14y ago
If you do some mobile website, Ripple Emulator is the one I use : https://chrome.google.com/webstore/detail/ripple-emulator-beta/geelfhphabnejjhdalkjhgipohgpdnoc https://chrome.google.com/webstore/detail/ripple-emulator-be...
rajivtiru 14y ago
I use Chrome JSON Viewer - Readable JSON REST Console Web Developer - SO MANY OPTIONS One [unintended] feature I really like is when I have saved passwords for certain sites and I dont actually remember what the password is. Web Developer has a convert form type javascript injection to let you see the password. Easily abusable, but yeah...
mootothemax 14y ago
Hasher. Not only does it perform all kinds of hashing, but it also converts unix timestamps, numbers between bases, a bunch of string conversions AND some URL friendly conversions as well. Other than the developer toolbar, it's the tool I use the most: https://chrome.google.com/webstore/detail/hasher/kignjplbjlocolcfldfhbonmbblpfbjb https://chrome.google.com/webstore/detail/hasher/kignjplbjlo...
jameswyse 14y ago
Chrome already has most of the stuff I need built in, but I also use: - JSON Viewer - https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=en https://chrome.google.com/webstore/detail/jsonview/chklaanhf... - Hasher - https://chrome.google.com/webstore/detail/hasher/kignjplbjlocolcfldfhbonmbblpfbjb https://chrome.google.com/webstore/detail/hasher/kignjplbjlo... - LiveReload (combined with my node.js server) - https://chrome.google.com/webstore/detail/jnihajbhpnppcggbcgedagnkighmdlei https://chrome.google.com/webstore/detail/jnihajbhpnppcggbcg... - AngularJS Batarang - https://chrome.google.com/webstore/detail/angularjs-batarang/ighdmehidhipcmcojjgiloacoafjmpfk?hl=en https://chrome.google.com/webstore/detail/angularjs-batarang... - Screen Capture - https://chrome.google.com/webstore/detail/cpngackimfmofbokmjmljamhdncknpmg https://chrome.google.com/webstore/detail/cpngackimfmofbokmj... - Pendule - https://chrome.google.com/webstore/detail/pendule/gbkffbkamcejhkcaocmkdeiiccpmjfdi https://chrome.google.com/webstore/detail/pendule/gbkffbkamc... Though I might replace Pendule as I only ever use it to find the current window dimensions and there must be a better extension for that out there.

18 points by mmq 14y ago

Pure Chrome dev tools and Firefox/Firebug. Maybe it's a case of not realizing I need something because I don't know about it yet, but they seem to work fine for me.

jrajav 14y ago

One upcoming feature that I'm very excited for is Workspaces in Chrome dev tools: https://plus.google.com/+GoogleChromeDevelopers/posts/644qQuBKZeL https://plus.google.com/+GoogleChromeDevelopers/posts/644qQu... It will allow developers to set local folders as first-class source folders so that they can be navigated and modified just like normal sources pulled over the network, with the added benefit that you can also save your changes back to the files. This still doesn't make it as suitable for development as, say, Sublime Text, but it's a big step in that direction. Now if only you could script it, we'd be golden! As far as extensions go, the only one I use on Chrome is Advanced Rest Client, and it works very well for what it does: https://chrome.google.com/webstore/detail/advanced-rest-client/hgmloofddffdnphfgcellkdfbfbjeloo https://chrome.google.com/webstore/detail/advanced-rest-clie... On Firefox, Firebug is still invaluable, don't work without it: http://getfirebug.com/ http://getfirebug.com/

FajitaNachos 14y ago

I just posted a link a few above yours to a Chrome extension I wrote called hotfix. It lets you push changes from Chrome Dev Tools to GitHub https://chrome.google.com/webstore/detail/hotfix/bfmckmhcljhakgkngnfjhmmffaabdafi?hl=en https://chrome.google.com/webstore/detail/hotfix/bfmckmhcljh...

nekgrim 14y ago

Firefox : - Firebug : http://getfirebug.com/ http://getfirebug.com/ - Live HTTP Headers : http://livehttpheaders.mozdev.org/ http://livehttpheaders.mozdev.org/ - User Agent Switcher : http://chrispederick.com/work/user-agent-switcher/ http://chrispederick.com/work/user-agent-switcher/

tharshan09 14y ago

After I started using chrome for my main development and debugging, I have never needed any extensions.

pdrummond 14y ago

Dev HTTP Client: http://goo.gl/BhFb9 http://goo.gl/BhFb9

sangupta 14y ago

IE: Firebug Lite, Firefox: Firebug, Chrome: Nothing Google PageSpeed and Yahoo YSlow! JSONFormatter and XMLFormatter for Chrome Advanced REST Client and Secure Shell for Chrome

gknoy 14y ago

My coworkers and I really like JSONView [1]. It pretty-prints JSON, which makes it much easier to visually inspect and explore the results of RPC calls for our web apps. One extremely useful feature is the ability to fold nested elements, which really helps to get a big picture of something's structure. 1: https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=en https://chrome.google.com/webstore/detail/jsonview/chklaanhf...

kibwen 14y ago
Indeed, and available for Firefox as well: http://jsonview.com/ http://jsonview.com/
- simlevesque 14y ago
  The newer versions of Firefox have a JSON viewer stock.

dsmithn 14y ago

SQLite Manager for FireFox

weirdcat 14y ago

Basics: Firebug https://addons.mozilla.org/en-us/firefox/addon/firebug/ YSlow https://addons.mozilla.org/en-us/firefox/addon/yslow/ CSS Helpers: CSS Reloader https://addons.mozilla.org/en-us/firefox/addon/css-reloader/ Firepicker https://addons.mozilla.org/en-us/firefox/addon/firepicker/ FireDiff https://addons.mozilla.org/en-us/firefox/addon/firediff/ Proxy/HTTP: Tamper Data https://addons.mozilla.org/en-us/firefox/addon/tamper-data/ FoxyProxy https://addons.mozilla.org/en-us/firefox/addon/foxyproxy-standard/ Charles Proxy (has an autoconfigure add-on) http://www.charlesproxy.com/ Database: SQLite Manager https://addons.mozilla.org/en-us/firefox/addon/sqlite-manager/

minhajuddin 14y ago

Angularjs Batarang when building angularjs apps. Gives access to the $scope easily: https://chrome.google.com/webstore/detail/angularjs-batarang/ighdmehidhipcmcojjgiloacoafjmpfk?hl=en https://chrome.google.com/webstore/detail/angularjs-batarang...

corentino 14y ago

If you do some mobile website, Ripple Emulator is the one I use : https://chrome.google.com/webstore/detail/ripple-emulator-beta/geelfhphabnejjhdalkjhgipohgpdnoc https://chrome.google.com/webstore/detail/ripple-emulator-be...

rajivtiru 14y ago

I use Chrome JSON Viewer - Readable JSON REST Console Web Developer - SO MANY OPTIONS One [unintended] feature I really like is when I have saved passwords for certain sites and I dont actually remember what the password is. Web Developer has a convert form type javascript injection to let you see the password. Easily abusable, but yeah...

mootothemax 14y ago

Hasher. Not only does it perform all kinds of hashing, but it also converts unix timestamps, numbers between bases, a bunch of string conversions AND some URL friendly conversions as well. Other than the developer toolbar, it's the tool I use the most: https://chrome.google.com/webstore/detail/hasher/kignjplbjlocolcfldfhbonmbblpfbjb https://chrome.google.com/webstore/detail/hasher/kignjplbjlo...

jameswyse 14y ago

Chrome already has most of the stuff I need built in, but I also use: - JSON Viewer - https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc?hl=en https://chrome.google.com/webstore/detail/jsonview/chklaanhf... - Hasher - https://chrome.google.com/webstore/detail/hasher/kignjplbjlocolcfldfhbonmbblpfbjb https://chrome.google.com/webstore/detail/hasher/kignjplbjlo... - LiveReload (combined with my node.js server) - https://chrome.google.com/webstore/detail/jnihajbhpnppcggbcgedagnkighmdlei https://chrome.google.com/webstore/detail/jnihajbhpnppcggbcg... - AngularJS Batarang - https://chrome.google.com/webstore/detail/angularjs-batarang/ighdmehidhipcmcojjgiloacoafjmpfk?hl=en https://chrome.google.com/webstore/detail/angularjs-batarang... - Screen Capture - https://chrome.google.com/webstore/detail/cpngackimfmofbokmjmljamhdncknpmg https://chrome.google.com/webstore/detail/cpngackimfmofbokmj... - Pendule - https://chrome.google.com/webstore/detail/pendule/gbkffbkamcejhkcaocmkdeiiccpmjfdi https://chrome.google.com/webstore/detail/pendule/gbkffbkamc... Though I might replace Pendule as I only ever use it to find the current window dimensions and there must be a better extension for that out there.