• Основы реактивного программирования с использованием RxJS. Часть 3. Higher Order Observables

    • Tutorial


    В данной статье мы рассмотрим, как можно в одном потоке обрабатывать другой, для чего это нужно, и как нам в этом помогут операторы Higher Order Observables (дальше HOO).

    Серия статей «Основы реактивного программирования с использованием RxJS»:



    При работе с потоками часто возникает ситуация, когда необходимо в качестве значения одному потоку передать результаты работы другого. Например, мы хотим выполнить ajax запрос и его ответ обработать в текущем потоке, или запустить несколько параллельных запросов, реализовать pooling. Думаю, многие привыкли решать подобные задачи, используя такой механизм как promise. Но можно ли решать их используя RxJS? Конечно, и все куда проще чем вы думаете!
    Читать дальше →
    • +13
    • 15.9k
    • 5
  • Структуры данных для самых маленьких

    • Translation
    James Kyle как-то раз взял и написал пост про структуры данных, добавив их реализацию на JavaScript. А я взял и перевёл.

    Дисклеймер: в посте много ascii-графики. Не стоит его читать с мобильного устройства — вас разочарует форматирование текста.


    Читать дальше →
  • Основы компьютерных сетей. Тема №1. Основные сетевые термины и сетевые модели

    • Tutorial
    Всем привет. На днях возникла идея написать статьи про основы компьютерных сетей, разобрать работу самых важных протоколов и как строятся сети простым языком. Заинтересовавшихся приглашаю под кат.


    Читать дальше →
  • Как подружить дизайнера, верстальщика и «Фигму» с помощью дизайн-системы, ломика и какой-то матери™

    • Tutorial


    Привет, Хабр. Недавно я выпендрился в комментариях и пообещал подробно ответить на вопрос о том, как дизайн-система упрощает взаимоотношения и нейтрализует конфликты между дизайнерами и верстальщиками (разработчиками). Плюс рассказать о некоторых вариантах стандартизации именования слоёв. Вот и отвечаю. Подробно. Про сетки. Про компоненты. Про иконки. Про язык. Про БЭМ. Про «фигмин» слэш и её же плагины. Про артборды и вьюпорты. Про типографику. Про стили и палитры. Про эффекты. Про экспорт растра. Про «мультиплеер». Про распределение обязанностей. Ну и немножко «о жизни, вселенной и вообще». Осторожно, трафик: внутри много картинок, есть gif-анимации. А ещё много, действительно много нудного текста. Я предупредил.
    Читать дальше →
  • Учебный курс по React, часть 1: обзор курса, причины популярности React, ReactDOM и JSX

    • Translation
    • Tutorial
    Представляем вашему вниманию первые 5 занятий учебного курса по React для начинающих. Оригинал курса на английском, состоящий из 48 уроков, опубликован на платформе Scrimba.com. Возможности этой платформы позволяют, слушая ведущего, иногда ставить воспроизведение на паузу и самостоятельно, в том же окне, в котором ведётся демонстрация, экспериментировать с кодом. Курс показался нам интересным, мы решили перевести его на русский и преобразовать в формат традиционных публикаций.



    Полагаем, этот курс будет полезен всем, кто, что называется, «не умеет в React», но хочет научиться. В то же время, на то, чтобы превратить этот курс в обычные публикации, нужны немалые силы и время, поэтому мы, прежде чем принимать окончательное решение о запуске этого проекта, предлагаем всем желающим оценить курс и поучаствовать в опросе о целесообразности его перевода.
    Читать дальше →
  • Senior Engineer в поисках работы. Как я прошел 20 собеседований с HR и что я об этом думаю

    • Translation
    Предисловие для читателей Хабра — статья о поиске работы на рынке разработки в Украине (который в основном об аутсорсе на иностранных заказчиков), поэтому некоторые вещи могут показаться странными (LinkedIn, собеседования с заказчиками, обязательное требование разговорного английского, обсуждение ЗП в долларах) или нерелевантными для РФ. Тем не менее, статья имела большой успех на локальных ресурсах, и читатели попросили меня перевести её на русский.

    Этой статьей я хочу начать цикл рассказов о том, как я на протяжении нескольких месяцев проходил собеседования в примерно 20-и разных компаниях на разные должности. Тут будут мои мысли о рынке труда, процессе найма, советы а так же несколько самых интересных историй. Цикл будет состоять из нескольких частей — HR собеседования, технические собеседования, финальные собеседования. Итак, первая часть.

    Немного о себе. Программирую со школьного возраста, за деньги работаю 10 с хвостиком лет. Работал админом, программистом, тимлидом, РМ-ом, линейным менеджером. Выполнял обязанности SRE/DevOps, архитекта, HR, офис-менеджера, эникейщика.

    Работал в кровавом энтерпрайзе, в стартапе, в аутсорсе. В основном занимался формошлёпством и крудами, имел дело с Java и бэкендом. За последние несколько лет пересел на фуллстек микс из Java, Ruby/RoR, Python, Node.js.

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

    Всего я прошел примерно 20 собеседований с рекрутерами: половина из которых были из агенств и половина — штатные рекрутеры/HR компаний. Так что, могу сказать что некоторая статистика у меня есть.
    Читать дальше →
  • Введение в программирование шейдеров для верстальщиков

    • Tutorial


    WebGL существует уже давно, про шейдеры написано немало статей, есть серии уроков. Но в основной массе они слишком сложные для верстальщика. Даже лучше сказать, что они охватывают большие объемы информации, которые скорее нужны разработчику игрового движка, чем верстальщику. Там сразу начинают с построения сложной сцены, камера, свет… На обычном сайте для создания пары эффектов с фотографиями все эти знания избыточны. В результате люди делают очень сложные архитектурные конструкции и пишут длинные-длинные шейдеры ради очень простых по сути действий.


    Все это побудило создать введение в те аспекты работы с шейдерами, которые наиболее вероятно пригодятся в работе именно верстальщику для создания различных 2d-эффектов с картинками на сайте. Конечно с поправкой на то, что сами по себе в дизайне интерфейсов они у нас применяются относительно редко. Мы сделаем стартовый шаблон на чистом JS без сторонних библиотек и рассмотрим идеи создания некоторых популярных эффектов, основанных на сдвиге пикселей, которые сложно сделать на SVG, но при этом они легко реализуются с помощью шейдеров.

    Читать дальше →
    • +40
    • 25.3k
    • 8
  • Кривые Безье и Пикассо

    • Translation

    Пабло Пикассо в своей студии на фоне картины «Кухня», фотография Херберта Листа.

    Художник и простота


    Одни из самых любимых мной работ Пабло Пикассо — это его линейные рисунки. Он изобразил на некоторых из них животных: сову, верблюда, бабочку и т.д. Эта работа под названием «Собака» висит на моей стене:


    (Можете перейти к интерактивному демо, в которой мы воссоздали «Собаку» с помощью представленных в статье математических расчётов)

    Эти рисунки чрезвычайно просты, но каким-то образом им удаётся глубоко тронуть зрителя. Они создают впечатление простоты композиции и реализации. Одно движение руки и подпись создают настоящий шедевр! Рисунок одновременно кажется и небрежной импровизацией, и точно подобранной увертюрой в симфонии изящества.
    Читать дальше →
    • +16
    • 29.1k
    • 1
  • Мышление в стиле Ramda: Первые шаги

    • Translation
    • Tutorial
    Недавно я познакомился с замечательной серией статей "Thinking in Ramda", которые проясняют на простых и ясных примерах способы написания кода в функциональном стиле с использованием библиотеки Ramda. Эти статьи показались мне настолько прекрасными, что я не смог удержаться от того, чтобы не перевести их на русский язык. Надеюсь, что в этом будет польза для многих людей :) Давайте начнём перевод с первой вступительной статьи.

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

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

    Я буду использовать библиотеку Ramda в этих статьях, хотя многие из обсуждаемых идей применимы также к множеству других библиотек, таких как Underscore и Lodash, а также к другим языкам программирования.

    Я буду придерживаться лёгкой, менее академической стороны функционального программирования. Это в основном потому что я хочу, чтобы серия была доступна большему числу людей, но также частично и потому что я сам не так близок к истинно функциональной дороге.
    Читать дальше →
    • +13
    • 19.3k
    • 6
  • XSD — умный XML

      XSD — это язык описания структуры XML документа. Его также называют XML Schema. При использовании XML Schema XML парсер может проверить не только правильность синтаксиса XML документа, но также его структуру, модель содержания и типы данных.

      Такой подход позволяет объектно-ориентированным языкам программирования легко создавать объекты в памяти, что, несомненно, удобнее, чем разбирать XML как обычный текстовый файл.

      Кроме того, XSD расширяем, и позволяет подключать уже готовые словари для описания типовых задач, например веб-сервисов, таких как SOAP.

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

      Рассмотрим в качестве примера XSD документ, описывающий часть структуры аккаунта на хабре.



      Читать дальше →
    • Создание вашей первой игры на Phaser. Часть 0 — Подготовка к работе

      • Tutorial

      Phaser


      Оглавление


      0. Подготовка к работе [Вы тут]
      1. Введение
      2. Загрузка ресурсов
      3. Создание игрового мира
      4. (wip) Группы
      5. (wip) Мир физики
      6. (wip) Управление
      7. (wip) Добавление целей
      8. (wip) Последние штрихи


      Эта серия статей научит вас основам и "хорошему тону" игрового фремворка Phaser. За данный курс, я постараюсь объяснить вам основные идеи и возможности фреймворка, а также покажу как его грамотно использовать в связке с TypeScript и Webpack.

      Читать дальше →
      • +14
      • 19.2k
      • 8
    • Евклидов алгоритм генерации традиционных музыкальных ритмов

      Перевод статьи Godfried Toussaint The Euclidean Algorithm Generates Traditional Musical Rhythms.

      От переводчика


      В Sonic Pi есть функция spread, которая принимает два числовых параметра и возвращает набор значений для генерации ритма. В описании этой функции есть ссылка на работу «The Euclidean Algorithm Generates Traditional Musical Rhythms». Эта блестящая статья, вышедшая аж в 2005 году, похоже, так и не была переведена на русский язык. Не будучи специалистом по переводам, я попытался, тем не менее, восполнить этот пробел.
      Небольшое пояснения по поводу слова «ожерелье»: в тексте статьи «necklace» — в музыкальной теории такого термина нет, насколько мне известно. Я полагаю, что это просто некая визуальная интуиция автора, действительно ведь ритмическое кольцо, в том виде, в каком оно представлено на рисунках, напоминает ожерелье — поэтому так и перевожу.

      Конспект


      Евклидов алгоритм (дошедший до нас из «Начал» Евклида) подсчитывает наибольший общий делитель двух целых чисел. Настоящая работа демонстрирует, что структура евклидова алгоритма может быть использована для того, чтобы очень эффективно генерировать большое семейство ритмов, используемых в качестве пульсаций (остинато), в частности в музыке тропической Африки, и в традиционной музыке вообще. Эти ритмы, называемые здесь евклидовыми ритмами, имеют то свойство, что их ударные рисунки распределяются насколько возможно равномерно. Евклидовы ритмы также находят приложение в ускорителях в атомной физике и в компьютерных науках, и тесно связаны с несколькими семействами слов и последовательностями, изучаемыми комбинаторикой слов, такими как евклидовы строки, с которыми сравнивают евклидовы ритмы.
      Читать дальше →
    • Создание сеток шестиугольников

      • Translation
      image

      Сетки из шестиугольников (гексагональные сетки) используются в некоторых играх, но они не так просты и распространены, как сетки прямоугольников. Я коллекционирую ресурсы о сетках шестиугольников уже почти 20 лет, и написал это руководство по самым элегантным подходам, реализуемым в простейшем коде. В статье часто используются руководства Чарльза Фу (Charles Fu) и Кларка Вербрюгге (Clark Verbrugge). Я опишу различные способы создания сеток шестиугольников, их взаимосвязь, а также самые общие алгоритмы. Многие части этой статьи интерактивны: выбор типа сетки изменяет соответствующие схемы, код и тексты. (Прим. пер.: это относится только к оригиналу, советую его изучить. В переводе вся информация оригинала сохранена, но без интерактивности.).
      Читать дальше →
    • Нейронные сети на Javascript

        image
        Идея для написания этой статьи возникла прошлым летом, когда я слушал доклад на конференции BigData по нейронным сетям. Лектор «посыпал» слушателей непривычными словечками «нейрон», «обучающая выборка», «тренировать модель»… «Ничего не понял — пора в менеджеры», — подумал я. Но недавно тема нейронных сетей все же коснулась моей работы и я решил на простом примере показать, как использовать этот инструмент на языке JavaScript.

        Мы создадим нейронную сеть, с помощью которой будем распознавать ручное написание цифры от 0 до 9. Рабочий пример займет несколько строк. Код будет понятен даже тем программистам, которые не имели дело с нейронными сетями ранее. Как это все работает, можно будет посмотреть прямо в браузере.
        Читать дальше →
      • Тестирование GUI приложений с помощью оптического распознавания текстов

        Функциональное тестирование интерфейса (GUI) приложений — задача очень важная, нужная, но не всегда тривиальная. Основной вопрос тут: как сэмулировать работу пользователя? Простого, рядового пользователя, которому придется непосредственно изо дня в день работать с вашим софтом.

        Казалось бы, причем здесь распознавание текстов?
        Читать дальше →
      • Советы, библиотеки и дополнительные материалы по CSS-анимации

          Советы, библиотеки и дополнительные материалы по CSS-анимации

          Введение


          Была глубокая ночь. В темную комнату через деревянные окна проникал лунный свет. Он недостаточно освещал мой деревянный стол с ноутбуком, блокнотом и синей ручкой. Поэтому я протянул свою руку к настольной лампе и включил её.

          На компьютере был открыт текстовой файл со списком статей и библиотек про веб-разработку. Он постоянно пополнялся новыми данными.

          Свернув его, я пошел на улицу в поисках кинотеатра с Deadpool'ом запустил браузер и стал блуждать по окрестностям интернета. Во время прогулки я наткнулся на интересную js-библиотеку по созданию css-анимации, которую добавил в открытый до этого текстовой документ… Как оказалось, по этой теме у меня уже набралось больше 40 ссылок на материалы и библиотеки.
          Читать дальше →
        • Монолитные репозитории в Git

          • Translation
          Многие выбрали Git за его гибкость: в частности, модель веток и слияний позволяют эффективно децентрализовать разработку. В большинстве случаев эта гибкость является плюсом, однако некоторые сценарии поддержаны не так элегантно. Один из них — это использование Git для больших монолитных репозиториев — монорепозиториев. Эта статья исследует проблемы монорепозиториев в Git и предлагает способы их смягчения.

          Скала Улуру
          Скала Улуру в Австралии как пример монолита — КДПВ, не более

          Что такое монорепозиторий?


          Определения разнятся, но мы будем считать репозиторий монолитным при выполнении следующих условий:
          • Репозиторий содержит более одного логического проекта (например, iOS-клиент и веб-приложение)
          • Эти проекты могут быть не связаны, слабо связаны или связаны сторонними средствами (например, через систему управления зависимостями)
          • Репозиторий большой во многих смыслах:
            • По количеству коммитов
            • По количеству веток и/или тегов
            • По количеству файлов
            • По размеру содержимого (то есть размеру папки .git)
          Читать дальше →
        • TameJS — приручаем асинхронное программирование

            Что такое TameJS ?


            TameJS — это расширение Javascript, которое делает событийное/асинхронное программирование более простым и элегантным. Его очень просто использовать с nodejs или другими v8-проектами.
            Читать дальше →
          • Функциональное программирование на Javascript

            • Translation
            • Tutorial


            Краткое содержание:

            Возьмем немного функций высшего порядка, добавим частичное применение функций, приправим fold с map-ом и получим Javascript DSL для работы с DOM.

            Человеческим языком:
            Простое и понятное введение в функциональное программирование на чистом и понятном Javascript.

            В отличие от «Через тернии к Haskell» все разжевано (возможно даже слишком) и разложено по полочкам.

            Прочтение статьи развоплотит миф о неприменимости ФП в реальной жизни. Вы сможете смотреть на решение одной и той же задачи с разных точек зрения. Прямо как на картинке.

            Читать дальше →
          • How-to: Процесс создания верстки html-писем

            • Translation
            В нашем блоге мы уже неоднократно рассказывали о создании email-рассылок с помощью CSS и HTML. Сегодня же речь пойдет о самом подходе к созданию верстки. Итальянский дизайнер Массимо Кассандро на сайте SitePoint описал свой процесс разработки html-писем. В нем есть несколько интересных моментов, так что мы решили сделать адаптированный перевод этой заметки.



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

            По моему опыту, особенно важно это при создании HTML почтовых писем. Email требует выполнения большого количества повторяющихся задача, которые сами по себе не так уж сложны, но затрагивают огромное количество разных элементов, что может приводить к ошибкам. Вот, как я стараюсь этого избежать.
            Читать дальше →
            • +11
            • 27.4k
            • 6