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

Riot.js — The 1kb client-side MVP framework

Немного статистической правды:



«Материнский» проект Moot тоже очень крутой и демонстрирует то, каким должен быть форум.

Да, в интернете полно реализаций банального чата, но все-же мне они не по душе. Представляю Вам мою реализацию чата, с блекджеком и сами знаете чем.

Итак, сразу ссылка на демо для нетерпеливых.
(Сервер уже уложили)

Особенности

• Сохранение сообщений в БД
• Авторизация
• Команды чата
• Соединение с сервером по WebSocket

Привет, %username%!

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

На мой взгляд, самым значительным изобретением в мире веб-разработок, за последние несколько лет, стали CSS media queries — они позволяют организовывать внешний вид веб-приложения так, что он в корне может отличатся на разных разрешениях экрана. Любой форм-фактор девайса может иметь собственное представление дизайна и это прекрасно. Мы все это знаем, но речь пойдет не об этом, а о обработке событий…

Удивительно, что на Хабре всё ещё нет статей об этом гениальном DI контейнере для PHP.
Почему гениальном? Потому, что весь код этого творения укладывается в 80 строк – маленький объект с большими возможностями.
Контейнер представляет из себя один класс, и его подключение в проект выглядит следующим образом:

require_once '/path/to/Pimple.php';

Создание контейнера так же просто:

$container = new Pimple();

Как и многие другие DI контейнеры, Pimple поддерживает два вида данных: сервисы и параметры.

Чуть больше года назад (1 октября 2012 года) я выложил на Хабрахабре блогозапись «Node.js + Chromium = AppJS: один из перспективных вариантов второго шага эволюции веборазработчика», в которой привёл AppJS в качестве примера такого объединения движков Node.js и Chromium, которое позволяет каждому веборазработчику, употребляя привычные ему по работе технологии (JavaScript, HTML, CSS), сделаться разработчиком приложений с GUI (графическим интерфейсом пользователя), объединяющих в себе выразительные способности браузера Chromium и мощь API Node.

На следующий же день (2 октября 2012 года) во блогозаписи «Node.js + Chromium = node-webkit: ещё более перспективный вариант второго шага эволюции веборазработчика» я указал, что AppJS — не единственный и даже не лучший вариант: node-webkit отличается удобством и бóльшими возможностями API, более обширной документацией, а также обеспечивает запуск ZIP-упакованных приложений.

И что же? — не прошло и тринадцати месяцев, как успех node-webkit сделался очевидным и для разработчиков AppJS. Сегодня во твиттере у AppJS вы можете прочесть о том, что разработка проекта AppJS прекращена, поскольку node-webkit достиг его цели:

Попытайтесь повторить это сами

Как правило, настроенный должным образом сервер Nginx на Linux, может обрабатывать 500,000 — 600,000 запросов в секунду. Но этот показатель можно весьма ощутимо увеличить. Хотел бы обратить внимание на тот факт, что настройки описанные ниже, применялись в тестовой среде и, возможно, для ваших боевых серверов они не подойдут.

Минутка банальности.

yum -y install nginx

На всякий пожарный, создадим бэкап исходного конфига.

cp /etc/nginx/nginx.conf /etc/nginx/nginx.conf.orig
vim /etc/nginx/nginx.conf

А теперь можно и похимичить!

Тема изменений в системе высшего образования становится все более актуальной. Много говорят об онлайн курсах как альтернативе университетскому образованию. Один из основных аргументов за традиционное университетское образование это отсутствие диплома и реальной аттестации после окончания онлайн курса.

На самом деле аттестацию можно получить. Причём не просто сертификат о сдаче экзамена после определённого курса, а вполне реальный диплом американского колледжа после выполнения конкретной программы курсов.

В работе на языке Python я частенько использую библиотеку Pytils для работы с русским текстом, и мне очень не хватало этой библиотеки при работе на PHP. Возможно, я искал плохо, но все, что я находил, не предоставляло подобных возможностей либо не слишком отвечало моим понятиям о чистом коде.

И вот, однажды я решил портировать библиотеку на PHP, и теперь хочу поделиться ею с народом и очень надеюсь на помощь в ее улучшении: буду рад советам, баг-репортам и особенно pull-реквестам. Библиотека находится на GitHub'е: github.com/Andre-487/php_rutils

UPD от 26.10.2013: теперь библиотека так же доступна через Composer: packagist.org/packages/andre_487/php_rutils
Так же хочу сказать спасибо всем, кто помог улучшить библиотеку и довести ее до стабильного релиза.

Возможности библиотеки

PHP RUtils — порт Pytils на PHP. Это утилиты для работы с русским текстом. Утилиты разделены на следующие модули (классы):

• Numeral — работа с числами: склонение существительных в зависимости от количества, числа прописью, суммы денег в рублях и копейках прописью.
• Dt — работа с датами: расширение формата дат PHP русскими именами месяцев, дней недели; временные периоды (например, 24 976 дней назад).
• Translit — транслитерация, подготовка строк для использования в URL'ях, именах файлов.
• Typo — небольшой набор правил типографики простого текста.

Вступление

В статье я собрал советы по использованию media query. Расскажу, как можно более эффективно использовать media query. В конце статьи есть список использованных источников.

• Внешнее подключение media query
  
• Больше чем просто размер viewport
  
• Не только смартфоны
  
• Инструмент для работы с media query
  
• Выделяйте специфичное
  
• Breakpoints когда и сколько?
  
• Второстепенные breakpoints
  
• Относительные единицы измерения
  
• Условная загрузка
  
• Список использованных ресурсов
  

Пару дней назад, одна моя знакомая попросила помочь ей создать интернет-голосование, поскольку, функционала в Контакте не хватало (там можно создавать опрос только на 15 человек). Задачка оказалась интересной. Итак, за дело!

Кому может пригодиться данный пост:

• тому кто пытается разобраться как работает API в Контакте;
• имеет опыт работы с популярными CMS, здесь речь пойдет о Joomla;
• сильно ограничен во времени;

От переводчика: Это четвёртая статья из цикла о Node.js от команды Mozilla Identity, которая занимается проектом Persona. Эта статья о том, как увеличить скорость загрузки ресурсов сайта и модуле connect-cachify, созданном в Mozilla для этой цели.

Все статьи цикла:

1. "Охотимся за утечками памяти в Node.js"
2. "Нагружаем Node под завязку"
3. "Храним сессии на клиенте, чтобы упростить масштабирование приложения"
4. "Производительность фронтэнда. Часть 1 — конкатенация, компрессия, кэширование"
5. "Пишем сервер, который не падает под нагрузкой"
6. "Производительность фронтэнда. Часть 2 — кешируем динамический контент с помощью etagify"
7. "Приручаем конфигурации веб-приложений с помощью node-convict"
8. "Производительность фронтенда. Часть 3 — оптимизация шрифтов"
9. "Локализация приложений Node.js. Часть 1"
10. "Локализация приложений Node.js. Часть 2: инструментарий и процесс"
11. "Локализация приложений Node.js. Часть 3: локализация в действии"
12. "Awsbox — PaaS-инфраструктура для развёртывания приложений Node.js в облаке Amazon"

---

В этой статье мы поговорим о производительности фронтэнда и представим инструменты, созданные в Mozilla для того, чтобы сделать сайт Persona настолько быстрым, насколько возможно. Мы опишем работу с connect-cachify — модулем, автоматизирующим некоторые из важнейших аспектов, обеспечивающих производительность фронтэнда.

Но сначала окинем взглядом наиболее распространённые пути улучшения производительности. Если у вас уже есть опыт оптимизации фронтэнда, можете пропустить эти разделы и перейти в конец статьи, где описано, как с помощью connect-cachify автоматически делать то, что вам раньше доводилось делать вручную.

Компания Google выложила в свободный доступ программу Google Web Designer (бета): HTML-редактор кода со встроенным графическим редактором для создания рекламных баннеров.

В последнее время мои коллеги начинают знакомство с git'ом. И один из интересующих их вопросов — как откатиться до определённой ревизии. В интернете можно найти набор команд, но хочется, чтобы было понимание каждой из них. Баловство с комадами git'а без понимания может привести к потере истории разработки.

В этой статье я хочу рассказать о командах git checkout и git reset с ключами --soft и --hard.

Возможности встроенного в браузер инструмента Chrome Developer Tools можно расширить с помощью сниппетов. Это ускоряет разработку и упрощает рабочий процесс. Хорошая коллекция сниппетов есть на GitHub'е.

Сниппеты в Google Chrome

Подробно о функциях сниппетов можно почитать в официальной документации Chrome. А вот краткая инструкция:

1. Зайти в «chrome://flags» — Отметить «Enable Developer Tools experiments».
2. Открыть DevTools: «Settings» — «Developer Tools Experiments» — Отметить «Snippets support».
3. После перезагрузки во вкладке DevTools «Sources» появится «Snippets», где можно управлять сниппетами:

Перетаскиванием объектов на HTML5 никого уже не удивишь, но все же попробую рассказать кое о чем интересном, а именно, как сделать красивое перетаскивание нескольких объектов, используя только HTML5.

На странице есть набор элементов типа А, которые можно по одному или группой перетащить в элемент типа Б. Пользователь должен видеть, перетаскивает он один элемент или несколько. Перетаскивать один элемент просто, достаточно присвоить свойству draggable значение true, наверняка, все это делали.

Это небольшой учебный пример редактора карты памяти. За счёт очень подробных комментариев и простого кода, понять его не составит проблем. Статья предназначена для знающих и изучающих Javascript.

Я опишу особенности создания редактора карты памяти, который использует базу данных браузера. Причём, это будет не LocalStorage, который не может превышать 5 мегабайт. Объём данных сможет превысить 100-200 мегабайт, так как используется IndexedDB или webSQL, смотря что доступно в конкретном браузере.

Исходники выложены в открытый доступ на Github.

Мы уложимся в 520 строк кода, при этом в нашей карте можно будет перетаскивать узлы между собой, удалять, переименовывать и создавать новые. А также можно будет назначать одну из 120 иконок через контекстное меню.

Секрет минимализма в том, что мы будем использовать проверенные в бою плагины:

1. Ydn.db — хранение информации в базе данных браузера с автоматическим выбором лучшего метода и единым API
2. jQuery context menu — контекстное меню, которое можно наполнять динамически при помощи Javascript
3. jsPlumb — расширение позволяющее рисовать линии между HTML элементами
4. jQuery UI — Drag&drop — перетаскивание элементов между собой

PS: Также мы научимся создавать «синглтон», облегчать себе асинхронное программирование при помощи jQuery и встроенного объекта $.Deferred(), а также при помощи плагина LiveReload, сохраним краску на клавише F5 при изменении свойств CSS и кода в HTML и Javascript.

Здравствуйте! Моя основная область деятельности — разработка мобильных приложений (iOS, Android). И большая часть приложений, использует взаимодействие с другими пользователями, хранение данных и другие задачи требующие наличие единого сервера. Поэтому для большей части приложений приходится писать свой велосипедbackend. А так как я, в основном являюсь мобильным разработчиком, то написание этого сервиса всегда становится небольшой проблемой — приходится задействовать веб-разработчика или искать подходящий BaaS сервис, даже если надо написать всего пару запросов.
Поэтому было принято решение, попробовать найти инструмент, позволяющий в короткие сроки написать небольшой веб-сервис, который можно было бы использовать в мобильном приложении.

Предлагаем вашему вниманию очередную подборку с ссылками на новости и материалы.

Приятного чтения!

На Хабре я недавно (чуть меньше месяца), до этого Хабр практически не читал. Пришёл, огляделся, походил по тематическим «хабам», почитал «Лучшее за всё время», просмотрел статьи отдельных, заинтересовавших меня персонажей и понял, что для того, чтобы получше понять, как живёт и чем дышит это замечательное сообщество, мне придётся Хабр распарсить и позадавать ему разные вопросы. К тому же, раз уж в своих статьях я писал в основном об автореферентности в разных её проявлениях, как не написать на Хабре статью о Хабре?

Посмотрю, интересно ли это всё кому-либо кроме меня. Если интересно, напишу ещё несколько постов, идей и материала для этого более чем достаточно.

Если я ничего не пропустил в интерфейсе сайта, единственные списки самых-самых, которые можно посмотреть — это общий рейтинг пользователей и список статей, т.н. «Лучшее за всё время». Оба списка отсортированы по рейтингу (пользователей и статей, соответственно). Между тем, существует ещё куча параметров, по которым было бы интересно всё отранжировать.

Не все задачи успели мы с вами обозреть в предыдущем посте, поэтому продолжать будем в этом.

Часто случается, что в интернете появляется какой-нибудь неологизм. Например, «затроллить». Слово «тролль» в словаре есть, но «затролля» уже нет, а, как мы выяснили ранее, приставка при разборе не отделяется от корня, так что мы понятия не имеем, что это за «затроллить» и как его изменять. Чтобы проанализировать это слово, нам придётся воспользоваться псевдолемматизацией. Для этого мы снова пользуемся так называемым обратным деревом окончаний (записанных справа налево).