views:

2923

answers:

32

Over the years most web developers will have built an arsenal of tools or "tools of the trade". Recently I discovered rsync and I am surprised how I managed to live without it all these years. What tools do you consider to be the most compelling? Please stick to the ones you use on a regular basis and swear by. They can also be frameworks, platforms, editors and whatever else you think web developers ought to be using (jquery, joomla, xdebug, vi, notepad++, etc).

I'll start off with a couple:

  1. rsync - 'One click' sync to live servers or vice-versa
  2. mysqldump - used alongside rsync to sync the databases
  3. test styles bookmarklet - live css editor bookmarklet which beats the heck out of the 'edit > save > reload' cycle by allowing live editing.
  4. javascript shell - javascript shell window attached to a window
  5. firebug - advanced javscript/css/dom debugger
  6. php-shell - I use this regularly for quickly testing statements, functions, classes or scripts
  7. CSS-Discuss Wiki - I'd be surprised if you couldn't find a solution to your CSS problem on this wiki (in which case you should add it)
  8. Font Matrix - Helps me choose font stacks
  9. PHPMyAdmin - I'm certain everyone uses this for managing their MySQL databases but thought I'd add it to the list for good measure

Even though I have highlighted tools in the LAMP environment, you may mention tools you use in your environment.

+3  A: 

Johnny Cache - Prevents caching in Firefox for certain URLs (otherwise Firefox will occasionally cache CSS and javascript)

Bill Zeller
+9  A: 

Firefox plugins for development

ColorZilla

This has proved to be very useful to me. You can eyedrop any colour (I'm going with my native spelling here) on any web page, and also on the chrome if you're inclined!

Web Developer Toolbar

The ruler is very useful! Not to mention everything else :)

alex
Ruler?! Doh! I've been using this for ages and never knew there was a ruler in there. Thanks.
Peter Rowell
@Peter: no worries... it is very useful!!!
alex
+22  A: 

LAMP stack development

(I focused on LAMP since that is what I use for web development)

Eran Galperin
Last one seems is very true!!!
alex
A: 

A windows box on synergy. Building in IE first and then tweaking for Firefox/Safari has brought my IE support up to par.

too much php
+6  A: 

These are some of my basic essentials:

OS X:

Windows:

Cross-Platform:

Also, here's a write up I did a while back: Essentials of a web-developer's toolbox

thetacom
A huge "amen" on Textmate/Transmit. What a combo!
ceejayoz
+7  A: 

Aptana Studio

CMS
+4  A: 

Cash (to pay someone else to do it).

Edit: The question clearly says:

Please stick to the ones you use on a regular basis and swear by. They can also be frameworks, platforms, editors and whatever else you think web developers ought to be using

It is a very reasonable point to outsource parts or all of web development.

Ali A
dude, this defeats the point.
hasen j
By "defeats" do you mean "wins" ?
Ali A
My first reaction was to downvote this. But after a few seconds, your point sunk in. I think you'd get a lot of votes for this if you had worded it more gracefully.
rp
It's even more appropriate when you realize that "Web Development" encompasses a lot more than just coding, including graphic design. It's tough to be an expert in every aspect, so paying someone more qualified to do a specific part of the development will most definitely be "better."
Steve Losh
I think they should be using their motor skills to coordinate all of their efforts...I mean its saaaayyys "whatever else"
schmidty
+3  A: 

if you find rsync helful, I'm sure you'll find unison even more so!

hasen j
+1  A: 

If you like to use any of the variations of VIM as your editor of choice, one superb add on is CSS color preview, which "underlays the hexadecimal CSS colorcodes with their real color."

reshen
+6  A: 

VirtualBox makes development pretty easy since you can have a virtual machine be the "server" and browse the pages from your main OS. This is especially true if the OS you're targeting isn't the one you're developing for.

Jason Baker
A: 

There's more to development than just coding. There's requirements capture, analysis, design, QA. Here's an introduction to the different phases of software development. I published this article on Top OSS for Coders a couple of years back but it still is relevant for me. This list includes OSS tools that are very helpful to me in all the different phases of software development and not just the coding phase.

Glenn
+3  A: 

Just few additions/replacements to the excellent Galperin's list:

Vadim Ferderer
+2  A: 

E-Text Editor, sold as 'The power of TextMate on Windows'. I find it ideal for HTML and CSS coding. It is very light and includes some great features that certainly increase productivity. Other tools of note that i regularly use are:

Ronnie
A: 

My answer is centered to more of web design, but I have found Inkscape (http://www.inkscape.org/) very useful to help me brainstorm layouts for webpages.

Also useful are design websites that one can visit to find inspiration for a new design.

Rishabh Mishra
+1  A: 

Some Firefox addons I found to be very useful:

Fionn
fix the links plz
hasen j
They should now work
Fionn
A: 

I recently started using HttpWatch and have found it to be great. It allows you to inspect all the HTTP traffic of your web application. What is the size of your AJAX response? Did the browser load the gif from its cache? Does your page make any requests that you didn't know about? These are just some of the questions HttpWatch can help you answer.

+1  A: 

Being a windows guy having to program a cake php app for one of my clients, SFTPDrive has been very helpful for me. My VM is a Centos Linux distrib, and I work on it for the most part from my Windows environment (with some exceptions of course).

matt_dev
+3  A: 

jQuery

I recently began to use it, and it's so easy to use! Everything becomes twice as easy to code! At least!

I can't stress this enough. A versatile library like this should not be missed, even by people like me who generally look down upon using other people's code.

stalepretzel
A: 

CakePHP - MVC framework for php

CakePHP is a rapid development framework for PHP that provides an extensible architecture for developing, maintaining, and deploying applications. Using commonly known design patterns like MVC and ORM within the convention over configuration paradigm, CakePHP reduces development costs and helps developers write less code.

Wraps up a lot of the work related to CRUD and has so many other features that reduce the work we have to do.

http://cakephp.org/

HyperCas
+1  A: 

I mainly use Google :-)

To be serious, a great firefox addon is TamperData - gives you the ability to change headers and data of each request made.
The Paint.NET image editor helps me on a daily basis and I recomend it for your basic image editing needs.

Dror
A: 

RXP

kal
+1  A: 

Addition to other tools mentioned here I often find great help in having a proper debugging proxy - Fiddler (free, Windows only) and Charles (commercial, cross-platform) are great ones.

Doing front-end development, a lot of time is spent figuring out why IE misbehaves (esp. IE6). Some great tools for this are:

  • Internet Explorer Developer Toolbar
  • Companion.JS - this is a companion application for Microsoft Script Debugger which gives you actually helpful Javascript error messages in IE.
  • XRay - this is a bookmarklet for inspecting your HTML layout. This might seem trivial, but can be really helpful for debugging your layout in IE6
Kristian J.
A: 

Fiddler

ViewState Helper

TopStyle Lite

IE Developer Toolbar

FireBug

etsuba
A: 

NetBeans or if you are a console guy, emacs

Jon Romero
A: 

I'd like to add VMWare Workstation what i use for virtual development environments. I haven't tried the new eclipse vm debugging plugin yet, btw ;)

Karsten
A: 

Firebug - Brilliant tool for claryfying what css is in use and what stylesheet it is coming from Crimson Editor - little editor with excellent syntax highlighting JQuery - enough said DNS Expert - Instant checks for anything DNS related

+2  A: 

I recently discovered XRefresh which automatically reloads local files (file:// URLs) as soon as you save your changes. It's absolutely great when you're at the initial stages of a project and making frequent updates to static HTML, CSS and JavaScript files in your local project directory.

Ates Goral
+2  A: 

Don't mind me, I'm just here to spread the word about my favorite editor/regex debugger/grepper suite. :-)

  • EditPad Pro (IMO, the best damn text editor there is)
  • RegexBuddy (the only real regex debugger I've found)
  • PowerGREP (never use Windows Search again)

None of them are free, but they're sanely licensed and all of them support portable installation (good for the USB drive on your keychain). Best of all, the author is an SO user.

Ben Blank
+2  A: 

Commandline http clients like lynx, wget, and curl are very useful, at least if your development style is oriented towards the command line and text tools. I'm surprised they haven't been mentioned yet.

  • For example, to feed POST data to a url and print out the response headers and html output: echo 'foo=1&bar=2' | lynx -post\_data -mime\_header http://localhost/my/app
  • Quick to execute (uparrow, return) once it's in your shell history, less risk of breaking flow or getting distracted than switching into the browser.
  • Scriptable, modifiable, repeatable. You can precede it with a script to put the database into a known starting state, you can grep the response headers or html output for the specific thing you're interested in, and follow it with a commandline database query to find out if the finishing state is as required.
d__
+3  A: 

ide: visual studio / netbeans (zip file!, almost portable)

editor: notepad++ (portable) with monaco font

file comparison: winmerge (portable)

source control: subversion, tortoise

ticket control: redmine

file manager: free commander (portable)

explorer: IE, FF (portable), chrome (portable), iron (chrom without google crap, also portable), qtweb, arora,

FF plugins: firebug, web developer, xmarks

imclient: pidgin

mail client: gmail

download manager: free download manager (portable)

sites: STACKOVERFLOW!!!, gotapi... and google, all the time...

miscelaneous: launchy (can't live without it!)

virtualization: virtual box (I have a machine image for every environment)

office: openoffice (portable)

lamp stack: xammp (portable!)

disk usage: windirstat (portable), scanner (portable)

pdf viewer: foxit (portable), sumatrapdf (portable)

uncompressor: 7-zip portable

M$ sql comparison tool: sql delta

M$ sql management: visual studio sql manager

mysql

mysql management: phpmyadmin, manager provided with mysql

uninstaller utility: revo unistaller (portable)

registry cleaner: ccleaner (portable)

ftp: filezilla (portable)

as you may have noticed, I have a special predilection for portable applications...

opensas
A: 

IDE: Visual Studio

Framework: ASP.NET MVC

Client side: jQuery and jQuery.ui

Internet Explorer Developer Toolbar

moi_meme
A: 

For websites use Ruby on rails. It Generate forms, buttons, listbox for you. It generate data validation to ensure user input is correct.

land rover