Web Developer Tools & Resources
PHP-login Project is a script for adding authentication to your PHP projects. There are multiple tutorials available for installing it on various server configurations, as well as a minimal and one-file versions of the script.
There’s little more frustrating for your users than accidentally closing a browser tab mid-way through filling out a form, losing whatever they’ve input so far. Garlic.js prevents this, by storing form data locally until the form is submitted, regardless of whether the browser is closed.
Gator is a simple event delegation library for JavaScript. It’s easy to use, small, and has no dependencies.
Gillie is a lightweight MVC micro framework inspired by Backbone that allows for a separation of concerns using models, views, and handlers. It’s only 4k, and offers useful methods to perform RESTful HTTP requests, among other functions.
Haxe is an open source, multi-platform programming language that has a syntax similar to JavaScript, PHP, and the like. It’s fully documented, and has strict compile-time type checking to make debugging faster and easier.
Molecule is an HTML5 game framework that’s lightweight, easy to use, and cross-platform compatible. It has no external dependencies and even includes its own basic but powerful physics engine.
Vega is a declarative format for creating, saving, and sharing visualization designs. Describe your data visualizations in JSON and then generate interactive views in SVG or HTML5 Canvas.
Mithril is a framework for building awesome JavaScript applications. It’s only 3kb gzipped, has no dependencies, has a small API, is easy to learn, and has safe-by-default templates.
Doormat gives you an alternative way to design your website’s navigation. Unlike Curtain.js, Doormat doesn’t require jQuery.
L20n, from Mozilla, lets localizers add logic into localization resources to codify the grammar of the language. It removes the need for developers to fully understand the specifics of a natural language, by putting the language in the localizer’s hands.
MixItUp is a jQuery plugin that provides animated filtering and sorting of your data. It’s perfect for categorized or otherwise organized data, like portfolios or blogs, as well as for web applications.
hyperProxy is a node.js is a local proxy for using local files for debugging and testing of production sites by front-end developers. It’s easy to setup, configure, and use, and avoids using your live production site (and your users) as a testing ground.
This Code Guide by @mdo is a fantastic guide to create sustainable, flexible, and durable HTML and CSS. It includes guidelines for syntax, attribute orders, classes, comments, and more.
Fluidity is a tiny bit of CSS (107 bytes total) that fixes the part of HTML that isn’t completely responsive. It makes changes to the way images, tables, iframes, preformatted text, and canvas elements, so that they’re completely responsive.
psdiff is a simple tool for creating PNG preview files for Git for your PSD files. Any time a PSD file is changed, this tiny git hook will generate a PNG preview file for it automatically.
Webshims Lib is a capability-based polyfill-loading library that focuses on accurately implementing stable HTML5 features. It’s built on top of jQuery and Modernizr, with modular feature implementation and future-proof feature detection.
Z.js is a JavaScript file that turns content invisible using Unicode’s ZW(N)Js (\u200c, \u200d). There are demos available to show what kinds of situations it’s useful in.
Butterfly is a web terminal based on websocket and tornado. It’s easy to setup and configure, and the look can be completely customized with CSS.
Quink is an open source in-page WYSIWYG HTML editor that’s easy to use. It’s versatile, extensible, and uses the contenteditable features of modern browsers.
Tyto is a completely customizable, configurable, and extensible organization tool. It has a simple user interface, doesn’t require accounts, and is easy to use and configure.
TLDRLegal is a reference for software licenses translated out of legalese and into plain English. Just search for the license you want and get an easy-to-read and understandable summary.
Nanobar.js offers very, very lightweight progress bars, coming in at around 725 bytes when gzipped. It doesn’t require jQuery and is easy to use.
Broccoli is a new backend-agnostic, Node.js build tool, comparable to the Rails asset pipeline in scope. It offers chainable plugins, fast rebuilds, and a few plugins ready to go.
Select-switch makes it easy to convert a select box into a switch. It simply hides the select box, so you can still reference the “select” element to retrieve a value.
RowGrid.js is a jQuery plugin for placing items in straight rows. It’s responsive, supports endless scrolling, and more.
Typesettings is a Sass type toolkit that sets your type in Ems with a modular scale, vertical rhythm, and responsive ratio based headlines. It handles all the math for Ems, including the compounding, and uses modular scale values to set font-size, among other features.
Imacss is a library and application that transforms image files into data URIs, which are then embedded into a single CSS file as background images. Basically, it lets you reduce all of your HTTP requests for images in your design (like icons) into a single call.
The jQuery fontIconPicker makes it simple to add an icon picker and search function to your administration forms. It can be triggered on a SELECT or TEXT input, and has multiple usage options.
ImagesLoaded is an Event Emitter that uses JavaScript to detect when images have loaded, so that you can then trigger various events (like animations). It’s also available as jQuery plugin, and works with RequireJS.