My Favourite Web Development tools.

Every few months, i will be Googling or check out new web development tools for my work and personal projects. Unbelievably,  new cool and fantastic tools kept popping up, something you even have problem which best tool to used. The tools i meant here, are tools like IDEs, plug-in, library, framework, CMS, test-suite and more. Below, are the list of tools that currently i am using and found it very useful and increasing my productivity. All the tools are OPEN  SOURCE which i am a very big fan of.

Firefox Add-ons

——————-

1.  Again, Firebug win my heart. This tool let you inspect and edit CSS on the fly. Not only css, debugging javascript with it, save tons of your time to look for javascript errors.

Firebug screen shot

Firebug screen shot

2. iOpus iMacros – from a Firefox add-ons : to record form filling and replay the task you had been recorded. Save your time kept repeating testing for web forms, useful for web testing, web scraping and more.

IMacro

IMacro

3. Web development– from a Firefox add-ons : Great tools with lots of functionality for web developers. Such as markup validation,  cookies management, http header management and more.

Web Development toolbar (Firefox add-ons)

Web Development toolbar (Firefox add-ons

4. XDebug for Javascript

5. Yahoo YSLOW – Javascript profiler : A great tools to check how to faster up your website. Their also provide best practice and guideline how to improve and tune website loading performances.

Framework

————–

1. Zend framework : started using recently and fall in love with it. Strong MVC architecture support and database adapter.

2. jQuery : A Cool Javascript framework that i have been using almost 2 years since it released. JQuery have strong community support, easy to learn, good documentation (at least better than some), more books on JQuery and more.

CSS

—-

1. 960 Grid System from MIT. Very easy to use and faster up your layout  design for a new website without worrying if the new row or column will expand accordingly.

Forum

——–

1. Although this part is a bit not relevant, but i insist to introduce the best question and answer programming/IT forum : http://www.stackoverflow.com

2. Slashdot : Ah!!..sometimes you need a break from your IDE or notepad.

Time Tracker

—————-

1. I use RTM : Remember the Milk task list which integrate well with Gmail Task List.

2. Google Calendar : Use it for weekly planner and task remimder which sent free sms reminder to your mobile phone.

Advertisements

About Charles Ling
Web/Android/IPhone Developer. Very very interested in Web Architecture, Web Standard and and how to use Web to improve human social life and doing cool stuff.

6 Responses to My Favourite Web Development tools.

  1. 7kittens says:

    960 Grid System is bad! not in the sense that it does not work (its good stuff), but rather it breaks recomended practices.

  2. Wai Chun says:

    Yeah man. Firebug is really a helpful tool

  3. Charles Ling says:

    Hi 7kittens,

    Interesting comment, but it will be good if you can share what sort of recommended practices you had mentions.

    Cheers,
    Charles.

  4. 7kittens says:

    I’ll try to keep it short,

    “Your markup should be semantic markup.”

    Code should look like this:

        <h1> ... </h1>
        <div class="post">
            <h2 class="header"> ... </h2>
            <p class="content">
                </p><p> ... </p>
                <p> ... </p>
                ...
            
            <p class="comments">
                ...
            </p>
        <div>
    

    …not this…

    <div class="container_12">
        <div class="grid_7 prefix_1">
            <div class="grid_2 alpha">
                ...
            </div>
            <div class="grid_3">
                ...
            </div>
            <div class="grid_2 omega">
                ...
            </div>
        </div>
        <div class="grid_3 suffix_1">
            ...
        </div>
    </div>

    As I said, it does work! and you can make it semantic (to a point) but the problem is its markup code catering for a target media, somehow similar to abusive use of tables, but not so evil.

  5. 7kittens says:

    Content should be a div (pragraphs only accept inline content), my bad sorry. (wordpress autocorecting there)

  6. Charles Ling says:

    Good points..I should said it is good for prototype but bad for production.:)

    thanks for sharing..

    Cheers,
    Charles

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: