AWESOME TOOLS FOR WEB DESIGNERS & DEVELOPERS

DEVELOPMENT

1. If you haven’t used FireBug, then you probably haven’t experienced any hardcore CSS Firebug logoissues so far. FireBug, originally developed for Firefox, allows you to debug and experiment with CSS in real-time to be able to fix those pesky CSS issues which often leave you scratching your head (or more likely, tearing at your hair)!

   http://getfirebug.com

2. The best way to debug JS is of course in the browser. Deb.js is a tiny script which, when included in a page, allows you to debug Javascript by showing you the exact parameters passed to a function and full stack trace. This allows you to perform a full step-by-step debug of what’s going on in your JS function.

   https://github.com/krasimir/deb.js

3. Unless you’ve been living under a rock for the past few years, you’ve probably already come across Bootstrap. Bootstrap is the most popular HTML, CSS and Javascript framework, aimed at developing responsive sites. Originally developed at Twitter to encourage consistency across internal tools, it was eventually open-sourced to become one of the most popular projects on Github.

   http://getbootstrap.com

   

4. Yes, Google is helping out in multiple ways. Another awesome contribution by Google is AngularJS, which is essentially an MVC framework for client-side development. Essentially, it’s an MVC framework for Javascript, which thus makes in an improvement both for HTML and Javascript.

   https://angularjs.org

   

Tools for web development

1. Originally developed by IBM with strong focus on Java, Eclipse is a free IDE which has grown to become a very strong development environment for a large number of languages. Chances are, there are plugins for your favourite language, your favourite source control, your favourite web server, and/or your favourite development everything.

   http://www.eclipse.org

   

2. Taglined as a Front End Designer playground, codepen can be used for two main reasons – the 1st is get inspiration or find awesome code to reuse within your website design. The 2nd is to test out and demo front end ideas and ideally get feedback from peers, whether it’s about the actual design or about fixing bugs.

   http://codepen.io

   

3. Sublime Text has risen in popularity lately. It is essentially a slick code editor, minimalistic but with functions very specific to developers. This is no nonsense, pure code-editing.

   http://www.sublimetext.com

There are many other Delevopment and IDEs for you, so just make a try by yourself.