DevRes - Development Resources

December 19th, 2012 at 4:43PM

The Opa Framework for JavaScript

Okay, you’ll really have to look into it yourself in order to fully understand the boundless functionality of this framework. The crux of it being that you can write all of your code, client, server and data access layer all into a single module, and the opa framework will do the rest.

It’s Non-blocking, supports type-checking (see also TypeScript), includes jQuery, supports NodeJS/MongoDB/CouchDB on the server with Database Automation objects, supports MVC design patterns, and is basically awesome.

It’s going to be a commitment to start using it, but if it’s right for you it could well be worth the time getting to know it.

http://opalang.org/

Write simultaneously the frontend and backend code, in the same language, within the same module. Even better: the Opa Slicer automates the calls between client and server. No more manually written AJAX calls or value serialization!

And when auto is not enough, add hints to the code to enforce client or server-side, privacy, synchronous or asynchronous.

2 notes Source: opalang.org #opa #javascript #nodejs #jquery #mongodb #counchdb #mvc

May 16th, 2012 at 12:57PM

Mobile development with HTML5

Take a look at these three articles on mobile development with HTML5, then checkout some of the frameworks and plugins below for a plethora of resources!

Blogs and examples

How I built the Hacker News mobile web app:
http://cheeaun.com/blog/2012/03/how-i-built-hacker-news-mobile-web-app

IBM: Create offline web applications on mobile devices with HTML5:
http://www.ibm.com/developerworks/web/library/wa-offlineweb/

MSDN: Using HTML5 to create mobile experiences:
http://msdn.microsoft.com/en-us/magazine/hh975346.aspx

Frameworks and resources

jQuery Mobile - Touch-Optimized Web Framework for Smartphones & Tablets:
http://jquerymobile.com/

jQTouch - A Zepto/jQuery plugin for mobile web development on the iPhone,
Android, iPod Touch, and other forward-thinking devices.
http://www.jqtouch.com/

KendoUI - Build HTML5/JavaScript mobile apps that automatically transform to the native look-and-feel of iOS, Android and BlackBerry:
http://www.kendoui.com/

Skeleton - A Beautiful Boilerplate for Responsive, Mobile-Friendly Development:
http://getskeleton.com/

PhoneGap - the only open source mobile framework that supports 7 platforms:
http://phonegap.com/

Titanium SDK - Create rich native iOS, Android, hybrid, and mobile web apps from a single JavaScript-based SDK:
http://www.appcelerator.com/platform/titanium-sdk

FitVid.js - A lightweight, easy-to-use jQuery plugin for fluid width video embeds.
http://fitvidsjs.com/

5 notes #android #blackberry #html5 #ios #jquery #jquery mobile #kendoui #phonegap #skeleton #video #windows mobile #jqtouch

February 16th, 2012 at 12:23PM

Developer Cheat Sheets

7 notes #YUI #ajax #cheat sheet #extJs #frameworks #javascript #jquery #mootools #mysql #php #prototype #ruby #web development #Wordpress

October 24th, 2011 at 11:15AM

JavaScript, A few nice JavaScript add-on library’s

I’ve recently discovered quite a plethora of add-on libraries for JavaScript that are compatible with several other libraries (such as jQuery). Here are a couple of neat little additions to your ever-growing library of JavaScript tools and helpers.

Underscore

Underscore is a utility-belt library for JavaScript that provides a lot of the functional programming support that you would expect in Prototype.js (or Ruby), but without extending any of the built-in JavaScript objects. It’s the tie to go along with jQuery’s tux.

Underscore provides 60-odd functions that support both the usual functional suspects: map, select, invoke — as well as more specialized helpers: function binding, javascript templating, deep equality testing, and so on. It delegates to built-in functions, if present, so modern browsers will use the native implementations of forEach, map, reduce, filter, every, some and indexOf.

Backbone

Backbone supplies structure to JavaScript-heavy applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface

Backbone’s only hard dependency is Underscore.js.

For RESTful persistence, history support via Backbone.Router and DOM manipulation with Backbone.View, include json2.js, and either jQuery ( > 1.4.2) or Zepto.

Knockout

knockout.js helps you simplify dynamic JavaScript UIs using the Model-View-ViewModel (MVVM) pattern.

By encapsulating data and behavior into a view model, you get a clean, extensible foundation on which to build sophisticated UIs without getting lost in a tangle of event handlers and manual DOM updates.

11 notes #Backbone #JavaScript #Ajax #UI #Underscore #Knockout #Prototype #jQuery

June 10th, 2011 at 2:55PM

Jcrop - Deep Liquid

Jcrop is the quick and easy way to add image cropping functionality to your web application. It combines the ease-of-use of a typical jQuery plugin with a powerful cross-platform DHTML cropping engine that is faithful to familiar desktop graphics applications.

1 note #jQuery #Image Tools #JavaScript

June 10th, 2011 at 2:51PM

MotionCAPTCHA – Stop Spam, Draw Shapes - Joss Crowcroft

MotionCAPTCHA is a jQuery CAPTCHA plugin, based on the HTML5 Canvas Harmony procedural drawing tool by Mr Doob and the $1 Unistroke Gesture Regonizer algorithm (and the more recent Protractor algorithm improvement), requiring users to sketch the shape they see in the canvas in order to submit a form.

At the moment, it’s just a proof-of-concept – it only uses client-side gesture recognition, and doesn’t really have IE support – but the next releases will feature progressive enhancement and the ability to use this in production environments as a serious CAPTCHA alternative

3 notes #captcha #Canvas #jQuery #HTML5

June 8th, 2011 at 3:56PM

jQuery and JavaScript Image Galleries

Galleria

Galleria is a JavaScript image gallery framework built on top of the jQuery library. The aim is to simplify the process of creating professional image galleries for the web and mobile devices.

Galleria

PhotoSwipe (mobile)

PhotoSwipe = Image Gallery for mobile and touch devices

PhotoSwipe from Computerlovers on Vimeo.

PanelGallery

Slide Viewer Pro

Galleriffic

Galleriffic is a jQuery plugin that provides a rich, post-back free experience optimized to handle high volumes of photos while conserving bandwidth

Gallerific

s3Slider

Popeye

Popeye generates an inline image gallery from an unordered list of images. The gallery features clever inline image enlargement, i.e. the enlarged image stretches out over the site content without adding a visual overlay of the whole site. It stays fixed with one edge to its original coordinates, so that a sense of cohesiveness is created in the user interface and interaction.

Popeye

FlickrGalery

flickrGallery is an open-source photo gallery for jQuery that allows you to dynamically pull images from a photoset in Flickr.

FlickrGallery

ImageFlow

ImageFlow is an unobtrusive and userfriendly JavaScript image gallery.

ImageFlow

GalleryView (jQuery)

GalleryView is a content-gallery plugin capable of displaying any HTML content in an animated gallery view.

GalleryView

jQuery Virtual Tour

This is an extension to the simple panorama viewer that allows you to play a little bit more with jQuery by adding interactivity to transform some panoramic views into a virtual tour!

jQuery Virtual Tour

3 notes #gallery #mobile #JavaScript #jQuery #s3 #flickr

May 13th, 2011 at 5:18PM

JavaScript and HTML5 Charts

Highcharts

License: Free for Open-source / Paid commercial

http://www.highcharts.com/

Highcharts is a pure JavaScript charting library for those who want a stand-alone charting solution with the ability to add and customise the solution.

License and Pricing: http://www.highcharts.com/license

Zingchart

License and Pricing: https://www.zingchart.com/store/buy.php

http://www.zingchart.com/

More than a Dozen Chart Types
Handles Massive Data Sets (10,000 points and more)
Fly thru Chart Data with Zooming, Scrolling, and Filtering
Build Interactive and Drillable Graphs
Live Data Feed Support to Update Charts in Realtime
Flash (AS3) Charts
HTML5 Canvas Charts
JSON
Update Graphs with Ajax
Control Charts with Full JavaScript API
And more…

jqPilot (open source)

License: Free / open-source

http://www.jqplot.com/

jqPlot is an open source project by Chris Leonello.
jqPilot supports Log-scale-axis, drag and drop of data points with update events adn automatically computer trend lines.

gChart (Google Charts API for JQuery)

License: Free / Open-source

http://keith-wood.name/gChart.html or http://plugins.jquery.com/project/gchart

Add Google Charts to your pages via a simple JavaScript interface. You provide the data and Google does the rest.

Complete coverage of the Google Chart API;
Show your data on line, X-Y, bar, pie, radar, or scatter charts;
Control legend appearance, chart background, and title;
Control axis placement, content, and appearance;
Control line appearance and fills;
Add markers or dynamic icons to your chart;
Display maps with country or US state data;
Show a Google meter or a Venn diagram;
Generate QR codes or mathematical formulae;

JS Charts

JavaScript based chart generator that requires little or no coding.

License and Pricing: http://www.jscharts.com/buy (Free for non-commercial)

jQuery Visualize: accessible charts using canvas

Turn any HTML Data-table into a nice css styled chart using jQuery!

jQuery + Flot: Plots, Canvas and Charts

A charting example using PHP, jQuery and Flot

Flot - Plotting for jQuery

XML/SWF Charts

Create an XML source to describe a chart, then pass it to this tool’s flash file to generate the chart. The XML source can be prepared manually, or generated dynamically using any scripting language (PHP, ASP, CFML, Perl, etc.)

Plotkit - Chart plotting

PlotKit is a Chart and Graph Plotting Library for Javascript. It has support for HTML Canvas and also SVG via Adobe SVG Viewer and native browser support.

Emprise Javascript charts

Free version has no source-code and fewer charting options than the premuim versions

#chart #html5 #jquery #JavaScript

April 12th, 2011 at 10:41AM

jQuery Mobile

jQuery mobile framework takes the “write less, do more” mantra to the next level: Instead of writing unique apps for each mobile device or OS, the jQuery mobile framework will allow you to design a single highly branded and customized web application that will work on all popular smartphone and tablet platforms.

LINK: http://jquerymobile.com/

4 notes Source: jquerymobile.com #ajax #android #iphone #jQuery #JavaScript #Mobile