Web Development Tools and Resources Online
Good tools can be extremely helpful in programming so I wanted to share a list of web development tools that I have been collecting over some time. The list below includes online tools covering all areas of web development, including different generators, cheat sheets, and code snippets plus other random tools which make dev work more efficient. So far I have 53 different online development tools listed and I hope that you can benefit from these:
PrimerCSS – undercoats your CSS by pulling out all of your classes and id’s and placing them into a starter stylesheet.
CSS Lint – an open source CSS code quality tool.
0 to 255 – is a simple tool that helps web designers find variations of any color
ProCSSor – Advanced CSS Prettifier
Spritebox – create CSS classes and IDs from a single sprite image
Boxes – quick css for different layouts
Fake Height CSS Layouts – collection of preset faux CSS layouts
Fixed Width CSS Layouts – collection of preset fixed-width CSS layouts.
CSS 2 Visual Cheat Sheet – a useful and practical reference guide to Cascading Style Sheets Level 2 for web designers and developers.
Bear CSS – creates css from your uploaded html document.
SpritePad – Simply create CSS sprites.
jQuery Deconstructed – Navigate the physical jQuery code to see what, where, and how the magic happens
jQuery Visual Cheat Sheet – all the reference you will ever need for jQuery 1.4.2 API
Regex Colorizer – RegexPal-style regex syntax highlighting on your webpages.
htaccess Cheatsheet – simple cheatsheet for the .htaccess file
htaccess tester – online tool to test your htaccess rewrite rules
URL Rewriting Tool – .htaccess redirect generator to make better URLs for search engines.
DiffNow – Compare files online
showoff.io – the easiest way to share localhost over the web.
convert your unix timestamp – convert your timestamp in a human readable format.
WobZip – allows you to uncompress packaged files online including chrome extensions.
URL Decoder/Encoder – Input a string of text and encode or decode it.
Google Swiffy – converts Flash SWF files to HTML5.
JSfiddle – test and share your html, css, and js code.
html5 Boilerplate – rock-solid default for HTML5 awesome.
Initializr – an HTML5 templates generator to help you getting started with a new project based on HTML5 Boilerplate.
XML Sitemaps – free tool that let’s you generate an xml sitemap from a URL.
PHP Object Generator – open source PHP code generator which automatically generates clean & tested Object Oriented code with MySQL interaction.
Postable – turns HTML tags into post-friendly code.
Kotatsu – a simple html table generator.
iPhone Icon Generator – generates icons from images for iphone, favicons, etc…
HTML Entity Character Lookup – allows you to quickly find the entity based on how it looks.
pForm – Create HTML Form in seconds.
IconFinder – nice Icon search engine
Code Snippets from CSS-Tricks – awesome code snippets covering CSS, HTAccess, HTML, Javacript, jQuery, PHP, and WordPress.
BrowserShots – test your website across many platforms and browsers.
Preloaders – awesome loading image generator.
Favicon Generator – great favicon generator from image and editor.
Web Development Project Estimator – a simple tool to quickly estimate the time and materials required for a proposed web project.
Snipt – awesome snippets of code, long-term memory for coders.
Golden Ratio Calculator – enter a width and get the golder ratio for your columns.
Vector Magic – Easily Convert Bitmap Images To Clean Vector Art.
PicMarkr – Watermark your images online for free.
Show IF – simple if…else generator that allow user to set the conditions based on the client’s environment.
JPEGmini – reduces the file size of your photo by up to 5x, while keeping thier original quality and JPEG format.
ImageOptim – optimizes images and handles PNG, JPEG and GIF animations.
List of all WordPress hooks – Use this index to identify the WordPress hooks that you need.
JsApp.US – hosting platform for node.js applications.