Pull to refresh
5
0
Леонид @LFedorov

Software Engineer

Send message

Блог а-ля Хабр, выбор платформы

Reading time5 min
Views15K

В предыдущей серии (Как слямзить Хабр по-быстрому) запустил проект на базе Create React App (CRA). Но это SPA, что не очень подходит, когда требуется индексация в поисковиках. Нужен Server Side Rendering (SSR). И желательно из коробки, а не на коленке. Крайне расточительно тратить ресурсы на самостоятельную разработку базовых технологий. Как выбирать платформу с поддержкой SSR? На практике, конечно, POC. Попробую реализовать CRUD с формой ввода на Material-UI, рассматривая кандидатов: React Starter Kit (RSK), NEXT.js и Electrode (не путать с Electron).


Исходники на GitHub.

Читать дальше →
Total votes 24: ↑20 and ↓4+16
Comments44

Эврика! Моменты озарения при изучении React

Reading time5 min
Views21K
Светлана Шаповалова, редактор «Нетологии», перевела статью Тайлера МакГинниса, в которой он перечислил основные моменты озарения, которые возникают при изучении React.

image

Одна из моих главных преподавательских задач — сделать так, чтобы у людей чаще случались моменты озарения. «Эврика!» — это момент внезапного прояснения, когда ранее непонятные факты вдруг обретают смысл. Такое случалось с каждым. Я знаком со многими преподавателями и лучшие из них умеют так преподносить урок, чтобы озарение у учеников возникало намного чаще.
Читать дальше →
Total votes 40: ↑35 and ↓5+30
Comments9

Создаем дизайн-систему

Reading time8 min
Views22K
Вне всякого сомнения, о дизайн-системах меня спрашивают чаще, чем о чем-либо другом. За последние несколько лет я посвятил много времени размышлениям о том, как выстраивать, реализовывать и представлять дизайн-системы для таких продуктов, как Marvel, Bantam и Modulz, и теперь решил, что пришла пора поделиться тем, чему научился в процессе.



Что такое дизайн-система?

Ни для кого не секрет, что дизайнеры любят хорошие UI-киты. Но, по моим наблюдениям, в последнее время все больше внимания уделяется не просто наборам инструментов и руководствам по стилю, а созданию систем, которые связывают воедино целые продукты. Компании вроде Shopify и Intercom формируют особые команды, которые занимаются только и исключительно дизайн-системами. Люди начинают осознавать, как важен системный подход в дизайне. Это внушает оптимизм. Кто знает, возможно, в один прекрасный день появится инструмент для дизайнеров, который не будет предполагать, что в каждом новом проекте мы начинаем все с нуля.
Читать дальше →
Total votes 18: ↑16 and ↓2+14
Comments4

Больше, чем React: Почему не следует использовать ReactJS для сложных интерактивных фронтенд-проектов

Reading time6 min
Views50K
Перевод статьи, посвящённой использованию ReactJS для создания фронтенда.

React — отличный инструмент для реализации простых интерактивных веб-сайтов. Но насколько он применим в сложных фронтенд-проектах? Работает ли он там столь же хорошо?

В этой статье мы рассмотрим некоторые проблемы, с которыми можно столкнуться при использовании React во время веб-разработки. Также вы узнаете, почему автор статьи решил разработать новый фреймворк на Scala, благодаря которому удалось сократить количество строк кода с 30 тысяч (на React) до одной тысячи.
Читать дальше →
Total votes 65: ↑32 and ↓33-1
Comments169

React + mobx путь с нуля. Mobx + react, взгляд со стороны

Reading time10 min
Views68K


В «настоящих» проектах мы получаем данные от сервера или пользовательского ввода, форматируем, валидируем, нормализуем и производим другие операции над ними. Всё это принято считать бизнес логикой и должно быть помещено в Model. Так как react — это только треть MVC пирога, для создания пользовательских интерфейсов, то нам потребуется еще что-то для бизнес логики. Некоторые используют паттерны redux или flux, некоторые — backbone.js или даже angular, мы же будем использовать mobx.js в качестве Model.
Читать дальше →
Total votes 19: ↑18 and ↓1+17
Comments53

О функциональном программировании в фронтенде

Reading time4 min
Views33K
Заинтересовался темой функционального программирования, увидел здесь статью, и решил перевести, статья вышла небольшая, но интересная. Ссылка на оригинал. Далее сам перевод.
Читать дальше →
Total votes 41: ↑26 and ↓15+11
Comments127

Фильтрация и создание цепочек в функциональном JavaScript

Reading time7 min
Views19K


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

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

Хотя JavaScript поддерживает методики функционального программирования, он не оптимизирован для полноценного использования этой парадигмы, как Haskell или Scala. Не обязательно добиваться того, чтобы ваши JS-программы полностью соответствовали концепциям функционального программирования. Но их применение помогает поддерживать чистоту кода и концентрироваться на создании архитектуры, которая легко тестируется и может использоваться в нескольких проектах.
Читать дальше →
Total votes 32: ↑27 and ↓5+22
Comments32

Насколько гибкими являются наши знания в области операторов Rx?

Reading time4 min
Views8.8K
RxJava набирает все большую популярность в нынешнее время. На ней написаны многие библиотеки для Java и Android, а обладание знаниями в этой области стало синонимом избранности. В резюме строка с описанием того что вы спец в реактивном программировании поднимает вашу привлекательность для работодателей перед вашими конкурентами.

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

Еще куча времени было потрачено на практику и блуждание в операторах. Для большей эффективности я придумал себе несколько задачек, и поставил целью решить их, применяя только операторы Rx. Предлагаю вам тоже испытать свои знания!
Читать дальше →
Total votes 16: ↑16 and ↓0+16
Comments25

Эволюция модульного JavaScript

Reading time20 min
Views42K


Скорее всего, когда Брендан Айк проектировал JavaScript, он не представлял, как эволюционирует его проект спустя двадцать лет. На данный момент вышло уже шесть основных спецификаций языка, и работа над его улучшением до сих пор продолжается.

Не будем лукавить: JavaScript никогда не был идеальным языком программирования. Одним из слабых мест в JS была модульность, а точнее её отсутствие. Действительно, зачем в скриптовом языке, который анимирует падающие на странице снежинки и валидирует форму, заботиться об изоляции кода и зависимостях? Ведь всё может прекрасно жить и общаться между собой в одной глобальной области — window.

С течением времени JavaScript трансформировался в язык общего назначения, так его начали использовать для построения сложных приложений в различных средах (браузер, сервер). При этом нельзя было положиться на старые подходы взаимодействия компонентов программы через глобальную область: с ростом объёма кода приложение становилось очень хрупким. Как результат для упрощения процесса разработки создавались различные реализации модульности.

Эта статья появилась в результате общения с участниками TC39 и разработчиками фреймворков, а также чтения исходных кодов, блогов и книг. Мы рассмотрим следующие подходы/форматы: Namespace, Module, Detached Dependency Definitions, Sandbox, Dependency Injection, CommonJS, AMD, UMD, Labeled Modules, YModules и ES2015 Modules. Кроме того, мы восстановим исторический контекст их появления и развития.
Читать дальше →
Total votes 47: ↑44 and ↓3+65
Comments34

Пилим каталог товаров не притрагиваясь к реляционной алгебре

Reading time7 min
Views18K

Здравствуйте, меня зовут Дмитрий Карловский и я… давно не занимался бэкендом, но на днях вдруг наткнулся на мучения SbWereWolf по натягиванию ужа на ежа и не смог удержаться от соблазна сдуть пыль со своего мульти-инструмента OrientDB да оттяпать им чего-нибудь этакого.


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


Разбирать мы будем вот этот вот реляционный звездолёт:


17 таблиц


А собирать вот такой вот графовый скворечник:


5 классов

Читать дальше →
Total votes 22: ↑19 and ↓3+16
Comments38

Инженер VS Программист. Или куда уходят инженеры

Reading time3 min
Views62K
За последнюю неделю на Хабре появилось как минимум три поста о том, как люди разного возраста, пола и полученной специальности становились программистами. Успешными программистами. Эти истории отвечали на вопрос «как», но почти упускали вопрос «почему».

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

Почему же я, инженер с 14 годами стажа, решил перейти в программисты?
Читать дальше →
Total votes 50: ↑43 and ↓7+36
Comments170

Как вернуться в кодеры, когда за сорок

Reading time3 min
Views44K

Сколько раз рассказывал коллегам и на собеседованиях. Видимо есть спрос и на Хабре. Кто-то встал перед выбором. Другой сомневается в правильности намеченного пути. Когда выгораешь, такое случается. Кому-то интересно, с чем предстоит столкнуться впереди, или сопоставить своё подобное. Поверьте, это короткая версия объёмной тоскливой истории.

Читать дальше →
Total votes 87: ↑64 and ↓23+41
Comments174

Программисты не могут написать алгоритмы без помощи: ещё раз про интервью

Reading time3 min
Views61K
Дэвид Хэнссон, создатель Ruby on Rails, признался в своём твиттере, что не написал бы сортировку пузырьком на доске. Дэвид подсматривает код в интернете всё время:

image
Читать дальше →
Total votes 83: ↑71 and ↓12+59
Comments687

Интернационализация (i18n) в Angular 2

Reading time5 min
Views33K
Для создания мультиязычных интерфейсов Ангулар предлагает использовать механизм разметки HTML шаблонов специальным маркером i18n который после компиляции удаляется из финального кода. Для этого достаточно указать этот маркер как атрибут тега окружающего текст.
Читать дальше →
Total votes 26: ↑25 and ↓1+24
Comments10

React или Vue? Выбираем библиотеку для фронтенд-разработки

Reading time7 min
Views84K
На чём делать фронтенд? Самый верный способ найти ответ – попробовать лучшие библиотеки самостоятельно. В идеале, хорошо бы начать с самого простого и понять, как таинственные для непосвящённого конструкции превращаются в готовые к выводу страницы. Дальше же, вооружившись пониманием основ, можно осмысленно читать документацию и усложнять собственные эксперименты до тех пор, пока ответ не покажется очевидным.



Сегодня мы поговорим о React.js и Vue.js. Это – одни из самых популярных JavaScript-библиотек в мире. Взгляните на этот список, посмотрите их репозитории на GitHub. И та, и другая обладают впечатляющими возможностями и служат для создания пользовательских интерфейсов. Работать с ними довольно просто, главное – сразу понять, что к чему, сделать правильный первый шаг. Собственно говоря, этому вот первому шагу в разработке с использованием React и Vue и посвящён данный материал.
Читать дальше →
Total votes 47: ↑38 and ↓9+29
Comments109

Современный JavaScript или как сделать ваш Redux-модуль готовым к переиспользованию

Reading time5 min
Views13K


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


Читать дальше →
Total votes 22: ↑17 and ↓5+12
Comments18

Дайджест свежих материалов из мира фронтенда за последнюю неделю №251 (20 — 26 февраля 2017)

Reading time4 min
Views17K
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.


Читать дальше →
Total votes 28: ↑25 and ↓3+22
Comments11

Elixir и Angular 2 безо всяких Hello, world!, или Реализуем работу с древовидным справочником, часть 1

Reading time64 min
Views11K

КПДВ


Функциональный язык программирования Elixir набирает популярность, а один из последних фреймворков для создания одностраничных приложений — Angular 2 — недавно вышел в релиз. Давайте познакомимся с ними в паре статей, создав с нуля полноценный back-end на Elixir и Phoenix Framework, снабжающий данными клиентское приложение-frontend на базе Angular 2.


Hello, world — не наш вариант, поэтому сделанное при необходимости можно будет применить в реальных проектах: весь представленный код выложен под лицензией MIT.


Объем статьи большой огромный! Надеюсь на столь же огромное количество комментариев — любых. Не раз замечал, что из комментариев получаешь не меньше, чем от основной статьи, а иногда и больше.


В первой статье будет несколько вступительных слов и работа над back-end. Поехали!

Читать дальше →
Total votes 23: ↑23 and ↓0+23
Comments10

61 способ улучшить SEO вашего сайта

Reading time8 min
Views115K


Недавно мы закончили курс по SEO в Нетологии и составили для себя чек-лист того, что обязательно нужно сделать на сайте «Я люблю ИП» для поисковой оптимизации. Но эти советы универсальны для любого проекта. В статье вы найдёте список практических рекомендаций со всего курса из 13 лекций от 8 разных специалистов, а также полезные ссылки и сервисы, которые помогут вам улучшить SEO вашего сайта.


Для кого эта статья:


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

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


Читать дальше →
Total votes 46: ↑36 and ↓10+26
Comments61

Angular — настройка среды разработки и production сборки с AOT-компиляцией и tree-shaking (Gulp, Rollup, SystemJS)

Reading time10 min
Views29K

Одна из особенностей Angular, присущая и первой и новой версии — высокий порог вхождения. Новый Angular, помимо всего прочего, трудно даже запустить. А и запустив, легко получить 1-2 Мб скриптов и порядка нескольких сотен запросов при загрузке hello world страницы. Можно, конечно, использовать всякие стартеры, seed'ы или Angular CLI, но для использования в серъезном проекте нужно самому во всем разбираться.


В этой статье я постараюсь описать, как настроить удобную среду разработки с использованием SystemJS, и production сборку Angular приложения на основе Rollup, с выходом около 100кб скриптов и нескольких запросов при открытии страницы. Использовать будем TypeScript и SCSS.


Попробовать все в деле можно в моем angular-gulp-starter проекте.


Читать дальше →
Total votes 23: ↑20 and ↓3+17
Comments32

Information

Rating
Does not participate
Location
Химки, Москва и Московская обл., Россия
Date of birth
Registered
Activity