Rakesh Jha

Back to Top

Tools of the Web

Published on 19 January 2014 with .

Table of Contents

Hello guys! Today I want to discuss a few prominent tools of the web that are currently being used to enhance the workflows of web developers and software developers all over the world! There are several tools available and therefore, I cannot possibly cover every single one of them. However, I will reveal a few of my favorites. Feel free to include your own tools and workflows in the comments!

Editors

  1. Sublime Text
    This has been an extremely popular editor among developers as it contains numerous features, such as multiple cursors and incremental search, and it is actively developed, among other reasons. As I write, a new version, Sublime Text 3, is coming out (currently in beta).

    Price: $70

  2. Vim
    Vim is for those who have time to adjust to the steep learning curve of it. It takes a while to master Vim, but when you do, it will become an extremely powerful tool in your workflow.

    Price: Free

  3. Brackets
    Brackets is an open source editor that is being actively developed/maintained by Adobe. It has features such as built-in live preview (my personal favorite) and a multitude of extensions to extend the capabilities of the editor.

    Price: Free

  4. TextMate
    TextMate used to be a closed sourced editor that was not free. However, the company decided to make the project open source on Github as of August 9, 2012. It used to be a popular editor before Sublime Text and others such as it took over.

    Price: Free

Extensions

  1. Stylish
    Stylish is an extension that one can use to edit the CSS of any website quickly and efficiently! It also features a saving feature to save your custom CSS styles for future use on any certain website.

  2. Web Developer
    Web Developer is essentially a toolkit with various features to ease your daily work. For example, it can display class and id details for all the elements on the page or resize the browser to various widths and heights to test your responsive layout!

Web Applications

  1. Chop
    Chop allows you to send code snippets (like gists) to your friends! However, the key feature here is that your friend can then comment on your code seamlessly, allowing you to make edits and fixes quickly!

  2. Dirty Markup
    Dirty Markup is a code formatter for HTML, CSS, and JavaScript which uses several scripts, such as JS Beautifier in the background.

Web Development Playgrounds

  1. CodePen

  2. JSBin

  3. CSSDesk

  4. JSFiddle

  5. Dabblet

Closing

There are several other tools coming out every single day! It's getting more and more difficult to keep track of all of them! Therefore, please share your knowledge in the comments below so others can benefit and tidy up their workflow. Thanks for reading!