Several interesting and useful things for a web developer (release 8)

Good day, dear habravchane. Recently, I saw some interesting and useful tools / libraries / events that I want to share with Habr.

Riot.js - The 1kb client-side MVP framework

A bit of statistical truth:







The “parent” project Moot is also very cool and demonstrates what the forum should be like.

Ink - Responsive Email Framework

Just want to say that this is a product from ZURB - from the creators of Fundation. Ink is more like Skeleton and it has its own Boilerplate, as well as several ready-made layouts and a small Inliner tool that will send you your layout in the mail. On Habré there are a number of articles about the layout of mail letters and I would compare Ink with a set of useful techniques / snippets from these articles. In general, the framework is very useful, especially for beginners.

')

Supports the following E-mail clients:

• Apple Mail (5 and 6)
• Microsoft Outlook (2000, 2002, 2003, 2007, 2010, 2011, 2013)
• Mozilla Thunderbird (3, latest)
• Android Native (2.3, 4)
• iOS Native (6, 7)
• AOL Mail
• Gmail
• Yahoo! Mail
• Outlook.com

Sir trevor

Convenient interface editor. Nice minimalistic design. Ease of use and a wide selection of settings.

Installation:

Sit-trevor.js requires jQuery, Underscore and Eventable to work .

<form> <textarea class="js-st-instance"></textarea> </form> 

 <script> new SirTrevor.Editor({ el: $('.js-st-instance') }); </script> 

Result:

 { "data": [{ "type": "text", "data": { "text": "Hello, my name is **Sir Trevor**" } }] } 

Snazzymaps - JS Style Collection for Google Maps

Bear CSS

Eerily simple, but very useful tool. Bear CSS takes all the class names and identifiers from your HTML and generates CSS. In fact, it is much more convenient, even more correct, to describe styles according to the principles of OCSS and SMACSS, when you see the structure of a document in front of you. Yes, with a preprocessor, you can also form a kind of tree, but you still have to mentally get distracted by the description of styles. Plus - do not waste time on a great many copy-paste. I advise you to try. Any other Sublime plugin would be ...

BLOKK Font - a convenient solution for fast mokapov.

PixelPumper (Mac App)

Great application for posting in Wordpress. Wonderful interface, usability of working with Retina images, setting up the publication schedule of articles and, most importantly, for free in the App Store .

Hummer (Mac App)

Compiles SASS (with Bourbon), CoffeeScript, HAML & Markdown did not buy just because of the lack of LESS . When publishing, it creates an HTTP server that allows you to test the project on different devices and refresh the page without reloading. But the most important thing is a set of special "Hamerovsky" tags:

• @stylesheet and @javascript , which combine existing styles and scripts.
• @path is a “smart path” to include files that works equally in different directories.
• @include similar in PHP.
• @placeholder for images and variables with HTML inside.
• @todo - HTML comments that are converted to a TODO sheet.

The bonus will be a number of free templates . A funny fact is that the product from the studio Riot (I discovered this by accident because of the logo), the project of which is also riot.js , which I mentioned above.

Finally:

• Relatively recently, I wrote about the “Future Revolution of Content Design” and here are the first prerequisites for how it will look: GitHub (the demo works in the latest builds of WebKit Nightly and Chrome Canary (in chrome: // flags enable Enable experimental WebKit features ).
  
  
• OAuth.io is an API (JavaScript, PhoneGap, iOS, Android, Flex) and a service that greatly simplifies interaction with more than 80 oAuth providers (Facebook, Twitter, VK, GitHub, Dropbox, and others).
• Thorax.js is the result of a high-quality “crossbreeding” of the Backbone and Handlebars frameworks to create large, scalable applications (from the developers of the world's largest retail network Walmart). There is also a Thorax yeoman generator .
• Drawingboard.js is an easy-to-use canvas drawing tool.
• Salvattore.js is an analogue of the popular jQuery Masonry, but with a CSS configuration.
• RECESS - linter / compiler for CSS and LESS from the Twitter team.
• Datauri is a simple and convenient online image converter in data uri ( repository on GitHub ).
• Noise Texture Generator and Long Shadows Generator - simple and can always come in handy.
• Actualvim - “Sublime Text 3 input mode powered by Vim itself”.
• Whenever - Cron jobs in Rub.
• CryptoJS.
• A collection of usable snippets for DevTools.
• Photo Pea is a free online PSD editor with basic functionality.

Previous selection (Release 7)