“Распарсить сайт” — словосочетание, которое повергало меня в уныние всего полгода назад. В моей голове сразу же проносились знакомые проблемы с настройкой фантома, или возней с селениумом. Мысли о возможной необходимости подменять useragent, пагинации и других действиях во время парсинга заставляли откладывать эту задачу в долгий ящик…

Но всё изменилось, когда я встретил Гуся. Мир парсинга заиграл новыми красками. Под катом я хочу показать несколько простых примеров, которые могут помочь распарсить непростые сайты.

Кстати, написав парсер, Гусь решил снять фильм про это, пока что вы можете насладиться трейлером:

Одинаковый код в нескольких местах — это боль. Сегодня я напишу пару слов про повторяющиеся куски классов. Люди давно придумали решение — можно вынести одинаковые методы и свойства в общий базовый класс, а если такового нет — использовать примеси. Существует миллион реализаций данного паттерна для JavaScript, я хочу детально остановиться на подходе, когда миксин попадает в цепочку наследования.

Проблема в картинках

Начнем с визуализации нашей проблемы. Допустим у нас есть два базовых класса и от них наследуются два дочерних класса.



В какой-то момент в дочерних классах появляется необходимость в одинаковом функционале. Обычная копипаста будет выглядеть на нашей схеме вот так:



Очень часто бывает, что данный функционал не имеет ничего общего с родительскими классами, поэтому выносить его в какой-то базовый класс нелогично и неправильно. Вынесем его в отдельное место — миксин. С точки зрения языка миксин может быть обычным объектом.



А теперь обсудим момент, ради которого написана вся статья — как правильно замешивать наш миксин в классы.

Эта статья не про ваши сладкие интерфейсы на реакте, ангуляре или что вы там используете? Это статья про те ситуации, когда у вас есть кучка jQuery лапши. Нет, пусть это будут горы jQuery лапши, завернутой во вьюшки бэкбона.

^{В статье используется библиотека Backbone.View.Elements}

Проблема первая: маловыразительные селекторы

Все мы видели лапшу, все мы знаем: лапша в JSе — наверно и в верстке не все хорошо. А раз все так, то код, скорее всего, кишит непонятными манипуляциями с домом. Читать такой код сложно, ведь надо, не упуская мысли автора о том, что здесь вообще происходит, держать в уме кучку невнятных названий для элементов. Итак, давайте придадим коду немножко выразительности:

_selectors: function () {
    return {
        elemName: '.block__elem-name'
    };
}

Сложим все селекторы в одном месте и дадим понятное название элементам, для выбора которых они нужны. Выбирать мы их, кстати, будем вот так:

this._elem('elemName');

вместо

this.$('.block__elem-name');

Вышла ноль пятая версия mvc фреймворка Autodafe для node.js. Код стало писать удобнее, кода теперь писать нужно меньше, ещё меньше. Скоро код писать не надо будет совсем, достаточно будет лишь подумать о нём.

Пример действия контроллера, которое совершает два асинхронных запроса к базе данных, компанует вьюшку index.html и отправляет ее клиенту (при этом отлавливая и обрабатывая все ошибки):

Site.prototype.index = function( response, request ){
  response.send({
    topic : this.models.topic.With( 'author', 'comments.author' ).find_by_pk( request.params.topic_id ),
    news  : this.models.news.find_all()
  });
}

Написаны подробные статьи про тонкости работы с контроллерами, авторизацию пользователей и работу с URL адресами.

И самое главное: переработано и подробно задокументировано демо с блогом. Блог не обладает богатым функционалом, но может служить хорошей отправной точкой для разработки своего приложения.

• Живое демо блога
• Статья описывающая работу блога
• Код блога на github

Ссылочки

• Живая демонстрация
• Код задокументированного файла из демки
• Да и вобще весь сайт autodafe.ws полностью работает на ADWiki
• Инструкция по установке ADWiki
• Проект на GitHub

Что ADWiki умеет:

• Парсить файлы Вашего проекта описанные на jsdoc
• Поднимать сайт с чистеньким дизайном на bootstrap
• Организовывать на сайте небольшой блог, где Вы сможете дополнять документацию статьями о проекте

Вышла версия 0.3 node.js фреймворка для разработки веб приложений Autodafe.

У фреймворка появился сайт autodafe.ws, который стремительно обрастает документацией и статьями. (Документация на сайте генерируется автоматически из кода, задокументированного по правилам jsdoc. Поэтому если вы хотите быстро поднять сайт с документацией вашего проекта, можете спросить меня «как?».

В новой версии фреймворка значительно улучшена работа с моделями, писать классы для сохранения данных стало удобнее, а сами они стали выглядеть красивее. Множественное задание атрибутов, их неявная фильтрация во время присвоения, асинхронная валидация моделей и изумительное использование статических методов моделей несомненно сделают вашу жизнь лучше и проще. Работа с моделями в Autodafe.

Autodafé — node.js фреймворк, начало читайте в этой статье: habrahabr.ru/blogs/nodejs/135089

Основная часть статьи будет посвящена перенаправлению запросов в autodafe, формированию URL и т. п. Но для начала мне бы хотелось осветить общие принципы работы приложения с подключенными клиентами, для того чтобы было понятнее какую часть рабочего процесса мы будем обсуждать.

Откуда берется пыль

Начнем со схемы, отображающей подключение клиентов к приложению:



На схеме можно увидеть несколько пользователей, которые пользуются различными устройствами и различными браузерами, которые в свою очередь подключаются к приложению по различным протоколам. (В данный момент к autodafe можно подключиться только по http и websockets)

В приложении каждому подключению соответствует один Client. Client создается для каждого http запроса и подключения по websockets. Клиенты с одинаковым идентификатором сессии принадлежат одному экземпляру Session. Обычно одна сессия в приложение соответствует одному браузеру.

Ну и для логического завершения на схеме приведен компонент “users”, который позволяет привязать различные сессии, прошедшие специальную авторизацию к одному объекту UserIdentity. Таким образом в приложении каждый объект UserIdentity соотносится к одному реальному пользователю.

Autodafe — node.js фреймворк для разработки веб приложений

Содержание статьи может описывать неактуальный код. У фреймворка уже давно свой сайт autodafe.ws

Самые вкусные плюшки из коробки:

• архитектура: MVC + подключаемые модули
• Mysql ORM (ActiveRecord с поддержкой отношений, асинхронное подобие того, что предлагает Yii framework для PHP )
• HTTP сервер
• WebSockets ( обертка для socket.io )
• удобное перенаправление запросов и человеко понятные УРЛ
• управление пользователями
  • аутентификация и авторизация, сессии
  • система управления правами ролей пользователей
• почта
• логирование в консоль, фс и на почту
• шаблонизатор

Ложка дегтя:

• очень малая часть задокументирована
• задокументированная часть плохо задокументирована
• плохо задокументированная часть задокументирована только на русском языке
• тестами покрыт не весь фреймворк

Есть сервис:

Назначение:

Быстрая конвертация мыслей в визуальное древовидное представление.

Я использую его для того, чтобы видеть все «большие» проекты, которые идут в жизни, и примерно представлять на какой они стадии. Удобно, когда во время одного занятия, пролетает мысль по поводу другого, и её не хочется потерять.

Кто-то другой вероятно сможет найти иное применение.

Плюсы:

• Любую операцию можно сделать с хоткея
• Внизу по этому поводу красуется «неглупая» панель с хоткеями. Неглупая потому что показывает только доступные в данный момент времени сочетания клавиш. Напрмер, если вылез попап, то она покажет какой клавишей его скрыть, какой пролиcтать и т.п.
• Минималистичность.
• Легкий дизайн, который не отвлекает.
• Возможность видеть все проекты сразу.
• Возможность работы на нескольких машинах одновременно с одного пользователя. То есть оно умное, все из себя ajax и обновляет.

Захотелось вот что-нибудь для людей сделать.


Оно умеет:

• Ползать
• Дрыгаться
• Разваливаться на листы
• и Менять размер
• а ещё оно разных цветов

Я много раз открывал 3ds Max, создавал параллелепипед, крутил его и думал, как бы классно было когда-нибудь выкроить времени и разобраться с этой чудо-программой. Шли годы, а руки не доходили. И вот ко мне пришла интересная мысль ))

Итак, с текстом в интернете давно уже сделали всё, что только можно. (Ну или почти всё.) Сервисов для работы с картинками несчетное количество. А вот сервисы, затрагивающие трехмерную графику можно пересчитать по пальцам рук. Один из них — Jifeon, активно пишущийся мной. Идея сервиса заключается в том, чтобы моделить небоьлшие модельки прямо в браузере, сохранять их, просматривать чужие и голосовать за них. После сохранения Вы можете дорабатывать свои модели или доверять это другим пользователям. Так же на сервере происходит рендеринг (пока что только) миниатюр созданных моделей. Несколько скриншотов тут.

Как он работает я уже писал на Хабре, а сегодня предлагаю попробовать смоделировать лого любимого Хабра «со звездочками». Это под силу абсолютно любому Хабрачеловеку вне зависимости от его подготовки.

Хочу поведать хабрасообществу о своем сервисе, позволяющем работать с трехмерной графикой прямо в браузере. Имя ему — Jifeon

Ещё скриншоты тут.

Пока что сервис позиционируется больше как социальная сеть, нежели как серьёзный инструмент 3d моделлера. В Jifeon можно создавать и обсуждать небольшие 3d модели, собирать их в коллекции и голосовать за них.