Browse By

14 Collection Of Resources For An Up To Date Web Developer

Almost a month has passed since the last web design & web development resources article and it is time for a new one. This one doesn’t contain as many tools and plugins as the last one, but has a few really good and useful.

34 Responsive Grid System

34grid_com

34Grid is a Responsive Grid System based on “equally distributed columns” layout basis. In contrast to other great grid systems (@see bottom of page), 34Grid provides equally distributed columns for each row. (and also column complements for inequal distributions)

Makisu: CSS 3D DROPDOWN CONCEPT

soulwire_github_com_Makisu

Opal

opalrb_org

Opal is a ruby to javascript compiler. It is source-to-source, making it fast as a runtime. Opal includes a compiler (which can be run in any browser), a corelib and runtime implementation. The corelib/runtime is also very small (10.8kb gzipped).

Sly

darsa_in_sly

jQuery plugin for one-directional scrolling with item based navigation support

Orion: Open Source Platform For Cloud Based Development

eclipse_org_orion

Responsive design testing tool

lab_maltewassermann_com_viewport

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.

This bookmarklet should not replace a real device simulation. It rather helps you, your team and client testing statuses, transitions, text length etc. throughout different device types.

Emmet — the essential toolkit for web-developers

docs_emmet_io

Emmet (previously known as Zen Coding) is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow.

Basically, most text editors out there allow you to store and re-use commonly used code chunks, called “snippets”. While snippets are a good way to boost your productivity, all implementations have common pitfalls: you have to define the snippet first and you can’t extend them in runtime.

Emmet takes the snippets idea to a whole new level: you can type CSS-like expressions that can be dynamically parsed, and produce output depending on what you type in the abbreviation. Emmet is developed and optimised for web-developers whose workflow depends on HTML/XML and CSS, but can be used with programming languages too.

Cedvel, an application for designing grid systems

cedvel_com

Cedvel aims to ease the grid design process and help you explore more alternatives. It is still far from being finished but you can test the prototype and if you do so, please send in any feedback regarding your experience.

duri.me: a super simple dataURI tool

duri_me

Jim Knopf: a small JavaScript library to create knobs using SVG

eskimoblood_github_com_jim-knopf

Cut&Slice me

cutandslice_me

Use Cut&Slice me to export your assets to different devices in seconds. Improve your workflow by just naming your layers.

Adobe Edge Inspect

html_adobe_com_edge_inspect

Pods

podsframework_org

Pods is a framework for WordPress that allows you to create, extend, manage, and deploy customized content types and fields.

Stripe

stripe_com

Stripe makes it easy to start accepting credit cards on the web today. You don’t need a merchant account or gateway. Stripe handles everything, including storing cards, subscriptions, and direct payouts to your bank account.

Stripe.js lets you build your own payment forms while still avoiding PCI requirements.

ReactiveUI: Reactive Programming for WPF, Silverlight, WinRT, and Windows Phone 7

reactiveui_net

Ratchet: Prototype iPhone apps with simple HTML, CSS and JS components.

maker_github_com_ratchet

Leave a Reply

Your email address will not be published. Required fields are marked *