Personal Development for Smart People^TM Forums

tobyhede · 01-29-2007, 10:17 PM

I do web dev for a living, so thought I'd share a couple of things I have found recently that are proving invaluable.

FireBug.
If you do ANY type of web-dev you MUST HAVE THIS. Absolutely incredible. HTML, CSS, JavaScript debugging, AJAX request tracking ... the list goes on and on. It's changed my life.

Selenium
Selenium is a test framework that allows you to record tests that use the browser itself ... this means you can test actual DOM events within the browser. Available as a Firefox (and other browsers) plugin, and I hook it in with Java and RubyOnRails unit-tests for complete automation.

What cool tools are you using?

aussieNickuss · 01-31-2007, 04:52 AM

The only "cool" ...more like very useful/essential things I use apart from Dreamweaver are the Web Developer and Tidy SGML XHTML validation Firefox extensions.

I work mostly with PHP and I have stuck with Dreamweaver because its the only program I think that highlights the code properly (as well as auto completing PHP, XHTML and CSS values which is handy) . I have tried other programs to write PHP, but I can never get the code colouring right.

Jim · 01-31-2007, 05:47 AM

Excellent suggestions Toby.

The only other suggestion I have is a tool called "Fiddler" ( Fiddler HTTP Debugger - Fiddler ).

Fiddler allows you to see form submission data, header data, etc. This is especially useful if you're looking to automate interaction with other sites and need to know what data is needed by a specific form (e.g. cookie values, etc).

Sadhana · 01-31-2007, 12:20 PM

There are also the Web Developer and Stylish Firefox extensions, though the latter doesn't have much to do with web design/development.

John Wesley · 01-31-2007, 01:02 PM

I totally agree about FireBug. I also use the FF web developer tool bar. Did you say you can use Selenium to test cross browser compatibility? If so I need to start using it as compatibility is always the most annoying part of webdesign.

Sadhana · 01-31-2007, 03:30 PM

Speaking of testing, there's BrowserCam, which lets you see how your site looks like in different browsers on different platforms.

icesar · 01-31-2007, 07:23 PM

Thanks for all the tips! I've been meaning to try FireBug, so I'll take this as the approriate kick in the pants.

I actually have a questions, does anyone use an editor that does smart indenting for HTML? I use TextWrangler on Mac, and I have to take care to do all the indenting myself, unlike some of the smart editors I've used on Windows.

Sadhana · 01-31-2007, 08:00 PM

Quote:

Originally Posted by icesar

Thanks for all the tips! I've been meaning to try FireBug, so I'll take this as the approriate kick in the pants.

I actually have a questions, does anyone use an editor that does smart indenting for HTML? I use TextWrangler on Mac, and I have to take care to do all the indenting myself, unlike some of the smart editors I've used on Windows.

CSSEdit is a great editor for CSS and TextMate for everything else.

tobyhede · 01-31-2007, 11:11 PM

I use TextMate and Eclipse with the Aptana and PHPEclipse plugins.

turbosaab · 02-01-2007, 11:05 AM

Great thread. I second the suggestion for the Web Developer Toolbar for Firefox, I don't know how I ever got along without it.

tobyhede · 02-01-2007, 09:04 PM

The latest version of firebug has made my WebDev Toolbar largely obsolete. Although I still have it installed and use it for validation and things.

blairkincaide · 02-02-2007, 03:29 PM

Mainly reinforcing what has already been laid out.

BrowserCam is pretty sweet, but not necessarily fast. That shouldn't hinder much however.

I like Firebug for DOM and script testing/debugging, but for most things CSS related, or for evaluating other websites, I use the Web Dev toolbar. I don't feel Firebug is a replacement yet. That said, I don't use Firefox for much else (I prefer Camino and OmniWeb as browsers).

As for editors, on the Mac, I've found TextMate to be the better text editor by far. I use TextWrangler in the past (because I was too cheap/stubborn to buy TextMate), but after switching I'm much more satisfied. In Ubuntu I tend to use gedit, but I'll also use vim on occasion, mainly Cream. On Windows I used UltraEdit.

Dreamweaver doesn't really have the right focus any more if you're moving towards good design habits (away from table-based layouts) and focussing on proper markup (more semantic).

nurikabe · 02-02-2007, 06:03 PM

Quote:

Originally Posted by icesar

I actually have a questions, does anyone use an editor that does smart indenting for HTML? I use TextWrangler on Mac, and I have to take care to do all the indenting myself, unlike some of the smart editors I've used on Windows.

Really dating myself here, but: GNU Emacs - GNU Project - Free Software Foundation (FSF)

Saidin · 02-07-2007, 06:18 PM

Woohoo, a chance to blatantly reccommend my site.

You can (really) find great tools on my site, in the sections: firefox plugins, software, online tools and color tools.

)) DEVLISTING

Actually, firebug is rated highly by the site's visitors.

And while you're there: I'm genuinly interested in getting comments on how to improve my site. Use the contact link in the menu (or post it here, if you want).

01-29-2007, 10:17 PM	#1 (permalink)
tobyhede Senior Member Join Date: Nov 2006 Location: Melbourne, Australia Posts: 182	Cool web dev tools I do web dev for a living, so thought I'd share a couple of things I have found recently that are proving invaluable. FireBug. If you do ANY type of web-dev you MUST HAVE THIS. Absolutely incredible. HTML, CSS, JavaScript debugging, AJAX request tracking ... the list goes on and on. It's changed my life. Selenium Selenium is a test framework that allows you to record tests that use the browser itself ... this means you can test actual DOM events within the browser. Available as a Firefox (and other browsers) plugin, and I hook it in with Java and RubyOnRails unit-tests for complete automation. What cool tools are you using?

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Referral tools for Digg, Del.icio.us, etc???	da1prophet	Technology & Technical Skills	4	02-05-2007 07:33 AM
Just play it cool	StarFish	Social & Relationships	17	01-10-2007 07:05 PM
Cool software.	timmymayes	Personal Effectiveness	16	11-30-2006 12:59 PM
Manifesting Intentions Without Resistance (Blog)	Savage	Steve Pavlina	105	11-28-2006 09:41 AM
Can you cool people help me do a total time redistribution?	The Protagonist	Personal Effectiveness	0	11-08-2006 01:02 AM

01-31-2007, 04:52 AM	#2 (permalink)
aussieNickuss Senior Member Join Date: Nov 2006 Location: Ballarat, Victoria, Australia Posts: 287	The only "cool" ...more like very useful/essential things I use apart from Dreamweaver are the Web Developer and Tidy SGML XHTML validation Firefox extensions. I work mostly with PHP and I have stuck with Dreamweaver because its the only program I think that highlights the code properly (as well as auto completing PHP, XHTML and CSS values which is handy) . I have tried other programs to write PHP, but I can never get the code colouring right.

01-31-2007, 05:47 AM	#3 (permalink)
Jim Senior Member Join Date: Nov 2006 Location: Lincoln, NE Posts: 111	Excellent suggestions Toby. The only other suggestion I have is a tool called "Fiddler" ( Fiddler HTTP Debugger - Fiddler ). Fiddler allows you to see form submission data, header data, etc. This is especially useful if you're looking to automate interaction with other sites and need to know what data is needed by a specific form (e.g. cookie values, etc).

01-31-2007, 12:20 PM	#4 (permalink)
Sadhana Member Join Date: Nov 2006 Location: USA Posts: 86	There are also the Web Developer and Stylish Firefox extensions, though the latter doesn't have much to do with web design/development.

01-31-2007, 01:02 PM	#5 (permalink)
John Wesley Senior Member Join Date: Dec 2006 Location: D.C. area Posts: 278	I totally agree about FireBug. I also use the FF web developer tool bar. Did you say you can use Selenium to test cross browser compatibility? If so I need to start using it as compatibility is always the most annoying part of webdesign.

01-31-2007, 03:30 PM	#6 (permalink)
Sadhana Member Join Date: Nov 2006 Location: USA Posts: 86	Speaking of testing, there's BrowserCam, which lets you see how your site looks like in different browsers on different platforms.

01-31-2007, 07:23 PM	#7 (permalink)
icesar Senior Member Join Date: Nov 2006 Posts: 138	Thanks for all the tips! I've been meaning to try FireBug, so I'll take this as the approriate kick in the pants. I actually have a questions, does anyone use an editor that does smart indenting for HTML? I use TextWrangler on Mac, and I have to take care to do all the indenting myself, unlike some of the smart editors I've used on Windows.

01-31-2007, 11:11 PM	#9 (permalink)
tobyhede Senior Member Join Date: Nov 2006 Location: Melbourne, Australia Posts: 182	I use TextMate and Eclipse with the Aptana and PHPEclipse plugins.

02-01-2007, 11:05 AM	#10 (permalink)
turbosaab Junior Member Join Date: Nov 2006 Location: Maine Posts: 21	Great thread. I second the suggestion for the Web Developer Toolbar for Firefox, I don't know how I ever got along without it.

02-01-2007, 09:04 PM	#11 (permalink)
tobyhede Senior Member Join Date: Nov 2006 Location: Melbourne, Australia Posts: 182	The latest version of firebug has made my WebDev Toolbar largely obsolete. Although I still have it installed and use it for validation and things.

02-02-2007, 03:29 PM	#12 (permalink)
blairkincaide Junior Member Join Date: Feb 2007 Posts: 1	Mainly reinforcing what has already been laid out. BrowserCam is pretty sweet, but not necessarily fast. That shouldn't hinder much however. I like Firebug for DOM and script testing/debugging, but for most things CSS related, or for evaluating other websites, I use the Web Dev toolbar. I don't feel Firebug is a replacement yet. That said, I don't use Firefox for much else (I prefer Camino and OmniWeb as browsers). As for editors, on the Mac, I've found TextMate to be the better text editor by far. I use TextWrangler in the past (because I was too cheap/stubborn to buy TextMate), but after switching I'm much more satisfied. In Ubuntu I tend to use gedit, but I'll also use vim on occasion, mainly Cream. On Windows I used UltraEdit. Dreamweaver doesn't really have the right focus any more if you're moving towards good design habits (away from table-based layouts) and focussing on proper markup (more semantic).

02-07-2007, 06:18 PM	#14 (permalink)
Saidin Member Join Date: Nov 2006 Location: Netherlands Posts: 46	Woohoo, a chance to blatantly reccommend my site. You can (really) find great tools on my site, in the sections: firefox plugins, software, online tools and color tools. )) DEVLISTING Actually, firebug is rated highly by the site's visitors. And while you're there: I'm genuinly interested in getting comments on how to improve my site. Use the contact link in the menu (or post it here, if you want).

Personal Development for Smart PeopleTM Forums

Personal Development for Smart People^TM Forums