Как стать автором
Обновить
11
0
Дьяченко Илья @Delias

Front-end developer

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

Как заопенсорсить npm-пакет с нормальным деплоем, CI и демо (без потери радости к жизни)

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

Вот вы сделали что-то новое и крутое, приходит мысль — выложить в опенсорс и опубликовать в npm.


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


Если вы хотели опубликовать небольшой пакет, то такой набор работы может сильно отпугнуть. Светлая идея поделиться чем-то полезным уйдет в долгий ящик сложных дел.


На самом деле всё это может занять у вас меньше часа. Без знаний DevOps и совершенно бесплатно.


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

Руководство по работе с Redux

Время на прочтение80 мин
Количество просмотров283K
Сегодня Redux — это одно из наиболее интересных явлений мира JavaScript. Он выделяется из сотни библиотек и фреймворков тем, что грамотно решает множество разных вопросов путем введения простой и предсказуемой модели состояний, уклоне на функциональное программирование и неизменяемые данные, предоставления компактного API. Что ещё нужно для счастья? Redux — библиотека очень маленькая, и выучить её API не сложно. Но у многих людей происходит своеобразный разрыв шаблона — небольшое количество компонентов и добровольные ограничения чистых функций и неизменяемых данных могут показаться неоправданным принуждением. Каким именно образом работать в таких условиях?

В этом руководстве мы рассмотрим создание с нуля full-stack приложения с использованием Redux и Immutable-js. Применив подход TDD, пройдём все этапы конструирования Node+Redux бэкенда и React+Redux фронтенда приложения. Помимо этого мы будем использовать такие инструменты, как ES6, Babel, Socket.io, Webpack и Mocha. Набор весьма любопытный, и вы мигом его освоите!
Читать дальше →
Всего голосов 65: ↑59 и ↓6+53
Комментарии51

Стоимость недвижимости на тепловых картах

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

В статье рассказано о процессе создания тепловой карты цен по продаже недвижимости для Москвы и Санкт-Петербурга.


Тепловая карта цен Москвы


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

Читать дальше →
Всего голосов 126: ↑124 и ↓2+122
Комментарии78

Orange Pi One

Время на прочтение2 мин
Количество просмотров76K
Не смог удержаться и заказал за 9.9$ одноплатный ПК.



Очень и очень интересная железка. Размер чуть меньше кредитной карты.
Читать дальше →
Всего голосов 66: ↑44 и ↓22+22
Комментарии69

Jasmine — дополнительные возможности

Время на прочтение4 мин
Количество просмотров43K
Данная статья является продолжением первой части «Введение в Jasmine». Здесь рассматриваются дополнительные возможности тестового фреймворка Jasmine, а именно:

  • Spy — эмуляция функций/объектов
  • Clock — синхронизация вызовов при использовании setTimeout/setInterval
  • Runner и Reporter — запуск тестов и оформление отчета


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

Микросервисная архитектура, Spring Cloud и Docker

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

Привет, Хабр. В этой статье я кратко расскажу о деталях реализации микросервисной архитектуры с использованием инструментов, которые предоставляет Spring Cloud на примере простого концепт-пруф приложения.



Код доступен для ознакомления на гитхабе. Образы опубликованы на докерхабе, весь зоопарк стартует одной командой.

Читать дальше →
Всего голосов 31: ↑31 и ↓0+31
Комментарии32

Как «пробить» человека в Интернет: используем операторы Google и логику

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

В очередной статье нашего цикла публикаций, посвященного интернет-разведке, рассмотрим, как операторы продвинутого поиска Google (advanced search operators) позволяют быстро находить необходимую информацию о конкретном человеке.


В комментариях к первой нашей статье, читатели просили побольше практических примеров и скриншотов, поэтому в этой статье практики и графики будем много. Для демонстрации возможностей «продвинутого» поиска Google в качестве целей были выбраны личные аккаунты автора. Сделано это, чтобы никого не обидеть излишним интересом к его частной жизни. Хочу сразу предупредить, что никогда не задавался целью скрыть свое присутствие в интернете, поэтому описанные методы подойдут для сбора данных об обычных людях, и могут быть не очень эффективны для деанонимизации фэйковых аккаунтов, созданных для разовых акций. Интересующимся читателям предлагаю повторить приведенные примеры запросов в отношении своих аккаунтов и оценить насколько легко собирать информацию по ним.


Читать дальше →
Всего голосов 122: ↑105 и ↓17+88
Комментарии108

Консоль разработчика Google Chrome: десять неочевидных полезностей

Время на прочтение6 мин
Количество просмотров227K
Как с помощью консоли разработчика превратить Google Chrome в подобие текстового редактора? Какой смысл в ней приобретает знакомый многим по jQuery значок $? Как вывести в консоль набор значений, оформленный в виде вполне приличной таблицы? Если сходу ответы на эти вопросы в голову не приходят, значит вкладка Console из инструментов разработчика Chrome ещё не раскрылась перед вами во всей красе.

image

На первый взгляд, перед нами – вполне обычная JavaScript-консоль, которая годится только на то, чтобы выводить в неё логи ответов серверов или значения переменных. Я, кстати, так ей и пользовался, когда только начал программировать. Однако, со временем набрался опыта, подучился, и неожиданно для себя обнаружил, что консоль Chrome умеет много такого, о чём я и не догадывался. Хочу об этом сегодня рассказать. Да, если вы читаете сейчас не на мобильнике, можете тут же всё это и попробовать.
Читать дальше →
Всего голосов 88: ↑83 и ↓5+78
Комментарии62

Шпаргалка по SOLID-принципам с примерами на PHP

Время на прочтение10 мин
Количество просмотров439K
Тема SOLID-принципов и в целом чистоты кода не раз поднималась на Хабре и, возможно, уже порядком изъезженная. Но тем не менее, не так давно мне приходилось проходить собеседования в одну интересную IT-компанию, где меня попросили рассказать о принципах SOLID с примерами и ситуациями, когда я не соблюл эти принципы и к чему это привело. И в тот момент я понял, что на каком-то подсознательном уровне я понимаю эти принципы и даже могут назвать их все, но привести лаконичные и понятные примеры для меня стало проблемой. Поэтому я и решил для себя самого и для сообщества обобщить информацию по SOLID-принципам для ещё лучшего её понимания. Статья должна быть полезной, для людей только знакомящихся с SOLID-принципами, также, как и для людей «съевших собаку» на SOLID-принципах.

Читать дальше →
Всего голосов 110: ↑100 и ↓10+90
Комментарии67

Математика в JavaScript

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

Введение


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

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


Всем привет, с вами Максим Иванов и Дмитрий Сергиенков, и сегодня мы решили, что мы не будем говорить о модных и полезных штуках типа ReactJS, Angular, TypeScript и других. Сегодня мы уделим внимание математике в JavaScript. Если вам нравится математика, вы можете заниматься ей всё свободное время, но если вашей целью являются не научные изыскания, а работа программистом, математика вряд ли станет лучшим объектом для изучения.
Читать дальше →
Всего голосов 61: ↑55 и ↓6+49
Комментарии20

Делаем проект на Node.js с использованием Mongoose, Express, Cluster. Часть 1

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

Введение


Добрый день, дорогой %username%! Сегодня мы будем описывать создание каркаса приложение по типу MVC на Node.js с использованием кластеров, Express.js и mongoose.


Задача — поднять сервер который имеет несколько особенностей.


  • Работает в несколько асинхронных потоков.
  • Сессионная информация будет в общей для всех потоков.
  • Поддержка HTTPS.
  • Авторизация.
  • Легко масштабируем.

Статья написана новичком для новичков. Буду рад любым замечаниям!

Читать дальше →
Всего голосов 27: ↑20 и ↓7+13
Комментарии35

Шпаргалка по Flexbox (CSS3 Flexible Box)

Время на прочтение1 мин
Количество просмотров359K
Мне не нова магия Flexbox, но я не часто ее использую, и поэтому после паузы в использовании мне приходится открывать вот этот пост на CSS-Tricks чтобы освежить память.

Я решила создать краткую визуальную шпаргалку по Flexbox для тех случаев освежения памяти после паузы в будущем. Думаю, что у меня получилась шпаргалка, основанная на… шпаргалках.


Читать дальше →
Всего голосов 78: ↑75 и ↓3+72
Комментарии25

Теория категорий на JavaScript. Часть 1. Категория множеств

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


Абстракция – это одна из основных техник в ИТ. Любой язык программирования или моделирования, любая парадигма программирования (процедурная, функциональная, ООП, …) дают ответ на вопрос, как и от чего нужно абстрагироваться. Причём, адепты каждого подхода предлагают какой-то свой вариант абстракции.

Если вы хотите увидеть истинную, универсальную абстракцию, то вступайте в нашу… изучайте теорию категорий. В статье на примере категории множеств с картинками и JavaScript-кодом объясняются самые базовые понятия теории категорий: пределы, универсальное свойство. Рассматривается вычислительный аспект теории категорий.

Также немного говорится про классы, примеси и смеси в JavaScript.

Примеры из статьи можно посмотреть тут.
Читать дальше →
Всего голосов 48: ↑48 и ↓0+48
Комментарии47

JavaScript 2016, а можно попроще?

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

Последние полгода много пишут о неоправданной сложности клиентского JavaScript. Недавняя статья How it feels to learn JavaScript in 2016 и ее перевод на хабре вызвали много внимания, критика во многом справедливая, но...


Усложнять просто, упрощать сложно. (Один из законов Мерфи)


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


Как пример используется приложение для работы с коллекцией фильмов. Фильмы отображаются в списке с постраничной выборкой, поиском, сортировкой, редактированием и удалением.


Использованный стек: create-react-app как сборщик для клиента, React, bootstrap, API с json-server или json-заглушки.



Работающее демо здесь: Movies List.

Читать дальше →
Всего голосов 37: ↑28 и ↓9+19
Комментарии135

Angular 1.5: Компоненты

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

Не так давно увидел свет релиз Angular 1.5, который привносит множество интересных нововведений. Важной особенностью

данной версии является то, что это первый из череды релизов, который должен сгладить концептуальный разрыв между Angular1.x и Angular2.x. Для людей, у которых есть необходимость вести проекты на Angular сейчас, но в будущем планируется постепенная миграция на Angular2, это очень радостная новость.

В данной статье я постараюсь осветить основные нововведения:

  • Компоненты!
  • Односторонние биндинги!
  • Мульти-слот трансклюды!

Полный список изменений доступен в репозитории ангуляра. Так же нас ждет небольшой примерчик использования перечисленных фич.
Читать дальше →
Всего голосов 21: ↑21 и ↓0+21
Комментарии18

EditorConfig — Одни Настройки для всех Редакторов/IDE

Время на прочтение7 мин
Количество просмотров96K
EditorConfig это конфигурационный файл и набор расширений, к большому количеству редакторов кода и IDE (Далее просто IDE).

Его задача — создать единый формат настроек, и, раз и навсегда, решить вопросы вроде “табы или пробелы” для всех IDE и всех языков программирования. Такой файл может храниться в системе контроля версий проекта, что позволит всем его разработчикам использовать одну и ту же конфигурацию.

Файлы .editorconfig можно найти в таких проектах, как jQuery, Ruby, WordPress, и многих других.

Плагины доступны для большого количество IDE




Давайте разберемся, как это работает.
Читать дальше →
Всего голосов 75: ↑73 и ↓2+71
Комментарии32

Javascript-путешествие с шестью символами

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


Javascript – это странный и прекрасный язык, который позволяет писать безумный, но все еще валидный код. Он пытается помочь нам, конвертируя одни штуки в другие в зависимости от того, как мы работаем с ними.


Если добавить строку к чему-то, то он допустит, что мы хотим получить текст, поэтому сконвертирует все в строку.


Если мы добавляем префикс "плюс" или "минус", то он допустит, что нам нужно числовое представление и сконвертирует строку в число, если сможет.


Если мы отрицаем что-то, то он сконвертирует это в булево значение.


Мы можем использовать эти особенности языка и создать немного магии со всего-лишь шестью символами: [,],(,),! и +. Если вы читаете это на десктопе, то можете открыть консоль в вашем браузере (developer tools, например) и запускать код. Просто копируйте любой код из примеров ниже в консоль, и он должен исполнится и вернуть true.


Давайте начнем с простого. Вот главные правила:


  1. Префикс ! конвертирует в Boolean
  2. Префикс + конвертирует в Number
  3. Добавление [] конвертирует String

Вот они в действии:


![] === false
+[] === 0
[]+[] === ""
Читать дальше →
Всего голосов 123: ↑112 и ↓11+101
Комментарии32

Всё, что вы хотели знать об областях видимости в JavaScript (но боялись спросить)

Время на прочтение8 мин
Количество просмотров82K
У JS есть несколько концепций, связанных с областью видимости (scope), которые не всегда ясны начинающим разработчикам (и иногда даже опытным). Эта статья посвящена тем, кто стремится погрузиться в пучину областей видимости JS, услышав такие слова, как область видимости, замыкание, “this”, область имён, область видимости функции, глобальные переменные, лексическая область видимости, приватные и публичные области… Надеюсь, по прочтению материала вы сможете ответить на следующие вопросы:

— что такое область видимости?
— что есть глобальная/локальная ОВ?
— что есть пространство имён и чем оно отличается от ОВ?
— что обозначает ключевое слово this, и как оно относится с ОВ?
— что такое функциональная и лексическая ОВ?
— что такое замыкание?
— как мне всё это понять и сотворить?
Читать дальше →
Всего голосов 57: ↑47 и ↓10+37
Комментарии38

Полное практическое руководство по Docker: с нуля до кластера на AWS

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



Содержание



Вопросы и ответы


Что такое Докер?


Определение Докера в Википедии звучит так:


программное обеспечение для автоматизации развёртывания и управления приложениями в среде виртуализации на уровне операционной системы; позволяет «упаковать» приложение со всем его окружением и зависимостями в контейнер, а также предоставляет среду по управлению контейнерами.



Ого! Как много информации.

Читать дальше →
Всего голосов 125: ↑124 и ↓1+123
Комментарии44

Контроллеры директив в AngularJS

Время на прочтение3 мин
Количество просмотров52K
Немного о контроллерах директив. Зачем они нужны и чем отличаются от функции link.
Читать дальше →
Всего голосов 21: ↑19 и ↓2+17
Комментарии11
1
23 ...

Информация

В рейтинге
Не участвует
Откуда
Украина
Зарегистрирован
Активность