Thursday, May 27, 2010

Chrome Extensions for Web Development

The Chrome Developer Tools are great for debugging HTML, JavaScript and CSS in Chrome. If you're writing a webpage or even a web app for the Chrome Web Store, you can inspect elements in the DOM, debug live JavaScript, and edit CSS styles directly in the current page. Extensions can make Google Chrome an even better web development environment by providing additional features that you can easily access in your browser. To help developers like you, we created a page that features extensions for web development. We hope you’ll find them useful in creating applications and sites for the web.


For example, Speed Tracer is an extension to help you identify and fix performance issues in your web applications. With Speed Tracer, you can get a better idea of where time is being spent in your application and troubleshoot problems in JavaScript parsing and execution, CSS style, and more.


Another useful extension is the Resolution Test that changes the size of the browser window, so web developers can preview websites in different screen resolutions. It also includes a list of commonly used resolutions, as well as a custom option to input your own resolution.


With the Web Developer extension, you can access additional developer tools such as validation options, page resizing and a CSS elements viewer; all from an additional button in the toolbar.


Another extension you should check out is the Chrome Editor that allows you to easily code within your browser, so you don’t have to flip between your browser and code editor. You can also save a code reference locally to your computer for later use.

These are just a few of the extensions you can find in our extensions for web development page. You can also look for more in the extensions gallery.

16 comments:

  1. Wow! Thanks for the mention of Resolution Test!! I'm working on a new update at the moment as it happens, way more customisation is coming :)

    ReplyDelete
  2. This is Amazing!!! Thank you So much

    ReplyDelete
  3. Pendule is also a very nice tool if you want a light-weight tool instead of Web Developer.

    ReplyDelete
  4. I think I'll change from FF to Chrome... very nice tools, thx!

    ReplyDelete
  5. Why does every extension seem to need access to:
    Your data on all websites
    Your browsing history

    I can understand data, especially for extensions that manipulate the DOM, but why browsing history?

    ReplyDelete
  6. I was wondering the exact same thing as Dave.

    Isn't anyone else creeped out by those warning messages during extension installation? (@___@;)

    Although, I am finding that "MultiSwitch" plugin to be quite useful though. :) It's nice to be able to switch between dev and production pages with just a click! d-(^__^;)-b

    ReplyDelete
  7. It would also be useful have the plugins categorized a little better on the website. Browsing them is a pain the backside, since you have to go thru about 10 million social plugins that are a waste of time when you specifically need web dev tools.

    ReplyDelete
  8. Hi dear
    Thanks for sharing such a great information with us. This will really help us during the Web Development of an application..

    ReplyDelete
  9. Thanks a lot for sharing such valuable information which helps me alot in developing website. please do continue the same
    regards
    web design development

    ReplyDelete
  10. This comment has been removed by the author.

    ReplyDelete
  11. Online promotion and search engine optimization is the in thing in the speedy growing internet world. Get an online promotion service for your website through a leading search engine optimization company and your website will be ranking high with the desired keywords. Although, an SEO service provider who is also accountable will cost you heavens, but you will certainly not mind if you are blessed with thousands of visitors per day.Brochures Printing.

    ReplyDelete
  12. Thank you for sharing this information which is helpful for better Website Development environment.

    ReplyDelete
  13. Nice tips you have given on web development in concern with chrome extension for web development. Now i will subscribe to your RSS for future update

    ReplyDelete
  14. i really like this thing that with the Web Developer extension, we can access additional developer tools.thnx for this post

    ReplyDelete
  15. See also:

    PHP Console – Display PHP errors/debugs in Google Chrome console or by notification popups:
    https://chrome.google.com/extensions/detail/nfhmhhlpfleoednkpnnnkolmclajemef

    JavaScript Errors Notifier – Notify about JavaScript errors by icon in address bar:
    https://chrome.google.com/extensions/detail/jafmfknfnkoekkdocjiaipcnmkklaajd

    ReplyDelete
  16. Excellent and informative blog. Thanks for posting this. It’s informative and enlightening. Keep up the good work. Excellent and informative blog. Thanks for posting this. It’s informative and enlightening. Keep up the good work.

    ReplyDelete