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

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

Docpad

The “sensational” project on Twitter and GitHub. According to the developers, “Docpad removes restrictions and removes the gap between professionals and beginners. Designers and developers can now create websites faster than ever before. ” Docpad is a static site generator written in Node.js. It allows you to easily create patterns and blocks. It works with PHP, Ruby, CoffeeScript, etc. It has file wathing, live reload and most importantly “amazing plugin system”. A big plus is the instructional video (albeit in English).

Hammer.js

Very functional script for working with touch events. There is both a standalone library and a jQuery plugin. Supports Tap, DoubleTap, Swipe, Drag, Pinch and Rotate. More than 6000 GitHub starov per month.



Example:

Hammer(el).on("swipeleft", function() { alert('you swiped left!'); }); 

')

Useful CSS crib for writing letters

List.js

Words from the author of the project Jonny: "Tiny, inconspicuous, simple, but still very powerful and incredibly fast library on vanilla JavaScript, which adds search, filters, sorting to HTML lists, tables and anything else."



Example of searching the list :

Javascript

 var options = { valueNames: [ 'name', 'born' ] }; var userList = new List('users', options); 

Everything!

HTML

  <div id="users"> <input class="search" placeholder="Search" /> <button class="sort" data-sort="name"> Sort by name </button> <ul class="list"> <li> <h3 class="name">Jonny Stromberg</h3> <p class="born">1986</p> </li> <li> <h3 class="name">Jonas Arnklint</h3> <p class="born">1985</p> </li> <li> <h3 class="name">Martina Elm</h3> <p class="born">1986</p> </li> <li> <h3 class="name">Gustaf Lindqvist</h3> <p class="born">1983</p> </li> </ul> </div> 

Bearder WordPress Theme

Finally:

• On November 22, exactly 50 years have passed since the death of John F. Kennedy. Killing Kennedy has developed a website for this event at National Geographic. Since the habr rules say that this is not a place for politics, I will say a few words only about this site. Firstly: it is very informative and contains many interesting facts. Secondly: this is the “perfect” example of how and when to use Parallax Scrolling. Recently, parallax has become a kind of trend and developers are trying to use it where it is not needed.
• Very interesting test for front-end developers.
• Kraken-js - express-based Node.js web application bootstrapping module by PayPal
• JavaScript API for Gmail
• jQuery Auto Fix Anything
• AutoJS - a simple script for auto-complete
• Webcode is a Mac application for creating and animating vector graphics from exports to SVG or JS Canvas
• Ionic Framework - CSS framework for mobile devices
• Videooconverter.js

Previous selection (Release 8)