С ростом компании, люди и проекты меняются. Для продолжения развития культуры, которую мы хотим иметь в GitHub, мы сочли полезным напомнить самим себе цели, которые преследуем в коммуникациях. Мы недавно представили эти гайдлайны, чтобы помочь самим себе быть лучше, когда мы взаимодействуем через пулл-реквесты.
Игорь Романов @rkit
Пользователь
01 Ссылки для UX-специалистов
3 min
93KВ этой подборке я хочу поделиться информационными ресурсами, где можно почерпать новые знания, отследить новые методы, техники и аналитку, а также улучшить свои навыки в области UX. Полезно будет не только специалистам из области юзабилити, а также всем кто имеет отношение к разработке веб-продуктов.
![](https://habrastorage.org/files/816/606/5d8/8166065d89524eabb2a8ae7caac3ab4c.jpg)
![](https://habrastorage.org/files/816/606/5d8/8166065d89524eabb2a8ae7caac3ab4c.jpg)
+54
15 лучших JavaScript-библиотек для построения диаграмм и сводных таблиц
6 min
309KTranslation
Практически невозможно представить себе информационную панель без диаграмм и графиков. Они быстро и эффективно отображают сложные статистические данные. Более того, хорошая диаграмма также улучшает общий дизайн вашего сайта.
В этой статье я покажу вам некоторые из лучших JavaScript библиотек для построения диаграмм/схем (и сводных таблиц). Эти библиотеки помогут вам в создании красивых и настраиваемых графиков для ваших будущих проектов.
Хотя большинство библиотек являются бесплатными и свободно распространяемыми, для некоторых из них есть платные версии с дополнительным функционалом.
В этой статье я покажу вам некоторые из лучших JavaScript библиотек для построения диаграмм/схем (и сводных таблиц). Эти библиотеки помогут вам в создании красивых и настраиваемых графиков для ваших будущих проектов.
Хотя большинство библиотек являются бесплатными и свободно распространяемыми, для некоторых из них есть платные версии с дополнительным функционалом.
+59
Дайджест продуктового дизайна, декабрь 2014
21 min
12KС 2010 года я публикую регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок отбирается примерно 5% стоящих публикаций, которыми интересно поделиться. Предыдущие материалы: апрель 2010-ноябрь 2014.
![Дайджест продуктового дизайна, декабрь 2014](https://habrastorage.org/getpro/habr/post_images/982/732/12c/98273212c4a191e96f6691a22bd95c5c.png)
![Дайджест продуктового дизайна, декабрь 2014](https://habrastorage.org/getpro/habr/post_images/982/732/12c/98273212c4a191e96f6691a22bd95c5c.png)
+14
Руководство для дизайнера по DPI
27 min
320K![](https://habrastorage.org/files/b83/568/507/b83568507f1a4b01a1b68f5ea0f0bdf9.png)
Это руководство — начальный материал о кросс-DPI и кроссплатформенном дизайне для начинающих и средних дизайнеров, желающих узнать о нем с самого начала или получить больше знаний. Без сложных математических и непонятных диаграмм, только непосредственные объяснения, упорядоченные в небольших разделах, для понимания и применения их непосредственно к вашей дизайнерской работе.
Автор — Sebastien Gabriel.
Я не знаю всего, так что, если по вашему мнению я где то ошибаюсь или вам нужно уточнить что-то, либо у вас есть предложения или вопросы для улучшения данного руководства, отправьте письмо (на англ) на sgabriel.contact@gmail.com. Вы также можете найти на меня Twitter, G+ или Facebook.
+84
webpack: 7 бед — один ответ
12 min
179KПосле моего недавнего выступления на MoscowJS #17 с одноимённым докладом у многих возник интерес к этому инструменту. В рамках 11-го выпуска RadioJS, Миша Башкиров bashmish рассказал, что решился попробовать его в своём новом проекте, об успешном опыте и множестве положительных эмоций. Но были озвучены вопросы и возникла дискуссия, в результате которой я решил написать эту статью, чтобы раскрыть основные тезисы с доклада и рассказать о том, что тогда не успел.
Статья ориентирована, как на профессионалов, так и на тех, кто с похожими технологиями ещё не сталкивался.
Итак, начнём.
Статья ориентирована, как на профессионалов, так и на тех, кто с похожими технологиями ещё не сталкивался.
Итак, начнём.
+15
Проблемы даты и времени в JS
3 min
87K![](https://habrastorage.org/files/a53/aab/c54/a53aabc543b444f691b2456e1d331628.gif)
Редкому программисту случается избежать работы с датой и временем. Вообще, дата/время — базовое понятие и в основной массе языков существуют встроенные механизмы работы с этим типом данных. Казалось бы, JS не исключение, есть встроенный тип Date, есть куча функций в прототипе, однако…
+24
Оптимизируем производительность веб-страницы: CSS
5 min
51KВ наше время скорость интернета довольно высока. Казалось бы, можно забыть о тех временах, когда нам приходилось ждать по 20-30 (а то и больше) секунд, чтобы веб-страница загрузилась и отобразилась на экране — теперь мы ждём отрисовки страницы в среднем около одной-двух секунд. Однако не стоит забывать, что значительная часть юзеров заходит на ваш сайт с мобильных устройств, на которых связь не всегда стабильна. В связи с этим будет совсем не лишним уделить немного внимания оптимизации вашего кода.
В этой статье речь пойдёт о различных методах оптимизации таблиц стилей. Я расскажу о том, что влияет на скорость отрисовки страницы, как заставить браузер отрисовывать страницу быстрее и какие инструменты использовать для оптимизации.
В этой статье речь пойдёт о различных методах оптимизации таблиц стилей. Я расскажу о том, что влияет на скорость отрисовки страницы, как заставить браузер отрисовывать страницу быстрее и какие инструменты использовать для оптимизации.
+22
Быстрая настройка Grunt для комфортной разработки
7 min
25K![Быстрая настройка Grunt для комфортной разработки](https://habrastorage.org/files/a79/0de/487/a790de4872c64597a97fa2f1af833c4b.png)
Во время разработки нашего сервиса bitcalm.com, нам потребовалось организовать автоматическую сборку проекта. Перед нами стояла цель улучшить производительность frontend-части нашего приложения, а также оптимизировать процессы разработки и развертывания на сервере.
Основными задачами, которые требовалось решить, стали:
- Объединение и минификация скриптов
- Объединение и минификация стилей
- Сжатие png-изображений
- Создание спрайтов из всех изображений (с возможностью удобного использования и с поддержкой двух видов спрайтов для девайсов с разным PPI)
- Построение разных версий html-документов для разработки и для продакшна
Первые три пункта выглядят достаточно тривиальными, поэтому я постараюсь заострить внимание на работе со спрайтами и на обработке html.
+25
JavaScript выходит за пределы Web в 2014 году
9 min
36KПеревод статьи Патрика Катанзарити, оригинал можно найти здесь.
JavaScript, эволюционируя, шагнул далеко вперёд от своей изначальной роли в DHTML сайтах 90х гг. Он быстро занимает лидирующую позицию как кандидат на роль универсального языка для Интернета Вещей (Internet of Things). И хотя ещё слишком рано рассуждать о том, одержит ли JavaScript победу в этом состязании, я верю, что ему определённо отведена важная роль в постоянно растущем пространстве Интернета Вещей.
В прошлом году я написал обзор о технологиях, которые могут всерьёз заинтересовать JavaScript разработчиков – JavaScript Beyond the Web. С тех пор появилось много новых устройств и возможностей, поэтому я хочу написать обзор об изменениях, произошедших в мире JavaScript и среди взаимосвязанных устройств в течение 2014 года.
Перечень устройств, способных взаимодействовать посредством JavaScript, растёт с каждым месяцем. У нас появились как официальные JavaScript API, выпущенные производителями устройства, так и продукты усилий сообщества, ориентированные на то, чтобы возможности JavaScript стали доступными и для других.
JavaScript, эволюционируя, шагнул далеко вперёд от своей изначальной роли в DHTML сайтах 90х гг. Он быстро занимает лидирующую позицию как кандидат на роль универсального языка для Интернета Вещей (Internet of Things). И хотя ещё слишком рано рассуждать о том, одержит ли JavaScript победу в этом состязании, я верю, что ему определённо отведена важная роль в постоянно растущем пространстве Интернета Вещей.
В прошлом году я написал обзор о технологиях, которые могут всерьёз заинтересовать JavaScript разработчиков – JavaScript Beyond the Web. С тех пор появилось много новых устройств и возможностей, поэтому я хочу написать обзор об изменениях, произошедших в мире JavaScript и среди взаимосвязанных устройств в течение 2014 года.
Перечень устройств, способных взаимодействовать посредством JavaScript, растёт с каждым месяцем. У нас появились как официальные JavaScript API, выпущенные производителями устройства, так и продукты усилий сообщества, ориентированные на то, чтобы возможности JavaScript стали доступными и для других.
+32
Настраиваем сервер с Chef (Быстро и просто)
3 min
14KTutorial
The best way to learn Chef is to use Chef
— getchef.com
![](https://habrastorage.org/files/ed0/e20/319/ed0e203196ab4ea7b9cb3c8c039390a2.png)
Chef — это инструмент для конфигурирования серверов в концепции Infrastructure as a Code(IaaC).
Лично для меня, Chef — это, в первую очередь, возможность хранить архитектуру сервиса в виде ролей, и модифицировать её, избегая рутинных действий по установке пакетов и конфигурации.
+11
Yii2 и организация мультиязычности
7 min
93KRecovery Mode
Долгожданный выход Yii 2.0 Beta дал стимул многим разработчикам, использующих Yii, к переходу на вторую версию фреймворка. Разработчики фреймворка указали, что постараются не трогать обратную совместимость и в основном будут сосредоточены над исправлением ошибок и заканчивать документацию. Это дает еще больший импульс к использованию Yii2 в реальных проектах.
Мы решили не отставать от новшеств и выбрали именно вторую версию замечательного фреймворка Yii. При разработке проекта возникла необходимость в организации мультиязычности на сайте.
Мы решили не отставать от новшеств и выбрали именно вторую версию замечательного фреймворка Yii. При разработке проекта возникла необходимость в организации мультиязычности на сайте.
+8
Видео с доклада Виталия Фридмана «Responsive Web-дизайн: Трюки и уловки»
1 min
34KМега интересная лекция от знаменитости в области веб-разработки, основателя и шеф-редактора журнала Smashing Magazine. Мероприятие произошло благодаря Mail.ru. Ключевые темы: UI/UX, проектирование, отзывчивый дизайн, производительность, трюки с SVG. Все это на примере реальных кейсов от The Guardian, BBC и конечно же Smashing Magazine.
От себя хочется добавить, что Smashing Magazine я читаю ежедневно и многое беру от туда для моих подборок. А тут все эти «трендовые постулаты» Perfomance Budget, Mobile First, Atomic Design, Critical Path и др. из первых уст! Еще Фридмана просто интересно слушать. Очень харизматичный спикер с постоянной дружелюбной улыбкой на лице. Рекомендую всем к просмотру.
+23
Docker в браузере, или как создать и «расшарить» среду разработки
7 min
27KDocker нынче не использует только ленивый. Вокруг этой технологии заварилась очень интересная каша, не в последнюю очередь благодаря технологиям и продуктам, интегрировавшим Docker, который стал частью их инфраструктуры. Раннеры на Docker-е — это уже чуть ли не “must” для облачных IDE. Что уж говорить, если Google однозначно признали преимущества запуска приложений в контейнерах, а не на “чистом железе”. Впрочем, это тема другой дискуссии.
Создание среды разработки в браузере
Итак, Docker, скорее всего, изменит лицо технологического мира. Вернее, он уже его меняет. Все мало-мальски активные компании уже выложили свои докер образы, в которых запускаются их продукты. Ни тебе настройки среды, ни установки переменных окружения… Скачал образ, примонтировал локальные ресурсы, если нужно (“сорцы” проекта, локальный репозиторий и так далее), и горя не знаешь.
Создание среды разработки в браузере
Итак, Docker, скорее всего, изменит лицо технологического мира. Вернее, он уже его меняет. Все мало-мальски активные компании уже выложили свои докер образы, в которых запускаются их продукты. Ни тебе настройки среды, ни установки переменных окружения… Скачал образ, примонтировал локальные ресурсы, если нужно (“сорцы” проекта, локальный репозиторий и так далее), и горя не знаешь.
+21
Использование RequireJS в приложениях AngularJS
6 min
17KTutorial
Translation
При написании больших JavaScript-приложений одна из самых простых вещей, которую можно сделать, это разделить код на несколько файлов. Это улучшает поддерживаемость кода, но увеличивает шансы потерять или ошибиться со вставкой тега script в главный HTML-документ. Отслеживание зависимостей затрудняется с ростом числа файлов проекта. Эта проблема присутствует в больших AngularJS приложениях до сих пор. У нас есть целый ряд инструментов, которые заботятся о загрузке зависимостей в приложении.
В этой статье мы рассмотрим, использование RequireJS с AngularJS для упрощения загрузки зависимостей. Мы также рассмотрим, как использовать Grunt для генерации файлов, содержащих модули RequireJS.
В этой статье мы рассмотрим, использование RequireJS с AngularJS для упрощения загрузки зависимостей. Мы также рассмотрим, как использовать Grunt для генерации файлов, содержащих модули RequireJS.
+9
Битва key-value хранилищ
2 min
55KКакие key-value хранилища вы используете в бою?
Позаимствовал список с сайта db-engines.com (кстати, очень любопытный сайт, рекомендую), включил все базы с ненулевой «популярностью» оттуда. Не отмечайте базы которые просто пробовали/интересно, а только те, что крутятся и приносят деньги вашей компании прямо сейчас.
Обратите внимание: MongoDB это НЕ key-value хранилище, однако за нее можно проголосовать, см. пункт «Хранилище документов в качестве key-value».
Пишите, если забыл какую-то популярную базу (т. е. забыли авторы сайта db-engines.com), добавлю в опрос.
Какие свойства key-value хранилища вам важны?
+30
Краткий конспект по языку JavaScript
15 min
113KTutorial
Я —.NET разработчик. Но в последнее время всё чаще сталкиваюсь с JavaScript. Причём, процентах в 50 случаев я что-то на нём пишу, в остальных 50 — разбираюсь с чужим кодом, да ещё и прошедшим через минификацию, а иногда и обфускацию. В этой статье захотелось поделиться теми моментами, которые мне показались важными для понимания языка и эффективной работы с ним. Тут не будет ничего нового или неизвестного для людей, уже имевших дело с языком, и не будет чего-то такого, чего нельзя найти в других источниках. Для меня статья будет полезна как способ лучше разобраться в предмете, для читателей, я надеюсь, — как повод освежить знания.
Брендан Айк упоминал, что JavaScript был создан за 10 дней. Думаю, идея вынашивалась дольше. Как бы то ни было, язык получился и с тех пор только набирает популярность. Особенно после появления AJAX.
JavaScript — язык со слабой динамической неявной типизацией, автоматическим управлением памятью и прототипным наследованием.
JavaScript состоит из трёх обособленных частей:
В статье, в основном, пойдёт речь о ядре. Конечно, в примерах кода будут использоваться элементы DOM и BOM, но заострять на них внимание не буду.
Брендан Айк упоминал, что JavaScript был создан за 10 дней. Думаю, идея вынашивалась дольше. Как бы то ни было, язык получился и с тех пор только набирает популярность. Особенно после появления AJAX.
JavaScript — язык со слабой динамической неявной типизацией, автоматическим управлением памятью и прототипным наследованием.
JavaScript состоит из трёх обособленных частей:
- ядро (ECMAScript),
- объектная модель браузера (Browser Object Model или BOM),
- объектная модель документа (Document Object Model или DOM).
В статье, в основном, пойдёт речь о ядре. Конечно, в примерах кода будут использоваться элементы DOM и BOM, но заострять на них внимание не буду.
+55
Well.js – еще один подход к модульной разработке на JavaScript
7 min
9KПо названию публикации некоторые могли подумать: «Что опять?! Еще один велосипед?» Спешу обрадовать – нет. Well.js (Github) – это обертка для существующих AMD-решений (по-умолчанию для Require.js), основная идея которой сделать работу с модулями и их зависимостями, как показалось автору, более привлекательной.
Например, возьмем модуль Require.js:
И легким движением руки заменим на это:
Кому интересно, для чего все это надо, прошу под кат.
Например, возьмем модуль Require.js:
define(['views/common/basic-page', 'views/partials/sidebar', 'utils/helper', 'models/user' ],
function (BasicView,SidebarView, Helper, UserModel) {
//тело модуля
});
И легким движением руки заменим на это:
wellDefine('Views:Pages:Overview', function(app, modules) {
this.use('Views:Common:BasicPage')
.use('Views:Partials:Sidebar')
.use('Utils:Helper', {as: 'MyHelper', autoInit: false})
.use('Models:User', {as: 'UserModel'})
.exports(function(options){
/* Теперь к зависимостям можно получить доступ через:
this.BasicPage
this.Sidebar
this.MyHelper
this.UserModel
*/
});
});
Кому интересно, для чего все это надо, прошу под кат.
+12
Продвинутый Gulp и Browserify: интересные трюки
9 min
42KПару недель назад я начал цикл о том, как делал некоммерческий музыкальный проект (первый пост есть в «я пиарюсь», не буду ставить ссылок), но, к сожалению, в первой же статье увлекся, и вместо того, чтобы рассказывать о том, как делал конкретно его, начал вспоминать эффективные трюки из других проектов. Видимо, именно это вкупе с прописанным акцентом на сам проект привело к тому, что за мной и постом прилетело НЛО.
Однако все то, что было в статье, было по крайней мере малоизвестно, а половина ее была вообще уникальна, как я уверен, и каждый из этих советов может ощутимо облегчить работу с gulp, поэтому мне действительно было бы жаль, если этот материал безвозвратно пропал бы.
Поэтому я постарался убрать все упоминания проекта и повторно публикую (с доработками и правками) статью, которую по сути никто еще не видел. Если вы фанат grunt — почитайте хотя бы вторую часть: то, что вы не любите gulp, не значит, что вы не любите browserify.
Краткое содержание:
Однако все то, что было в статье, было по крайней мере малоизвестно, а половина ее была вообще уникальна, как я уверен, и каждый из этих советов может ощутимо облегчить работу с gulp, поэтому мне действительно было бы жаль, если этот материал безвозвратно пропал бы.
Поэтому я постарался убрать все упоминания проекта и повторно публикую (с доработками и правками) статью, которую по сути никто еще не видел. Если вы фанат grunt — почитайте хотя бы вторую часть: то, что вы не любите gulp, не значит, что вы не любите browserify.
Краткое содержание:
- Простой способ обработки ошибок;
- Универсальная структура для хранения исходных файлов;
- Объединение нескольких потоков (например, скомпилированный coffee и js) в один;
- Создание потока из текста;
- создание собственных плагинов для Browserify;
- создание плагинов из плагинов Gulp для Browserify.
+24
Как мы делали аналитику для высоконагруженного сайта
9 min
27K![image](https://habrastorage.org/files/a82/6ce/c72/a826cec721994f70bc8514323ce30eb2.png)
Недавно на хабре была публикация о том, как реализована аналитика на ivi.ru. После прочтения захотелось рассказать об аналитике, которую мы делали для одного крупного сайта. Заказчик, к сожалению, не разрешил публиковать в статье ссылку на сайт. Если верить Alexa Rank, то трафик на сайте, для которого мы делали аналитику, раз в 10 больше, чем на ivi.ru.
+24
Information
- Rating
- Does not participate
- Location
- Россия
- Registered
- Activity