25+ New Resources, Tools, Apps & Handpicked Goodies For Web Developers & Designers

November 4, 2012 — 1 Comment

As web developers and web designers, we constantly looking at the sheer amount of new resources, tools and applications that we can tap into increases exponentially with time.

And here is just a quick look at some recently created resources that deserve your attention — everything from new CSS and HTML frameworks, things for WordPress, to some great jQuery plugins and some awesome apps that deserves your attention to some great news items that developers, designers and anyone else who like news about the iOS 6.0.1 update, the lanuches of GitHub Training or ColourLovers Creative Market and anything else I’ve missed in the industry.

JavaScript & jQuery

Uiji.js

uiji is jQuery in reverse. Instead of using CSS selectors to find elements, you use the same syntax to create elements.

Adaptor

Adaptor is a light-weight content slider that aims to provide a simple interface for developers to create cool 2D or 3D slide animation transitions. Added with 3D support for webkit and Firefox, all other browsers will fallback gracefully to a simple fade transition when using the 3D effects.

Responsive-Content

A jQuery plugin that helps you serve different content to different devices.  Responsive Content is used to load content that is appropriate to the current device’s screen size.

It is typically used alongside Responsive Design techniques. Note however that Responsive Design and Responsive Content act on different levels: given a particular screen width, the former applies a particular styling to the same content – whereas the latter actually loads different content.

It can be used subtly – for example to cause smaller images to be loaded on smaller devices – or to deliver radically different content to different screen widths or device capabilities.

ZyngaScroller

jQuery.zyngaScroller.js is a jQuery plugin that wraps the excellent Zynga Scroller as a simple jQuery plugin with a couple new additions: (1) Real-time collaboration is now possible by leveraging the SignalR hook baked into the jQuery.signalRamp.js plugin, and (2) the version of EasyScroller.js that this project uses is different than the original Zynga Scroller with collaboration hooks and support for IE8 and above.

Lean Slider

The Lean Slider is a simple jQuery image slider built on the principles of Progressive Enhancement. Unlike other sliders it does not provide any styling or fancy transition effects. It simply provides a javascript framework (slideshow functionality, navigation controls, callback functions etc.) for you to build a slider on top of.

jResize

jResize is a responsive web development tool, built in jQuery to assist the workflow of developers on responsive projects. There are various tools for responsive development, iframes at different widths embedded in the page, and the tedious resizing of the browser. So here’s a different approach which grabs all your HTML, and resizes it inside the browser when you click the width you want. It’s dead simple.

TypeScript

TypeScript starts from the syntax and semantics that millions of JavaScript developers know today.

With TypeScript, you can use existing JavaScript code, incorporate popular JavaScript libraries, and be called from other JavaScript code.

TypeScript compiles to clean, simple JavaScript code which runs on any browser, in Node.js, or in any other ES3-compatible environment.

Desktop, Mobile & Web Applications

Scripted Editor

Scripted is a fast and lightweight code editor with an initial focus on JavaScript editing. Scripted is a browser based editor and the editor itself is served from a locally running Node.js server instance.

Grid Displayer

Grid Displayer is a boomarklet that displays the grid of both Twitter Bootstrap (fixed and fluid grid) and Foundation (2.0 and 3.0). It works with Firefox and WebKit browsers.

Solidify

Solidify by Zurb lets you create clickable prototypes from sketches, wireframe, or mockup. Validate user flows on any device by performing user tests in person, remotely, or on your testers own time to get the feedback you need.

Simply Testable

Simply Testable is a free web-based tool that will save you pleanty of time and will take the pain out of routine front-end web testing. It will validate your HTML and give you a detailed overview report of your entire site’s successes and failures.

CSS, Frameworks, HTML5, @font-face & Responsive Goodies

Ligature Symbols

Ligature Symbols is a free (licensed under the SIL Open Font License) icon webfont with ligature features. Designed by Kazuyuki Motoyama, there are over 250 icons in the set, covering every possible use and also includes 30+ common logos.

Simple Grid

Simple Grid was created for developers who need a barebones grid. Simple Grid works well with 1140px layouts but easily adapts to any size of layout. With fluid columns, Simple Grid is responsive down to mobile.

The twelve column structure of Simple Grid easily divides into columns of two, three, four or six, giving developers numerous layout possibilities.

Viewport Resizer

Viewport resizer is a browser-based tool to test any website’s responsiveness. Just save the bookmarklet, go to the page you want to test, click on your created bookmarklet and check all kinds of screen resolutions of the page.  The smartest way to share your defined environment of devices and breakpoints directly with your team and client.

One% CSS Grid

One% CSS Grid is a 12 column fluid CSS grid system. It’s been designed as a base for building responsive web layouts easily, quickly and with minimum effort. You don’t have to take care of resizing and rearanging your layout for each platform separatelly. One% CSS Grid will do all this for you.

One% CSS Grid is a percentage based grid system, it means that it will perfectly adapt to all screen resolutions (mobile, tablets and big screens).

One% CSS Grid has 2 starting options, one which fits 1280px screens (in full screen view) and another one which fits 1024px screens (in full screen view).

Deployd

Deployd is a platform that makes building complex backends simple. Build APIs for web and mobile apps in minutes instead of days. Unlike working with a traditional backend, there’s no boilerplate, or configuration. Deployd works right out of the box. The best part is that you can run it however and wherever you want – it’s free and open source.

BootMetro

BootMetro provides simple and flexible HTML, CSS, and Javascript for web apps that wants to use the “Windows 8 MetroUI” style, without the need to run on Windows 8. It is built on top of Twitter Bootstrap and inspired by the Metro UI CSS by Sergey Pimenov.

Usergrid

Usergrid is a cloud-based data platform that manages objects and aids in the development of mobile client applications. It provides a core set of commonly used social media application objects, including a rich user model, as well as the ability to create new objects and object collections.

RWD Grid

rwdgrid is just another Grid system based on popular 960grid , which is responsive and ranges from mobile, tablet, laptops and wide screen displays. Naming convention of this grid system is similar to 960 grid system, where underscore is replaced by hyphen (increases readabilty).

rwdgrid is having different Grid system made for 1200px+ Displays, 960px+ Displays, 720px+ Displays and Mobile screens. This can be used as a base grid system that will help you to build responsive webdesign with your existing proficency over popular grid systems.

Makisu

Makisu is an experimental CSS 3D dropdown concept, wrapped up in a jQuery plugin. To view the demo you will need a CSS 3D capable browser, such as Chrome.

Golden Bootstrap

Golden Bootstrap is a bunch of less written css rules giving you the divine power of using golden ratio sized columns with Bootstrap.

WordPress Frameworks, Themes, Plugins

Frank WordPress Theme

Frank is a responsive WordPress theme with its main focus on speed – no Javascript frameworks, no unnecessary images, just a simple, no-frills, screaming fast blog. Frank has several different layouts to choose from for your home page.

Most layouts let you specify the number of posts to show and from what categories. Templates can be stacked by any amount and order to give you the structure you need. Additionally, there are plenty of well-placed widgets that will give you that extra level of customization.

Shortcodes for Twitter Bootstrap

This is a plugin for WordPress that adds shortcodes for easier use of the Bootstrap elements in your content.  Bootstrap by Twitter is a fantastic resource with loads of ready-to-use elements like buttons, tabs and alerts. This plugins provides shortcodes for Bootstrap, so you can use the elements on your website, and in the content.

Seekr WordPress Theme

Seekr is a brand new responsive theme by Themes Kingdom that is designed to show off your articles and showcase your work in style. The theme has a powerful full-width featured homepage slider with must-see-effects. The theme is premium that is in a membership based site which cost $29 a year that will give you all of the current 44 wordpress themes in the themes kingdom collection

Books, Resources, Great News Items & Other Goodies

Move The Web Forward

Guide to getting involved with standards and browser development

Execute Book

Execute is a new book by Drew Wilson & Josh Long about executing on ideas immediately when inspired rather than following the normal rules.

Apple releases iOS 6.0.1

Apparently bought fixes for iPhone 5 OTA updates, keyboard glitches, WiFi performance and more.

Some great read about iOS 6.0.1 update

GitHub releases GitHub Training

GitHub the popular collaborative coding hub for coders has launched a brand new site to help anyone get started with its service and learn Git!

COLOURLovers launches Creative Market

The team at COLOURlovers has just launched Creative Market after raising $1.3M from SV Angel and CrunchFund. Creative Market is a place to buy and sell stock designs like icons, typefaces and themes and I was thinking could Creative Market hurt Envato Marketplace you know (themeforest, codecanyon, graphic river etc) would love to know your comments too.

One response to 25+ New Resources, Tools, Apps & Handpicked Goodies For Web Developers & Designers

  1. 

    ::::: Lean Slider :::::
    hai,
    Lean Slider is not working on IE8. anyone please help me.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s