Geekly Articles each Day
📜 ⬆️ ⬇️

Some interesting and useful things for web developer # 24

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

Webhook


image

Webhook is a platform for creating websites. It is important not to be confused with static generators, because this is the “CMS builder”. The project successfully completed the Kickstarter campaign on May 14 of this year, where it was able to collect a sum twice as large as was necessary. And just recently the release of the first version of the product. Webhook is built using NodeJS, Grunt and Firebase for realtime, works on Windows, Linux and Mac, inside there is 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 advantages.

# 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 designed to extend the basic features of JavaScript. I want to draw your attention to the fact that the project from Microsoft and this whole event, since 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


"Live list" of the best videos from lectures and conferences on Python. I duplicate the contents of the repository at the time of publication of the collection:

2009


2010


2011


2012


2013


2014


KeystoneJS - CMS on Node.js




Virtual dom


When it comes to really large web applications, it’s very difficult or even impossible for developers to follow all changes to the DOM tree. At the same time, every DOM update, 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 this” 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 is possible to record all state changes in a virtual tree, and only then update the DOM. In general, the project deserves a separate article, first the idea of “React's diff algorithm” was described, then the concept of “Virtual DOM and diffing algorithm” appeared , and only then the implementation and principles of operation.

Custom Elements and Component Kitchen



Web components, though slowly but surely, come to our life. About this specification is often written in the west, it is quite zealously promoted by large companies. Well, from myself I will say that this is a new step in the development of web standards, which opens up new possibilities for developers and changes the idea of ​​semantics. That is why I want to share two replenishable collections of various web components: Custom Elements and Component Kitchen .

Offline and Select



In previous selections I have already shared the projects of the wonderful company HubSpot. But I was surprised to find that I 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 various topics, and Select to create a simple custom select without using third-party libraries.

Western thoughts or what would translate to Habré:




Says and shows Habr:




Finally:


  • News for makovods - Tower 2 is released, probably the best GUI client for git

  • rome.js is probably the first normal data picker independent of third-party libraries.
    UPD: as suggested in the comments rinnaatt there is still a wonderful and independent Pikaday
  • Headstart is a frontend framework and builder .
  • VIDE.js - jQuery plugin for easy video background creation.
  • PrettyEmbed.js - makes YouTube insert look better (a 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 collection of all the necessary code snippets for learning Angular.
  • go-underscore is a collection of the most requested features 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 very strange, but it is a social network for churches on Ruby on Rails.
  • Smashing Magazine recommended an e-book for project management start-ups " Making it right ". Painfully familiar symbolism on the cover ...

    image


Previous selection (Release 23)

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

Thank you all for your attention.

Source: https://habr.com/ru/post/231151/

More articles:


All Articles