Open Source Resources for Web Application Developers

Stringer is an open source self-hosted, anti-social RSS reader. Stringer has no external dependencies, no social recommendations/sharing, and no fancy machine learning algorithms. But it does have keyboard shortcuts and was made with love.

Stringer is written in Ruby and built on Sinatra with a PostgreSQL datastore. It deploys easily to Heroku and is a self-professed work-in-progress. The project is released under MIT licensed and hosted on GitHub.

Requirements: -
Demo: https://github.com/swanson/stringer
License: MIT License

Dunked is one of the simplest, easiest, and most versatile portfolio simple-to-use solution to allow creative folk to showcase their work. It’s Responsive, Retina & Ready to go. you can choose from a growing collection of professionally designed templates to reinvent your portfolio. Their pixel-perfect templates are customizable, easy to use, and focus on one thing only – your content.

Each template is fully responsive and will adapt itself to any mobile device. iPad, iPhone, Android, it doesn’t matter. Your work will always looks its absolute best. Upload images from your computer, embed your latest videos from YouTube or Vimeo, and add your mixes from SoundCloud. When you’re done, manage your content through a simple to use drag and drop admin interface.

Requirements: -
Demo: http://dunked.com/
License: License Free

LayoutIt helps you create your frontend code simple and quickly with Bootstrap using our Drag & Drop Interface Builder. It takes every element and component of Bootstrap to make your frontend coding easier without needing to be an expert in javascript, html5 or css3.

All your designs can be Responsive CSS and Fluid. Drag-and-drop the same Bootstrap components to your own design. Easy to integrate with any programming language, you just download the HTML and start coding the design into it.

Requirements: Bootstrap Framework
Demo: http://www.layoutit.com/
License: License Free

FPSMeter is a simple JavaScript library for sexy, fast, and themable FPS meter. It can measure frames per second, number of milliseconds between frames, and number of milliseconds it takes to render one frame when using the .tickStart() method.

FPSMeter supports multiple instances on one page, has show/hide methods that also pause the meter rendering, and color heatmaps that make themes even more pretty. It is released under MIT License.

Requirements: JavaScript Framework
Demo: http://darsa.in/fpsmeter/
License: MIT License

The power of styling is now in your hands. BluePen can be easily installed even on a dynamic website. Once you have installed it, you can make your style sheet modifications anytime, anywhere. Everything you modify will be updated real-time in your browser (but not on the live website yet). The modifications will be published right after you’ve pressed the ‘Save’ button.

If an element is selected, BluePen offers you a selector with the highest specificity value possible. You can edit this selector, or create a completely new one. It doesn’t matter which type your website is. If it runs on PHP, uses external CSS files and you have file access, bluePen should handle it. So it can be based on Drupal, Joomla, Wordpress, Magento or pretty much any CMS system in the world.

Requirements: -
Demo: http://bluepeneditor.com/
License: License Free

jQuery.deviantartmuro is a jQuery plugin to provide a convenient wrapper around the embedding API for the deviantART muro HTML5 drawing application, allowing you to provide image drawing and editing within third-party sites.

Embedding deviantART muro in your site allows you to pass images from your site to deviantART muro, allow your users to edit those images, and then hand the saved image data back to your site. You can also make scripted use of a number of deviantART muro tools such as filters.

Requirements: jQuery Framework
Demo: http://deviantart.github.io/jquery.deviantartmuro/
License: Creative Commons, BSD License

Admit it, 3D is cool. But, you know what’s cooler? 2D. I love WebGL, but unfortunately it doesn’t work everywhere. Flat Surface Shader is a lighting simulation, which can be configured to use either the 2D context of a canvas element or an array of SVG polygons to draw the triangles. It also utilises native Float32Arrays to store numerical data for highly optimised calculations. You can export the image once you have done.

Requirements: -
Demo: http://wagerfield.github.com/flat-surface-shader/
License: License Free

As a long-running fan of practical jokes, I love April Fools’ Day. Fool.js is a jQuery plugin that lets you play one or more fun practical jokes on an unsuspecting visitor, and it’s crazy easy to set up. There’s a whole range of fun options to use.

You can make the scrollbar to fall over, Hide random elements as they interact, Sing Spongebob with your browser, Flip the page upside down, Make the page 100% editable, Makes the site flash on and off, Forces a shutter on the screen, Makes the page unclickable and etc…

The download link on the site was broken somehow. You can grab the source code here on Github. Have fun!

Requirements: jQuery Framework
Demo: http://fooljs.com/
License: License Free

CSSmatic is a non-profit ultimate CSS tools for web designers. There are four useful tools at the moment. You can use the Gradient Generator which supports multiple colors and opacity stops to get amazing gradients. By using the gradient tool you can create gradients with smooth color changing effects and subtle transparencies.

Border Radius is super easy to use and a super time saver. Change all the borders selected at the same time. Noise Texture helps you create subtle background patterns with dirty pixels and noise, changing the color and values and previewing the results in real time. Box Shadow supports Blur radius changes, color changes, shadow size. Everything that you need to create great drop shadows in a single place.

Requirements: -
Demo: http://www.cssmatic.com/
License: License Free