Pull to refresh
7
0
Сергей Маковеев @sergeymakoveev

Web-developer

Send message

Мышление в стиле Ramda: Частичное применение (каррирование)

Reading time8 min
Views11K
Данный пост — это третья часть серии статей о функциональном программировании под названием «Мышление в стиле Ramda».

1. Первые шаги
2. Сочетаем функции
3. Частичное применение (каррирование)
4. Декларативное программирование
5. Бесточечная нотация
6. Неизменяемость и объекты
7. Неизменяемость и массивы
8. Линзы
9. Заключение

Во второй части мы говорили о сочетании функций различным образом, закончив на функциях compose и pipe, которые позволяют использовать серию функций в режиме конвеера.

В том посте мы рассмотрели простые конвееры функций, которые принимают лишь один аргумент. Но что если мы хотим использовать такие функции, которые принимают больше одного аргумента?
Читать дальше →
Total votes 10: ↑9 and ↓1+8
Comments0

Вы знаете, что такое трансдьюсеры

Reading time6 min
Views45K

Трансдьюсеры были анонсированы еще в далеком 2014, с тех пор по ним было написано немалое количество статей (раз, два), но ни после одной статьи я не мог сказать, что понимаю трансдьюсеры кристально ясно. После каждой статьи у меня возникало ощущение, что я приблизительно понимаю что-то сложное, но оно все равно оставалось сложным. А потом однажды в голове что-то щелкнуло: "я ведь уже видел этот паттерн, только он назывался иначе!"

Читать дальше →
Total votes 59: ↑55 and ↓4+51
Comments98

Вы не знаете Node: краткий обзор основных возможностей

Reading time20 min
Views86K


Ремарка от автора
Это статья новая, но она не о новых возможностях. Она о core, то есть о платформе и о том что многие кто просто используют grunt, или webpack могут не подозревать, так скзать about fundamentals.

Более подробно читайте:

комментарии rumkin:
habrahabr.ru/company/mailru/blog/283228/#comment_8890604

комментарии Aiditz:
habrahabr.ru/company/mailru/blog/283228/#comment_8890476

комментарии Suvitruf:
habrahabr.ru/company/mailru/blog/283228/#comment_8890430


Идея этой публикации была навеяна серией книг Кайла Симпсона «Вы не знаете JavaScript». Они являются хорошим началом для изучения основ этого языка. А Node — это практически тот же JavaScript, за исключением небольших отличий, о которых я расскажу в этой статье. Весь код, приведённый ниже, вы можете скачать из репозитория, из папки code.

Зачем вообще переживать насчёт Node? Node — это JavaScript, а JavaScript используется почти везде! Мир был бы лучше, если бы большинство разработчиков в совершенстве владели Node. Чем лучше приложения, тем лучше жизнь!

Эта статья представляет собой реалистичный взгляд на наиболее интересные основные возможности Node. Ключевые моменты статьи:

  1. Цикл событий: освежаем ключевую концепцию, позволяющую реализовать неблокирующие операции ввода/вывода.
  2. Глобальный объект и процесс: как получить больше информации.
  3. Эмиттеры событий: интенсивное введение в событийную модель (event-based pattern)
  4. Stream’ы и буферы: эффективный способ работы с данными
  5. Кластеры: форкай процессы как профессионал
  6. Обработка асинхронный ошибок: AsyncWrap, Domain и uncaughtException
  7. Аддоны на C++: внесение своих наработок в ядро и написание собственных аддонов на С++
Читать дальше →
Total votes 50: ↑44 and ↓6+38
Comments32

350+ полезных ресурсов, книг и инструментов для работы с Docker

Reading time14 min
Views103K
Мы уже ни раз приводили полезные руководства и подборки источников для разработчиков. На этот раз мы решили продолжить тему контейнеров, которую мы затрагивали ранее, и рассказать о подборке тематических ресурсов на GitHub.

Читать дальше →
Total votes 34: ↑31 and ↓3+28
Comments8

Mercurial: изменяем историю

Reading time7 min
Views49K
Когда я познакомился с Mercurial, то все свои знания я почерпнул из статей Спольского (перевод на Хабре), которые подробно описывают основные принципы работы Mercurial и ежедневную работу с ним. Долгое время я использовал Mercurial в пределах, которые не превышали объема этих статей. Наверно, для одиночного разработчика этого почти достаточно. Почти. Но Mercurial сегодня значительно шире и обладает возможностями допускающими редактирование истории изменений, наличие которых, в общем-то, не очевидно, хотя возможности эти достаточно ценны. А из комментариев к разным статьям по системам управления версиями видно, что многие разработчики об этих возможностях не знают. Ниже я хочу провести обзор ряда возможностей Mercurial связанных с изменением истории.

О чем пойдет речь:

  • фазы
  • hg commit –amend
  • hg strip
  • hg rebase

Поехали
Total votes 26: ↑25 and ↓1+24
Comments4

JavaScript и Nginx = nginScript, а HTTP2 в придачу

Reading time6 min
Views40K

Дело было вечером, делать было нечего, но голова рукам покоя не давала и хотелось чего-то для души… А для души захотелось чего-то новенького, эдакого необычного.

Я, как и многие из хабровчан, люблю новинки. Релиз нового софта — это как праздник. Новые фичи, новые возможности… Новые способы забивать гвозди и кататься на велосипедах. Новые велосипеды… В общем можно придумать кучу аллегорий и метафор. А про что это я? Ах да, про Nginx, HTTP2 и JavaScript. Чем они связаны, спросите вы? А тем, что в последней версии Nginx (1.9.5) добавили много интересных плюшек, а именно:

  • добавили протокол HTTP2 и удалили модуль SPDY (нафиг старое барахло)
  • интегрировали прямо в nginx модуль ngx_http_js_module и создали свой диалект JavaScript

Го под кат, расскажу детали.
Читать дальше →
Total votes 52: ↑45 and ↓7+38
Comments57

React на ES6+

Reading time5 min
Views72K
Это перевод поста Steven Luscher опубликованного в блоге Babel. Steven работает в Facebook над Relay – JavaScript фрэймворком для создания приложений с использованием React и GraphQL.
За этот год, в процессе реорганизации Instagram Web, мы насладились использованием ряда особенностей ES6+, при написании нашх React компонентов. Позвольте мне остановиться на тех моментах, когда новые возможности языка могут повлиять на то как вы пишите React приложения, и сделают этот процесс легче и веселее, чем когда-либо.
Читать дальше →
Total votes 21: ↑19 and ↓2+17
Comments15

Мир недокументированного React.js. Context

Reading time6 min
Views35K
Предлагаю читателям «Хабрахабра» перевод статьи «The land of undocumented react.js: The Context».

Если мы взглянем на React компонент то мы можем увидеть некоторые свойства.

State


Да, каждый React компонент имеет state. Это что-то внутри компонента. Только сам компонент может читать и писать в свой собственный state и как видно из названия — state используется для хранения состояния компонента (Привет, Кэп). Не интересно, давайте дальше.

Props


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

Context


Встречайте context, причину, по которой я написал этот пост. Context — это недокументированная особенность React и похожа на props, но разница в том, что props передается исключительно от родительского компонента к дочернему и они не распространяются вниз по иерархии, в то время как context просто может быть запрошен в дочернем элементе.
Читать дальше →
Total votes 26: ↑24 and ↓2+22
Comments28

У нас проблемы с промисами

Reading time16 min
Views238K
Разрешите представить вам перевод статьи Нолана Лоусона «У нас проблемы с промисами», одной из лучших по теме из тех, что мне доводилось читать.

У нас проблемы с промисами


Дорогие JavaScript разработчики, настал момент признать это — у нас проблемы с промисами.

Нет, не с самими промисами. Их реализация по спецификации A+ превосходна. Основная проблема, которая сама предстала передо мной за годы наблюдений за тем, как многие программисты борются с богатыми на промисы API, заключается в следующем:

— Многие из нас используют промисы без действительного их понимания.

Если вы мне не верите, решите такую задачку:

Вопрос: В чем разница между этими четырьмя вариантами использования промисов?

doSomething().then(function () {
  return doSomethingElse();
});

doSomething().then(function () {
  doSomethingElse();
});

doSomething().then(doSomethingElse());

doSomething().then(doSomethingElse);

Узнайте решение задачи
Total votes 139: ↑136 and ↓3+133
Comments121

Начинаем работать с browserify

Reading time15 min
Views116K

Введение


Решения, написанные на JavaScript становятся сложнее из года в год. Это, несомненно, обусловлено разрастанием такого прекрасного зверя, как веб. Многие из нас сейчас работают с JavaScript модулями — независимыми функциональными компонентами, которые собираются вместе и работают как единое целое. Так же такой подход позволяет нам реализовать взаимозаменяемость компонентов, не прикончив попутно код. Многие из нас использовали для этого паттерн AMD и его реализацию в RequireJS.
Читать дальше →
Total votes 44: ↑37 and ↓7+30
Comments62

Способы организации CSS-кода

Reading time8 min
Views205K
Разработчик Бен Фрейн (Ben Frain) однажды заметил: «Писать CSS-код легко. Масшабировать и поддерживать его — нет».

К счастью, на просторах интернета можно найти множество решений этой проблемы. В данной статье рассмотрены основные киты структуры CSS-кода, а также интересные рыбы/млекопитающие поменьше.

Статья служит лишь памяткой или кратким справочником — для подробного ознакомления с методологиями настоятельно рекомендуется изучать оригинальную документацию.

Итак, начнем.
Читать дальше →
Total votes 44: ↑42 and ↓2+40
Comments61

Верстка email рассылок от А до Я для чайников

Reading time9 min
Views406K
Уже 3 с лишним года занимаюсь дизайном и версткой почтовых рассылок, которые ориентированы на англоязычных пользователей. За время работы перелопатили огромную кучу информации, перепробовали много вариантов верстки, набили достаточное количество шишек. Были найдены и исправлены типичные баги, которые в той или иной мере повторялись во всех почтовых клиентах. Также нашлись проблемы с некоторыми CSS свойствами — различные почтовые клиенты интерпретировали их по разному. Каждое письмо тестировалось на самых популярных почтовых клиентах: Gmail, Outlook, Yahoo, Android, iOS, MozillaThunderbird, Microsoft Outlook, The Bat. Рассылки ходят на сотни миллионов пользователей и приносят очень хорошие результаты. Итак, приступим к изучению.
Читать дальше →
Total votes 66: ↑62 and ↓4+58
Comments35

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

Reading time10 min
Views104K
Если вы когда-нибудь сталкивались с задачей ресайза картинок в браузере, то вы наверное знаете, что это очень просто. В любом современном браузере есть такой элемент, как холст (<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
Читать дальше →
Total votes 156: ↑152 and ↓4+148
Comments90

Количественные CSS селекторы

Reading time7 min
Views92K
Вам когда-нибудь хотелось прямо в CSS коде посчитать, в меню 4 элемента или 10? Для четырех задать им ширину по 25%, а если набралось десять — прижать их друг к другу и уменьшить отступы?
Как выяснилось, CSS умеет работать с разным количеством элементов, позволяя избавиться от головных болей и лишнего кода на js.


Читать дальше →
Total votes 65: ↑61 and ↓4+57
Comments24

Хотите распределить элементы, привязавшись к их количеству, на одних стилях? Да запросто

Reading time3 min
Views24K
Альтернативное название статьи – «почти :child-count(n)». Потому что именно так оно все и работает. На голом CSS и без каких-либо дата-атрибутов или чего-либо еще в верстке.

Представьте, что у вас есть, например, какая-нибудь лента новостей. Неважно, какая. Главное, что вы не знаете, сколько в ней будет элементов, и как их расставить так, чтобы было симметрично. И хочется сделать что-то бесполезное, но красивое: например, расставить все в две колонки, а некоторые блоки вставить во всю ширину. Каждый третий, или каждый пятый.

Конечно же, если у вас четыре элемента, а третий вы сделали во всю ширину – последний будет свешиваться в конце. Поэтому нужно применять такую красивую и бесполезную вещь только в том случае, если количество элементов кратно трем. А если их нечетное число(но не кратное трем) — нужно делать, например, последний элемент во всю шинину.
Вот так, например:



Как же это сделать?
Total votes 51: ↑43 and ↓8+35
Comments19

Интересный и одновременно простой слайдер на чистом CSS3

Reading time5 min
Views304K
Я никому не открою Америку, не удивлю публику новым фокусом и не взорву мозг тем, кто в CSS3 плавает, как аквалангист. Расскажу простой способ, как создать слайдер с помощью простых функций CSS3 без необходимости использовния javascript.
Читать дальше →
Total votes 55: ↑50 and ↓5+45
Comments39

LEGO Mindstorms EV3. Игрушечный скайнет. Начало

Reading time10 min
Views117K
— Ты кого хотел бы — сына или дочку?
— Сына!
— Почему?
— Вертолёт хочу радиоуправляемый!!!
Несмешной и баянистый анекдот, но нельзя просто так взять и начать эту публикацию не с него – он в лучшем виде отображает суть того, о чём пойдёт речь далее. Впрочем, из заголовка вы и так поняли, о чём речь.



Осторожно! Публикация может вызвать непреодолимое желание завести сына.
Читать дальше →
Total votes 60: ↑59 and ↓1+58
Comments42

Кручу-верчу, запутать хочу. Разбираемся в линейках HDD

Reading time11 min
Views239K
Привет, гиктаймс!

Сегодня у нас необычный материал, статья-ликбез: выбираем правильные HDD в зависимости от предполагаемых сценариев использования. Дело в том, что производители наплодили целую кучу разных линеек, и, если не следить за темой регулярно, через год-полтора можно легко забыть, какая серия к чему относится, зачем нужна и чем отличается.
Читать дальше →
Total votes 61: ↑58 and ↓3+55
Comments33

Языки пламени в CSS

Reading time2 min
Views39K
Прочитав статью про капельное преобразование в CSS, я решил поиграться с настройками в коде примера на CodePen и случайно выделил движущиеся блоки. Мне это показалось красивым и похожим на процесс горения. После недолгих размышлений код был кустарным образом распилен на части, сдобрен прозрачностью фона, анимацией и цветными тенями, и вот, что из этого получилось.



Подойти к огню
Total votes 74: ↑72 and ↓2+70
Comments37

Information

Rating
Does not participate
Location
Пенза, Пензенская обл., Россия
Date of birth
Registered
Activity

Specialization

Specialist
Lead
From 350,000 ₽
TypeScript
React
JavaScript