ilusha_sergeevich July 27, 2014 at 17:50

A few interesting and useful things for web developer # 24

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

Webhook

Webhook is a platform for creating sites. It is important not to be confused with static generators, because this is exactly the “CMS builder”. The project successfully completed the Kickstarter campaign on May 14 this year, where it was able to raise the amount twice as much as was necessary. And just recently, the first version of the product was released. Webhook is built using real-time NodeJS, Grunt and Firebase , runs on Windows, Linux and Mac, inside a whole system of widgets with many variations on the output, "Django-like templating" using Swig JS , a cross-platform admin panel and a number of pluses.

# Install Webhook through npm
npm install grunt-cli wh
# Create your first site
wh create my_awesome_site
# Load the local runserver
cd my_awesome_site
wh serve
# Make your website live
wh deploy

TypeScript

TypeScript is a programming language that is designed to extend the basic capabilities of JavaScript. I want to draw your attention to the fact that the project from Microsoft is a whole event, because TypeScript is also the first public repository on the official account of the corporation on GitHub.

"Starts from JavaScript, Ends with JavaScript":

class Point {
    x: number;
    y: number;
    constructor(x: number, y: number) {
        this.x = x;
        this.y = y;
    }
    getDist() { 
        return Math.sqrt(this.x * this.x + 
        this.y * this.y); 
    }
}
var p = new Point(3,4);
var dist = p.getDst();
alert("Hypotenuse is: " + dist);

Py must watch

A live list of the best videos from lectures and conferences in Python. Duplicate the contents of the repository at the time of publication of the collection:

2009

David Beazley: Inside the Python GIL

2010

2011

Raymond Hettinger: API Design: Lessons Learned

2012

2013

2014

KeystoneJS - CMS on Node.js

Virtual dom

When it comes to really large web applications, it is very difficult or even impossible for developers to follow all the changes in the DOM tree. At the same time, each update of the DOM can greatly affect the performance of the project, everything will happen slowly and with delays. By the way, there is a wonderful article on Habr "Web page rendering: what the front-end developer should know about it" from the user skutin . Virtual DOM is a collection of modules that provides a declarative representation of the DOM in your project. That is, it becomes possible to write all state changes to the virtual tree, and only then update the DOM. In general, the project deserves a separate article, at first the idea of "React's diff algorithm" was described , then the concept appeared"Virtual DOM and diffing algorithm" , and only then implementation and principles of work.

Custom Elements and Component Kitchen

Web components, though slowly but surely, are coming into our lives. This specification is often written in the West, it is zealously promoted by large companies. Well, I’ll say on my own that this is a new step in the development of web standards, which opens up new opportunities for developers and changes the idea of semantics. That is why I want to share two replenished collections of various web components: Custom Elements and Component Kitchen .

Offline and Select

In previous selections, I already shared the projects of the wonderful company HubSpot. But he was surprised to find that he had not yet provided links to Offline for the easiest way to determine the online / offline user mode and display the corresponding message on the screen in different topics, and Select to create a simple custom selection without using third-party libraries.

Western thoughts or what it would be worth translating into Habré:

Says and shows Habr:

Finally:

News for Macro - Tower 2, probably the best GUI client for git, has been released
rome.js - probably the first normal data picker independent of third-party libraries.
UPD: as suggested in the comments of rinnaatt there is still a wonderful and independent Pikaday
Headstart is a front - end framework and builder .
VIDE.js - jQuery plugin for ease of creating a video background.
PrettyEmbed.js - makes YouTube inserts look better (terrible description, look at the demo page and immediately understand everything).
google-api-nodejs-client
Justified.js - “jQuery Plugin to create Justified Image Gallery”.
learning-angular - a set of all the necessary code fragments for learning Angular.
go-underscore - a set of the most popular functions for Go.
grunt-svgstore is a great plugin for creating .svg sprites.
DomFlags - Chrome extension allows you to create shortcuts when working with the DOM.
Rainbowstream - twitter client in your terminal
Onebody - to put it mildly, it’s very strange, but it’s a social network for churches on Ruby on Rails.
Smashing Magazine recommended the e-book for project management startups “ Making it right .” Painfully familiar symbolism on the cover ...

Previous Collection (Issue 23)

I apologize for any typos. If you notice a problem - please write in a personal.

Thank you all for your attention.

Only registered users can participate in the survey. Please come in.

Do you like the selection?

89.5% Yes 703
10.4% No 82

Tags: