Best webdevelopment tools

by Filip Lundby.

This is my personal list of favorite webdevelopment tools. The internet is changing constantly and so are the tools for creating it. Tomorrow these tool might not be what you want. So the list more like a snapshot of what was hip in year 2014.

BitBucket

Website:  BitBucket.org

Revision control (or version control) might not be needed if you are doing a smaller project. But for larger project or perhaps team projects - revision control is indispensable.

In contrast to other revision control services BitBucket lets you create free and private projects.

GitHub is also very popular.

Eclipse 

Website:  Eclipse

Eclipse is the editor, if you are a none-.NET-developer. It's great for developing Java, Android apps, PHP, basic HTML and much more. There's almost a plugin for everything.

Chrome Browser

Website:  Chrome Browser

Chrome has some nice features when it comes to webdevelopment. I would recommend remembering the keyboard shortcut for the Developer Tools: F12 or Ctrl + Shift + I (even more Chrome shortcuts).

Phpacademy made a nice couple of videos on how to get started with Chrome Development Tools. This video explains how to inspect and manipulate elements:

Others like  Firefox with Firebug better.

Zurb Foundation

Website:  Zurb Foundation

Responsive design has become the new black. I've been working with Foundation and really like it. I'ts a great starting point for building a responsive frontend, although you will have to make your own ajustments here and there. But as you get to know all it's small functionalities, frontend development becomes a little faster.

Another popular responsive framework is  Bootstrap.

Text- and image-placeholders

Website:  Lipsum.com and Placehold.it

Writing "Yada yada yada, text text text..." multiple times doesn't look that cool to your clients. Lipsum.com let's you create a paragraphs of latin text - in genreral called lorem lipsum. Adding some lorem lipsum text to your website is always a good idea. It gives you an idea what the final product looks like.

Of course you will need some images too. That's what Placehold.it is for. If I want an image that is 500 x 400 pixels, I'll just add this to my HTML:

<img src="http://placehold.it/500x400" alt="I'm just a placeholder" />

Some less serious, but funny services:  Placesheen.com or Baconlipsum.com.

Stack Overflow

Website: Stack Overflow

Sometimes you just can't figure out where that JavaScript bug is hiding. Nine out of ten times some one have had the same trouble as you. Stack Overflow is a great place to ask questions or find answers. You get points by answering questions, so that's actually a little of fun too.

JSFiddle

Website: JSFiddle

When asking or answering questions, demonstrating the issue is the best way to let others understand the problem. JSFiddle is also very useful when you quickly want to test something. Like, does  marquee still exist?

Leave some feedback