Реакт-нейтив

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

Во-первых, сохранились главная (для меня) проблема — сложности с подключением нативных модулей. Нужно поставить пакет через npm, потом через react-native-cli пролинковать его, исправить какие-то gradle-файлы, pod-файлы. Это никогда не работает нормально сразу на двух платформах. Если завелось на iOS, значит будут проблемы на Android. Отвратительно.

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

В-третьих, приложение не получается одинаково хорошо работающим на iOS и на Android. Эти системы устроены по разному и там где на одном устройстве прдполагается свайп влево, на другом нужно нажать кнопку "Назад". Это дополнительно нагружает и дизайнеров и разработчиков. Из-за ограниченности ресурсов, часто одна из платформ становится доминирующей.

Но! В целом разработка на реакт-нейтве не вызывала у меня такой оторопи, как в 2017. Есть полноценные инструменты разработчика, даже дебаггер почти работает. Появились удобные абстракции над родной стилизацией. Поддерживается современная версия реакта.

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

#фронтенд

Последние два месяца я занимаюсь исключительно фротнендом. Когда планировал менять работу, немного преживал — я очень люблю писать на Node.js. Но, как оказалось, это позволяет сконцентрироваться, решать фронтовые задачи быстрее и качественнее.

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

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

#фронтенд #партнерский_материал

Сейчас занимаюсь разработкой UI-кита для набора разных веб-приложений. Большая часть интерфейсов этих приложений написана на React, но есть одно очень важное на Angular.

Делать клон библиотеки слишком дорого. Значит, нужно использовать React‑компоненты в Angular-приложении с минимальными затратами. Написал небольшую заметку на Хабр — Angulareact / Хабр.

#фронтенд

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

В JavaScript очень интересно устроен сборщик мусора. Посмотрите доклад об этом — garbage.collect().

#фронтенд #языки

Under JS

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

Недавно начал слушать UnderJS Podcast. И он совсем другой. В нем разбирают более глубокие темы, обсуждают разное и интересное. Недавно были выпуски про Haskell, про Dart, рассуждение на тему стейт-менеджеров. Если вам близок JS-мир, послушайте этот подкаст.

#языки #фронтенд

Микро-фронтенд

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

Сейчас вокруг многие обсуждают микросервисы на фронтенде. Значит немного странно, но, вероятно, нам это нужно.

Тематический доклад — Разрываем монолит.

#фронтенд #архитектура

Шрифты

Во фронтенд разработке есть две проблемы: подключение шрифтов и настройка CORS.

Вадим Макеева рассказал в докладе все о шрифтах в вебе: как их правильно подготовить (сжать, обрезать) и подключить. Смотрите его доклад со странным названием _ __ _____?.

С CORS все сложнее, пару месяцев назад осерчал и запилил мини-тред в твиттере.

#фронтенд

Svelte — это новый и очень модный фронтенед фреймворк. О нем начали говорить года полтора назад, я тогда взглянул на него и решил, что ничего интересного внутри нет.

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

#фронтенд

Кайф:
1. Реактивность из коробки — шок и трепет, почти работает (столкнулся с одним багом и пришлось сделать все немножко иначе);
2. Slots, Event Forwarding — мелочи, которых очень нехватает в Реакте;
3. Очень много вещей для которых в Реакте нужны сторонние библиотеки тут есть из коробки (скоупинг стилей, управление состоянием, транзишны).

Не кайф:
1. Это уже не JS, семантика многих конструкций совсем другая — магические значки доллара, экспорты как объявление пропсов;
2. Сомнительная интеграция с TS, я попробовал, сходу не завелось и забил;
3. Очень много магии, Реакт-приложение можно запустить прямо в браузере (только JSX придется выкинуть), тут же результирующий код совсем далек от того, что я написал.

Svelte — это интересная технология. Я, пожалуй, попробую его на более крупном проекте.

#фронтенд

Контракты — это ещё один способ увеличить надежность программы. Это и валидация, и парсинг, и проверка типов. Класс! Но мне всегда казалось, что в JS-мире это неудобно и костыльно.

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

#фронтенд

Современный бэкенд для фронтенда на Node.js

Вчера посмотрел доклад про BFF на летнем HolyJS и очень кайфанул — классный обзор бекендов для фронтендов, решаемых задачи и возникающих проблем. Очень хотел им поделиться, но (почему-то) был уверен, что в паблик его еще не выложили. А оказалось, что выложили.

#фронтенд #проектирование

PiterJS #46

Посмотрел уже довольно старый PiterJS и хочу посоветовать вам тоже.

Там три доклада:
1. про разработку UI компонентов — базовые принципы, которые помогают делать это быстро и получать поддерживаемый результат;
2. обзор способов повышения перформанса веб-приложений — освещены все варианты, начиная от веб-воркеров и заканчивая микро-оптимизациями;
3. прекрасный доклад про $mol — такие доклады всегда одинаково веселые, а в этом ещё и пара интересных решений относительно типизации CSS-in-JS библиотек.

https://youtu.be/FMNLN5YIE_M

#фронтенд

React Renderer

Я вообще часто ругаю React 🤷‍♂️ но сегодня не буду. Эта библиотека внутри очень красива, там прямо супер-элегатный код местами. И это выливается в такие же (местами) элегантные API. Например, простота, с которой можно написать собственный рендерер (вместо react-dom) поражает.

На днях посмотрел доклад про интеграцию React и Figma. Поразительно!

#фронтенд

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

В эти выходные я его дописал, а сегодня утром опубликовал.

https://habr.com/ru/post/541314/

#фронтенд #удобство_разработки

​​Build your own React

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

Я уверен, что если ты 90% времени на работе делаешь приложения на React, то обязан знать как он устроен. Пусть поверхностно, но важно знать почему происходит та или иная дичь.

Чтобы не читать исходники React, можно пройти маленький бесплатный онлайн-курс Build your own React. Автор за ручку проводит через основные концепции и термины, а в конце получается полностью функциональная личинка фреймворка.

#фронтенд

SvelteJS under the hood

Я уверен, что Svelte, или какой-нибудь его более удачный последователь, станет фронтенд-фреймворком номер 1 совсем скоро.

Вчера посмотрел крутейший доклад SvelteJS under the hood, в нём Павел доступно рассказывает о внутренностях фреймворка — рантайме и компиляторе. Еще раз убедился, насколько это восхитительная технология!

#фронтенд

Написал статью про метрики — что важно отслеживать, где это лучше делать. Настраивайте мониторинг, снижайте тревожность, радуйте пользователей 🚀

Солидные фронтенды: мониторинг

#фронтенд

Из доклада Зачем OCaml на фронтенде я не понял, зачем нужен OCaml на фронтенде 🤷‍♂️ но доклад очень интересный.

Мне кажется, это отдельная ветка развития инженера — расширение технического кругозора. Например, фронтендерам стоит почитать/послушать про rescript просто для общего развития, вдруг что.

#языки #фронтенд #фп

Ну, получилось чуть длиннее, чем я ожидал 😎

Новая статья в блоге — чем меня зацепил Эффектор и почему теперь мне грустно пользоваться другими стейт-менеджерами ☄️

Лучшая часть Эффектора

#фронтенд

Если пропустили в субботу стрим про создание логики фильтров на Эффекторе, посмотрите запись.

#фронтенд