Open Source Resources for Web Application Developers

“Like it? Tweet it!” is a jQuery-powered JavaScript widget that enables visitors to your website or blog to write a tweet about the site directly in a box displayed in the corner of the website, with a link to the site already embedded in the input field.

It makes it easy for users to share your site with friends while still giving them the opportunity to type out something cool for themselves and thus avoiding auto-tweets. The tweet box is activated when users click on a link you specify, and Like it? Tweet it! has tons of customization options which you can play with to make the widget totally blend in and become one with your site.

Requirements: jQuery Framework
Demo: http://pongsocket.com/tweet-it/
License: License Free

• 1 Comment

Griddy is a small JQuery plugin thats creates a simple, customizable grid overlay on top of any element. It can also calculate row heights and column widths automatically based on the number of rows/columns and gutter space. There are few options, including: rows, row height, row gutter, columns, column height, column width, color and opacity.

All of the styling is done inline to avoid linking to an external CSS file or having to use images. The numbers on top are column widths, the numbers running along the left side are row heights. You can also look at 960.gs grid overlay which does the similar thing.

Requirements: jQuery Framework
Demo: http://devgrow.com/griddy-overlay/
License: MIT, BSD, GPL License

• 6 Comments

Face.com has just opened up their APIs so that you can integrate their face detection and recognition technology with your apps and services. Whether you’re looking to add tagging for photos, cool sci-fi experiences, or creative flavors to your apps, Face.com API here to help.

They offer services for detecting, recognizing, and tagging faces in any photo, through our REST API. Face.com’s services are offered for FREE with rate limits. Whitelisting and Premium licensing options are available. Also, they process photos from anywhere, so you can mix and match photo sources with user IDs, which could enable you to, say, recognize Facebook users in Flickr photos.

Requirements: -
Demo: http://developers.face.com/new-detector-demo/
License: License Free

• 2 Comments

PHP Excel Reader allows you to parse and retrieve information from XLS files. It reads the binary format of XLS files directly and can return values and formats from any cell.

The simplest way to interact with an XLS file is to just dump it to HTML for display in a browser. This method will generate a table with inline CSS and all available formatting. By simply using this php command: <?php dump(true,true); ?> The output looks like this (with some CSS):

Requirements: PHP Framework
Demo: http://code.google.com/p/php-excel-reader/
License: MIT License

• 11 Comments

CSS Gallery is a “showroom” for the coolest website designs. From the designers perspective they can be used as an inspirations resource and from the submitter views, getting your web site published on CSS galleries will give you a possibility to increase visibility of your brand , make it visible to a lot of experts users and, of course, it means a lot of traffics.

With CSSGallerySubmission.com, you can submit your website to almost all of available CSS Galleries in the net, simply by using one single form, and the best part is that’s all 100% free of charge. However, you must do the submission process manually. CSSGallerySubmission.com are here just providing you a tool to help you doing the submission work faster and easily.

Source: http://www.cssgallerysubmission.com/

• 14 Comments

Before any tangible designs are made, any experienced designer should know that the first thing you do before any sort of web development project is map out a rough sketch first.

Although most sketching is done on blank paper, many developers have now started using sketch templates for their web applications. This is definitely the most productive and organized way to start probably one of the most important phase of the application design process.

LooksGD has compiled a useful article: Sketchbooks of a Web Developer, with a list of resources and templates to download or print off for designing your next great project.

Source: http://www.looks.gd/design/sketchbooks-of-a-web-developer

• 6 Comments

Lumzy is a Mockup and Prototype creation tool for websites and applications. By Mockup, we mean that quick sketch that gives an idea of what the site or application you are planning to build will look like.

Further more with Lumzy, you can create prototypes of how the site or application will function by adding events within your Lumzy controls. For instance, what happens when the user clicks a button? You can create Message Alerts, Page navigation or Links to external content, when your client interacts with your Mockup, yet with the hand drawn feel of a sketch.

Requirements: -
Demo: http://lumzy.com/app
License: License Free

• 4 Comments

You can find a tool for just about anything online, there’s only one problem: they cost money, and in some cases, lots of it! Many online tools offer a free basic package for anyone to use, but these packages are often strictly limited, rendering these tools practically useless until you stump up the cash. In most cases, however, there are free alternatives available, many of which are very, very good indeed.

Below, you’ll find 15 Best Free Online Tools for Web Design and Development. Rather than narrow our focus, we’ve covered various aspects of the design and development process, to include the admin side of freelancing or running a small business.

No two tools listed below perform the same function; we’ve chosen our favorite tool for doing each job. You’ll find the best free online tool for project management, one for invoicing, one for screen sharing, one for instant messaging, one for mocking up layouts, and much more besides.

1. Redmine

Redmine is a great, free alternative to other pricey project management apps available online. It does pretty much everything you could possibly desire, albeit in a less polished way than some of its more expensive rivals. With Redmine, you can manage a large number of projects simultaneously, defining personal roles and assigning tasks to specific team members if necessary. You can track time and issues, create Gannt charts and calendars, create project wikis and forums, and manage documents and files.

2. Billing Boss

Billing Boss is a fantastic, free invoicing tool, designed especially for small businesses and freelancers, which lets you send an unlimited number of invoices to an unlimited number of clients, quickly and easily. All of your invoices are saved automatically and catalogued in a logical, understandable way. Billing Boss supports multiple currencies, is integrated with PayPal and is mobile friendly. You can even share your account with your bookkeeper or accountant.

3. Yuuguu

Yuuguu is a multi-platform screen-sharing tool, which allows Windows, Mac and Linux users to collaborate. You can quickly initiate an instant messaging session with a client or team member, sharing each others’ screens at the touch of a button. It’s perfect for working together on document presentations or for writing and editing documents in a group.

With Yuuguu, there’s nothing to download at either end, which means you can start sharing and communicating in seconds. The free Yuuguu package includes unlimited use with other Yuuguu users and 100mins/month use with non-Yuuguu users, as well as up to 5 participants in a single session. (more…)

• 68 Comments

PHP hide_email() is a PHP function to protect the E-mail address you publish on your website against bots or spiders that index or harvest E-mail addresses for sending you spam. It uses a substitution cipher with a different key for every page load.

PHP hide_email() encrypts your E-mail address and generates the javascript that decrypts it. Most bots and spiders can’t execute javascript and that is what makes this work. A visitor of your web page will not notice that you used this script as long as he/she has javascript enabled. The visitor will see “[javascript protected email address]” in stead of the E-mail address if he/she has javascript disabled.

You can also use the generator if you have no PHP support on your web server. Change the E-mail address into your own E-mail address and press “Generate”. Cut and paste the generated XHTML into your own web page.

Requirements: -
Demo: http://www.maurits.vdschee.nl/php_hide_email/
License: License Free

• 12 Comments

New York Times online had an article which showed a road in Brooklyn that had been reconstructed to make it safer and more pleasing to the eye. To show the difference in the reconstruction project, they showed a before and after picture using Flash that let the visitor drag a slider over the images, which were sandwiched with one on top of the other, so that you could easily see how dramatic the changes were.

CatchMyFame found this very useful and immediately created Before/After jQuery Plugin for the same purpose. The possibilities for this plugin are endless. Doctors can have before and after images of patients, Photoshop users can show the before and after differences between images, remodelers can show the before and after images of projects and on and on. This plugin weighs in at only 7K and can be used multiple times on a page.

Requirements: jQuery Framework
Demo: http://www.catchmyfame.com/jquery/demo/8/
License: Creative Commons License

• 5 Comments