Pages

Friday, 16 December 2016

Useful tools for developers

There are some amazing tools available for developers on the web, from pretty-printing your code to validating it, from colour palettes for visual impairments to tools for testing APIs. Here are some of my favourites.

Stack Overflow
This is the go-to site for questions and answers about coding. It has questions and answers on just about every programming language that you can think of - PHP, Python, Java, Ruby, JavaScript, jQuery, Angular, and more. And every environment you can think of - Windows, iOS, Android, and so on. And every mark-up and styling language - HTML, XML, CSS, and Sass. Stack Overflow has an awesome community of people willing to help complete strangers, which I think is amazing. I have learnt so much from reading Stack Overflow, and I haven't asked that many questions on there, because many of the common questions have already been asked and answered.User Experience
This is the equivalent site to Stack Overflow for asking user experience questions (usability and accessibility). These include everything from usability testing to user interfaces, UI patterns, mobile UI, material design, and more. Again, you can learn from reading other people's answers, or contribute your own.

UI Patterns
This is a library of design solutions for various elements of the user interface, such as forms, logging in, logging out, registration, menus, headers, footers, and the rest. It is very useful for seeing what layout and information architecture solutions others have come up with.

CSS generators
There are CSS generators for Box Shadow, Text Shadow, Border Radius, Gradients, Buttons, and layout. There are many different ones, so pick the one that you like.HTML color palette
There are many HTML colour code sites out there. One of my favourites is color-hex, because it provides all the tints and shades of each HTML colour.

FontAwesome
The wonder that is FontAwesome has already been mentioned on this blog, but it is really a great tool for creating icons and buttons, and ensuring that you have consistent user interfaces throughout your applications.

&what;
A huge online database of Unicode characters, for when FontAwesome doesn't have the icon you need.

Window Resizer
This is a browser extension for resizing your browser window to simulate different screen resolutions, and is an essential tool in responsive design. You can then create media queries to optimise how your web page or mobile app will display in different screen resolutions. It is available for most browsers.

CodePen
This is a showcase of snippets of code for doing cool stuff, such as cutting-edge CSS, jQuery and Angular.

Plunker, jsFiddle
Places for testing your code. Quite often, users of Stack Overflow will post working examples and solutions on Plunker or jsFiddle.

regex101.com - Regular Expressions 101
Online regex tester for PHP, PCRE, JavaScript and Python that highlights pattern and matches on the fly. This is an awesome tool for testing your regular expressions and seeing what results they will return. Most people find regex a tad unpredictable, so this is a really useful tool.

PHP Sandbox
Great for testing your PHP online in a neutral environment.

JSON Validator
There are various JSON validation tools available, so pick the one you like best. A good validator can pretty-print your JSON for you, and highlight any errors in it.

PrettyPrint
There are tools available for tidying and validating most coding languages. Just search for pretty print and the name of the language, and there will probably be a tool available. One that I find useful for HTML, CSS, and JavaScript is DirtyMarkup, which will clean up your code for you as well as tidying it.

Postman
This is a desktop app for sending requests to web services to test that they are behaving as you expected. It's a powerful GUI platform to make your API development faster & easier, from building API requests through testing, documentation and sharing. There's a free Postman App for Mac, Windows, Linux or Chrome.