Pull to refresh

Несколько интересностей и полезностей для веб-разработчика #24

Website development *JavaScript *
Доброго времени суток, уважаемые хабравчане. За последнее время я увидел несколько интересных и полезных инструментов/библиотек/событий, которыми хочу поделиться с Хабром.

Webhook


image

Webhook — это платформа для создания сайтов. Важно не путать со статическими генераторами, потому что это именно «CMS builder». Проект успешно завершил кампанию на Kickstarter 14 мая этого года, где смог собрать сумму в два раза большую, чем было необходимо. А буквально недавно состоялся релиз первой версии продукта. Webhook построен с использованием NodeJS, Grunt и Firebase для реалтайма, работает на Windows, Linux и Mac, внутри целая система виджетов со множеством вариаций на выходе, «Django-like templating» с помощью Swig JS, кроссплатформенная админ панель и еще целый ряд плюсов.

# 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 — это язык программирования, который предназначен расширить базовые возможности JavaScript. Хочу обратить ваше внимание на том, что проект от Microsoft и это целое событие, поскольку TypeScript еще и первый публичный репозиторий на официальном аккаунте корпорации на 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


«Живой список» лучших видео с лекций и конференций по Python. Продублирую содержимое репозитория на момент публикации подборки:

2009


2010


2011


2012


2013


2014


KeystoneJS — CMS на Node.js




Virtual DOM


Когда речь идет о реально больших веб-приложениях, то разработчикам очень трудно или даже невозможно проследить за всеми изменениям DOM древа. В тоже время каждое обновление DOM, может очень сильно повлиять на работоспособность проекта, все будет происходить медленно и с задержками. Кстати об этом есть замечательная статья на Хабре «Рендеринг WEB-страницы: что об этом должен знать front-end разработчик» от пользователя skutin. Virtual DOM — это коллекция модулей обеспечивающая декларативное представление DOM в вашем проекте. То есть появляется возможность записывать все изменения состояния в виртуальное древо, а только потом обновлять DOM. Вообще проект заслуживает отдельной статьи, сначала была описана идея «React’s diff algorithm», затем появился концепт «Virtual DOM and diffing algorithm», а только потом реализация и принципы работы.

Custom Elements и Component Kitchen



Веб-компоненты хоть и медленно, но уверенно приходят в нашу с вами жизнь. Об этой спецификации часто пишут на западе, ее достаточно рьяно продвигают крупные компании. Ну и от себя скажу, что это новый шаг в развитии веб-стандартов, который открывает для разработчиков новые возможности и меняет представление о семантике. Именно поэтому хочу поделиться двумя пополняемыми коллекциями различных веб-компонентов: Custom Elements и Component Kitchen.

Offline и Select



В предыдущих подборках я уже делился проектами замечательной компании HubSpot. Но с удивлением для себя обнаружил, что еще не давал ссылок на Offline для самого легкого способа определения онлайн/оффлайн режима пользователя и вывода соответствующего сообщения на экран в разных темах, и Select для создания простого кастомного селекта без использования сторонних библиотек.

Западные мысли или что стоило бы перевести на Хабре:




Говорит и показывает Хабр:




Напоследок:


  • Новость для маководов - вышел Tower 2, вероятно лучший GUI клиент для git

  • rome.js — наверное, первый нормальный дата-пикер независимый от сторонних библиотек.
    UPD: как подсказал в комментариях rinnaatt есть еще замечательный и независимый Pikaday
  • Headstart — фронтэнд фреймворк и сборщик.
  • VIDE.js — jQuery плагин для простоты создания видео-бэкграунда.
  • PrettyEmbed.js — заставляет YouTube вставки выглядеть лучше (ужасное описание, посмотрите на демо страничку и сразу все поймете).
  • google-api-nodejs-client
  • Justified.js — «jQuery Plugin to create Justified Image Gallery».
  • learning-angular — набор всех необходимых фрагментов кода для изучения Angular.
  • go-underscore — набор наиболее востребованных функций для Go.
  • grunt-svgstore — замечательный плагин для создания .svg спрайтов.
  • DomFlags — Chrome расширение позволяет создавать шорткаты при работе с DOM.
  • Rainbowstream — твиттер клиент в вашем терминале
  • Onebody — прозвучит мягко говоря очень странно, но это социальная сеть для церквей на Ruby on Rails.
  • На Smashing Magazine рекомендовали электронную книгу для стартаперов по управлению проектами "Making it right". Больно знакомая символика на обложке…

    image


                                                         Предыдущая подборка (Выпуск 23)

Приношу извинения за возможные опечатки. Если вы заметили проблему — напишите пожалуйста в личку.

Спасибо всем за внимание.
Only registered users can participate in poll. Log in, please.
Понравилась ли Вам подборка?
89.55% Да 703
10.45% Нет 82
785 users voted. 145 users abstained.
Tags:
Hubs:
Total votes 101: ↑90 and ↓11 +79
Views 59K
Comments 27
Comments Comments 27

Posts