Как стать автором
Обновить
11
0
Vasily Kazantsev @hubhito

Developer

Отправить сообщение

Используем Webpack вместо Sprockets в Ruby on Rails

Время на прочтение10 мин
Количество просмотров14K

За работу frontend части приложения в Ruby on Rails отвечает библиотека Sprockets, которая не дотягивает до потребностей современного frontend приложения. В чем именно не дотягивает можно почитать, например, здесь и здесь.


Хотя уже есть достаточно статей на тему связки webpack+rails и даже специальный гем есть, предлагаю посмотреть на еще один велосипед, умеющий также деплой делать.



Читать дальше →
Всего голосов 9: ↑8 и ↓1+7
Комментарии10

Ресайз картинок в браузере. Все очень плохо

Время на прочтение10 мин
Количество просмотров104K
Если вы когда-нибудь сталкивались с задачей ресайза картинок в браузере, то вы наверное знаете, что это очень просто. В любом современном браузере есть такой элемент, как холст (<canvas>). На него можно нанести изображение нужных размеров. Пять строчек кода и картинка готова:

function resize(img, w, h) {
  var canvas = document.createElement('canvas');
  canvas.width = w;
  canvas.height = h;
  canvas.getContext('2d').drawImage(img, 0, 0, w, h);
  return canvas;
}

Из холста картинку можно сохранить в JPEG и, например, отправить на сервер. Можно было на этом закончить статью, но сперва давайте взглянем на результат. Если вы поставите рядом такой холст и обычный элемент <img>, в который загружена та же картинка (исходник, 4 Мб), то вы увидите разницу.

img
Читать дальше →
Всего голосов 156: ↑152 и ↓4+148
Комментарии90

Как мы готовим React, Require и Backbone

Время на прочтение5 мин
Количество просмотров35K
Как следует из официальной документации, React.js — V из MVC, и, как правило, вместе с ним применяются другие решения, в данном случае — Backbone.js и Require.js. А еще Jasmine, Karma и Grunt. Сегодня я поделюсь наброском проекта с применением этих инструментов.

Ссылка для нетерпеливых.

Хотелки


  • Прозрачная структура проекта;
  • Автоматизация всей рутинной работы;
  • Автоматизация тестирования;
  • Модульность;
  • Повторное использования кода;
  • Производительность.

Интересно что из этого получилось?
Всего голосов 27: ↑22 и ↓5+17
Комментарии34

Сайты справа налево: как подключить RTL-стандарт

Время на прочтение4 мин
Количество просмотров38K
Когда неподготовленный человек видит сайт на арабском, иврите или любом другом RTL (right-to-left) языке, у него кружится голова: справа налево располагаются не только текст, но и элементы интерфейса.



Когда мы в Alconost впервые столкнулись с необходимостью локализовать сайт на арабский, а затем протестировать его, нам пришлось изучить, как именно RTL пользователи смотрят на мир:
  • вместо подчёркивания, курсива или р а з р я д к и арабы обычно пользуются надчёркиванием;
  • дробный перенос слова на другую строку не допускается;
  • пустое пространство в строке устраняется растяжением букв;
  • цифры пишутся слева направо;
  • в арабском знаки препинания пишутся слева направо;
  • в иврите и в арабском нет заглавных букв.

А если в RTL текст нужно вставить слово на латинице, оно пишется как обычно: слева направо. Такой смешанный RTL-LTR текст превращается в отличный тренажер для глаз.
Как же добиться поддержки RTL на сайте?
Всего голосов 15: ↑12 и ↓3+9
Комментарии13

300 потрясающих бесплатных сервисов

Время на прочтение11 мин
Количество просмотров1.6M


Автор оригинальной статьи Ali Mese добавил ещё 100 новых бесплатных сервисов. Все 400 потрясающих сервисов доступны здесь. И еще подборку +500 инструментов от 10 марта 2017 г. смотрите здесь.



A. Бесплатные Веб-Сайты + Логотипы + Хостинг + Выставление Счета

  • HTML5 UP: Адаптивные шаблоны HTML5 и CSS3.
  • Bootswatch: Бесплатные темы для Bootstrap.
  • Templated: Коллекция 845 бесплатных шаблонов CSS и HTML5.
  • Wordpress.org | Wordpress.com: Бесплатное создание веб-сайта.
  • Strikingly.com Domain: Конструктор веб-сайтов.
  • Logaster: Онлайн генератор логотипов и элементов фирменного стиля (new).
  • Withoomph: Мгновенное создание логотипов (англ.).
  • Hipster Logo Generator: Генератор хипстерских логотипов.
  • Squarespace Free Logo: Можно скачать бесплатную версию в маленьком разрешении.
  • Invoice to me: Бесплатный генератор счета.
  • Free Invoice Generator: Альтернативный бесплатный генератор счета.
  • Slimvoice: Невероятно простой счет.

Читать дальше →
Всего голосов 341: ↑325 и ↓16+309
Комментарии107

Краткий курс компьютерной графики: пишем упрощённый OpenGL своими руками, статья 1 из 6

Время на прочтение7 мин
Количество просмотров399K

Содержание курса



Улучшение кода






Official translation (with a bit of polishing) is available here.




Постановка задачи


Цель этого цикла статей — показать, как работает OpenGL, написав его (сильно упрощённый!) клон самостоятельно. На удивление часто сталкиваюсь с людьми, которые не могут преодолеть первоначальный барьер обучения OpenGL/DirectX. Таким образом, я подготовил краткий цикл из шести лекций, после которого мои студенты выдают неплохие рендеры.

Итак, задача ставится следующим образом: не используя никаких сторонних библиотек (особенно графических) получить примерно такие картинки:



Внимание, это обучающий материал, который в целом повторит структуру библиотеки OpenGL. Это будет софтверный рендер, я не ставлю целью показать, как писать приложения под OpenGL. Я ставлю целью показать, как сам OpenGL устроен. По моему глубокому убеждению, без понимания этого написание эффективных приложений с использованием 3D библиотек невозможно.
Читать дальше →
Всего голосов 198: ↑196 и ↓2+194
Комментарии120

Тренды JavaScript на 2015 год

Время на прочтение19 мин
Количество просмотров112K


Всем привет! Мы как-то задумали сделать легкий вводный курс на тему JavaScript и разработки приложений (он, кстати, скоро будет опубликован): и, пока я собирал материалы к нему, как-то само собой выяснилось, что есть довольно много вещей, которые, так сказать, находятся на переднем крае развития JavaScript. Отсюда родилась идея сделать отдельную обзорную статью в жанре «X трендов на год Y по технологии Z».

Многие из тех, вещей, которые я буду описывать, можно попробовать в той или иной степени уже сегодня (собственно, иначе я бы говорил о космическом будущем, а не о трендах). В этом есть несомненный плюс: если у вас будет свободное время (а на праздниках его обычно много), вам будет чем заняться. Да и, в целом, хорошо начинать новый год с расширения своих горизонтов!
Читать дальше →
Всего голосов 108: ↑88 и ↓20+68
Комментарии76

em-dosbox и 50 подарков на новый год

Время на прочтение3 мин
Количество просмотров27K
Некоторые вещи с годами становятся только лучше. Например, классические игры, разработанные в эпоху DOS завораживают. Каждая из них — штучный продукт сделанный с большой любовью. К сожалению DOS платформа ушла в прошлое и вместе с ней уходят замечательные продукты. Вернуть их в современный мир — это ли не настоящий подарок?
Читать дальше →
Всего голосов 44: ↑41 и ↓3+38
Комментарии52

Sortable v1.0: Новые возможности

Время на прочтение6 мин
Количество просмотров28K
Привет хабр! В преддверии нового года хочу поделится своей радостью — выходом Sortable v1.0. Ровно год назад я представил на ваш суд мой маленький инструмент для сортировки списка при помощи drag’n’drop. Всё это время я скрупулезно собирал обратную связь, добавлял новые возможности и правил мелкие баги. Под катом я расскажу о новых возможностях, интеграции с AngularJS, Meteor и других нюансах.
Читать дальше →
Всего голосов 30: ↑29 и ↓1+28
Комментарии24

За один проход

Время на прочтение7 мин
Количество просмотров155K
Среди задач по программированию часто попадаются такие: дана последовательность однотипных элементов (обычно это числа), требуется за один проход по ней найти какую-нибудь характеристику (среднее квадратическое отклонение, количество минимальных элементов, непрерывный участок с наибольшей суммой...) Дополнительное ограничение — последовательность может быть очень длинной, и в память не поместится. Других ограничений на элементы последовательности, обычно, не накладывается.
С этими задачами всё, более или менее, понятно: нужно найти то, что на мехмате МГУ называют «индуктивным расширением» искомой функции, и реализовать её вычисление. Если найти не удалось (требуемый объём памяти слишком велик), то задача не решается.
Но попадаются и другие задачи. В них есть дополнительные ограничения на элементы последовательности в совокупности, и эти ограничения приходится существенно использовать для решения (и проверять их не надо). Простейшая такая задача выглядит так:

Задача 1. В последовательности записаны целые числа от 1 до N в произвольном порядке, но одно из чисел пропущено (остальные встречаются ровно по одному разу). N заранее неизвестно. Определить пропущенное число

Решение очевидно: просматриваем числа, находим их количество K и сумму S. По условию, N=K+1, значит, сумма чисел от 1 до N будет равна (K+1)*(K+2)/2, и пропущенное число равно (K+1)*(K+2)/2-S. Если вы почему-то боитесь переполнений, то работайте с беззнаковыми числами (там переполнения не страшны — но будьте осторожны при вычислении (K+1)*(K+2)/2 :) ), или вместо суммы ищите XOR всех чисел.
Другие задачи
Всего голосов 73: ↑72 и ↓1+71
Комментарии56

Выразительный JavaScript: Регулярные выражения

Время на прочтение22 мин
Количество просмотров231K

Содержание




Некоторые люди, столкнувшись с проблемой, думают: «О, а использую-ка я регулярные выражения». Теперь у них есть две проблемы.
Джейми Завински

Юан-Ма сказал: «Требуется большая сила, чтобы резать дерево поперёк структуры древесины. Требуется много кода, чтобы программировать поперёк структуры проблемы».
Мастер Юан-Ма, «Книга программирования»


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

В этой главе мы обсудим такой инструмент – регулярные выражения. Это способ описывать шаблоны в строковых данных. Они создают небольшой отдельный язык, который входит в JavaScript и во множество других языков и инструментов.

Регулярки одновременно очень странные и крайне полезные. Их синтаксис загадочен, а программный интерфейс в JavaScript для них неуклюж. Но это мощный инструмент для исследования и обработки строк. Разобравшись с ними, вы станете более эффективным программистом.
Читать дальше →
Всего голосов 47: ↑41 и ↓6+35
Комментарии10

Как мы делали аналитику для высоконагруженного сайта

Время на прочтение9 мин
Количество просмотров27K
image

Недавно на хабре была публикация о том, как реализована аналитика на ivi.ru. После прочтения захотелось рассказать об аналитике, которую мы делали для одного крупного сайта. Заказчик, к сожалению, не разрешил публиковать в статье ссылку на сайт. Если верить Alexa Rank, то трафик на сайте, для которого мы делали аналитику, раз в 10 больше, чем на ivi.ru.
Читать дальше →
Всего голосов 34: ↑29 и ↓5+24
Комментарии78

markdown-it — парсер markdown / CommonMark на стероидах

Время на прочтение2 мин
Количество просмотров14K
Не так давно было много шума об инициатике CommonMark по унификации маркдауна. Казалось бы, наконец-то в этой замечательной разметке наступит порядок. Но на практике не все так просто. Сейчас ведется работа над базовым синтаксисом, и до расширений дело дойдет не скоро. Ждать год с лишним могут не все. Но разработки спецификаций — это скорее научная работа. Нас же интересует практика — как приворачивать маркдаун к конкретным проектам.

Что же может потребоваться программисту от хорошего парсера маркдауна? Ну конечно же не скорость :). А нужна на самом деле возможность добавлять свои расширения синтаксиса. К сожалению, во всех реализациях парсеров, что я до этого встречал, логика разбора разметки приколочена намертво. Все что остается — ковырять гвоздиком конечный результат и надеяться что конфликтов не случится. Конечно, гарантировать при этом надежный выхлоп невозможно. Можно пойти другим путем — попробовать заслать патч в апстрим. Но тут нет ни каких гарантий, что синтаксис вашего расширения будет нужен кому-то еще кроме вас, и что ваш код будет принят.

Как же быть? К счастью, теперь у нас есть markdown-it!

Читать дальше →
Всего голосов 40: ↑35 и ↓5+30
Комментарии29

Лучшие плагины для Sublime Text

Время на прочтение5 мин
Количество просмотров639K

WebInspector


Мощный инструмент для дебаггинга JavaScript, полноценный инспектор кода для Sublime. Фичи: установка брейкпоинтов прямо в редакторе, показ интерактивной консоли с кликабельными объектами, остановка с показом стек трейса и управление шагами дебаггера. Все это работает на ура! А еще есть Fireplay от Mozilla, который позволяет подключаться к Firefox Developer tools и максимально простой дебаггер JSHint.



Читать дальше →
Всего голосов 116: ↑114 и ↓2+112
Комментарии101

Jailbreak сделали, а дальше что?

Время на прочтение3 мин
Количество просмотров65K

Эта статья для тех, кто уже сделал джейлбрейк своему айдевайсу или еще раздумывает над тем, стоит это делать или нет.
После того, как вы сделали джейлбрейк у вас появляется возможность расширить функционал своего айфона или айпод тача за счет различных патчей из Cydia. Про них и пойдет речь.

Читать дальше →
Всего голосов 136: ↑98 и ↓38+60
Комментарии102

Радионяня из Android смартфона

Время на прочтение3 мин
Количество просмотров85K
Доброго времени суток хабровчане.

Дети — это прекрасно! Особенно прекрасно, если дети спят. Можно заняться своими делами: перекурить, принять душ, отдохнуть, поиграть… почитать хабр.
image

Но если ребенок уснул, то это не значит, что можно просто пойти в другую комнату (на кухню) и начинать гамать в наушниках (мыть посуду, пылесосить… и.т.д.). Дети имеют свойство просыпаться в самый не подходящий момент. При этом, далеко не всегда удается сразу это заметить. Если вовремя принять меры (покачать кроватку, убаюкать, погладить), то ребенок может продолжить спокойно спать, а если упустить момент, то может начаться вселенский армагеддон на всю оставшуюся ночь.
Читать дальше →
Всего голосов 43: ↑34 и ↓9+25
Комментарии31

Android на Windows

Время на прочтение1 мин
Количество просмотров64K
Небольшая компания единомышленников представила alpha версию программного обеспечения, которое позволяет запускать Android приложения под Windows.



Узнать больше
Всего голосов 86: ↑80 и ↓6+74
Комментарии78

История user-agent в браузерах

Время на прочтение3 мин
Количество просмотров37K
imageВ начале был NCSA Mosaic, и Mosaic называл себя NCSA_Mosaic/2.0 (Windows 3.1), и Mosaic показывал картинки с текстом, и счастье пришло.



imageИ потом пришел новый веб-браузер, известный как «Mozilla», что сокращением было для «Mosaic Killer»(«Убийца Мозаики»), но Mosaic не понравилось это, так что имя было изменено на Netscape и Netscape называл себя Mozilla/1.0 (Win3.1), и не было больше счастья. И Netscape поддерживал фреймы и фреймы стали популярны в народе, но Mosaic не поддерживал фреймы, и поэтому пришло время вынюхивания user agent-ов, и для Mozilla вебмастеры посылали фреймы, но для других браузеров не посылали.
И что дальше случилось, подкат расскажет вам
Всего голосов 260: ↑200 и ↓60+140
Комментарии68

Информация

В рейтинге
Не участвует
Откуда
Хайфа, Хайфа, Израиль
Дата рождения
Зарегистрирован
Активность