«Под поверхностью машины движется программа. Без усилий, она расширяется и сжимается. Находясь в великой гармонии, электроны рассеиваются и собираются. Формы на мониторе — лишь рябь на воде. Суть остаётся скрытой внутри…» Мастер Юан-Ма, Книга программирования.

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

https://habr.com/ru/post/702972/?utm_source=habrahabr&utm_medium=rss&utm_campaign=702972

Привет, Хабр! Меня зовут Влад, я frontend-разработчик в SimbirSoft. Я часто задумывался, почему на проектах, где используется Node.js (в частности Nuxt.js и Next.js — фреймворки на базе Vue и React), мы каждый раз, словно по шаблону дополнительно используем еще одну прослойку бэка — PHP, Java, C# или другой язык программирования, к примеру, «неродной» JavaScript. И тогда я с головой погрузился в анализ ситуации по работе с популярными системами управления базами данных (СУБД), файлами, изображениями и другими естественными потребностями современного проекта.

https://habr.com/ru/post/702230/?utm_source=habrahabr&utm_medium=rss&utm_campaign=702230

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

https://habr.com/ru/post/701778/?utm_source=habrahabr&utm_medium=rss&utm_campaign=701778

Всем привет! Меня зовут Дима, я frontend-разработчик в Альфа-Банке. Сегодня я расскажу про Shared UI, что это такое и как мы пришли к созданию такого сервиса в интернет-банке, что это такое, как мы вообще придумали такой сервис.

https://habr.com/ru/post/701720/?utm_source=habrahabr&utm_medium=rss&utm_campaign=701720

17 ноября вышла стабильная версия Nuxt 3.0 (теперь без JS) - популярного фреймворка для построения фронтенд-приложений на Vue 3.

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

https://habr.com/ru/post/700468/?utm_source=habrahabr&utm_medium=rss&utm_campaign=700468

В современных приложениях и сервисах часто нужна интернационализация (i18n, от англ. internationalization). Она позволяет создавать интерфейсы с учётом культурных и языковых особенностей пользователей из разных стран. Это требует не только простого перевода, но и некоторых технических решений, порой довольно сложных.

Меня зовут Володин Сергей, я работал руководителем команды разработки VK WorkMail. Сегодня расскажу о том, как инфраструктура переводов позволяет поддерживать 10 языков в нашем продукте и какие технические нюансы стоит учитывать при работе с разными языками. Интернационализация интерфейсов — довольно комплексная и непростая история, хотя на первый взгляд может показаться не слишком приоритетной задачей. Более того, о ней нужно начинать думать в самом начале разработки, чтобы впоследствии не наломать дров.

https://habr.com/ru/post/699852/?utm_source=habrahabr&utm_medium=rss&utm_campaign=699852

Привет, Хабр! Я Лена Райан, фронтенд разработчик в Х5 Tech. Решила поделиться с вами подборкой ТОП-10 проверенных зачётных онлайн-ресурсов по фронтенду, которые будут полезны как новичкам, так и желающим подтянуть свои знания по этой теме. Подборка подойдёт также тем, кто только недавно пришёл в IT или в профессию фронтендера и хочет понять, с какой базы им начать.

https://habr.com/ru/post/700274/?utm_source=habrahabr&utm_medium=rss&utm_campaign=700274

Команда Vercel порадовала нас большим релизом популярного фреймворка Next.js, давайте вместе разберёмся, что там изменилось и появилось нового

https://habr.com/ru/post/698966/?utm_source=habrahabr&utm_medium=rss&utm_campaign=698966

Redux и MobX больше не нужны ?

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

https://habr.com/ru/post/698880/?utm_source=habrahabr&utm_medium=rss&utm_campaign=698880

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

Однако в последней версии библиотеки (0.10.0) была добавлена поддержка технологии WebAssembly. Теперь стало возможным объединить серверную и клиентскую часть в единый модуль исполняемый в браузере. При этом требуются минимальные изменения в уже существующем проекте использующем библиотеку RUI

В этой статье я покажу как переделать уже существующий проект чтобы его можно было скомпилировать в wasm модуль и запустить его в браузере

https://habr.com/ru/post/698818/?utm_source=habrahabr&utm_medium=rss&utm_campaign=698818

Привет! Меня зовут Алексей, я frontend-специалист SimbirSoft. В этой статье разберем новый метод слежения за реактивными свойствами watchEffect.

С появлением Vue 3 c Composition API стало доступно два метода слежения — watch и watchEffect. Если «старый» метод watch всем хорошо знаком и не должен вызывать затруднений у Vue-разработчиков, то новый метод стоит изучить подробнее. Материал будет полезен разработчикам, переходящим с Vue 2 на Vue 3 и всем «вьюшникам», которые еще не разобрались с этим методом.

Composition API предоставляет нам два разных метода слежения за реактивными свойствами — watch и watchEffect. Они похожи, но все же каждый полезен в определенных случаях. Рассмотрим, какие сходства и различия существуют у этих методов:

https://habr.com/ru/post/697910/?utm_source=habrahabr&utm_medium=rss&utm_campaign=697910

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

Мы используем preact/compat — с его помощью получаем доступ к множеству библиотек экосистемы React, что делает разработку более гибкой, и при этом можем использовать Preact. Но эти же плюсы зачастую оборачиваются в обратную сторону: например, нет единой методологии по проектированию приложений, как, например, в Angular. Кроме того, многообразие библиотек усложняет погружение в проект, а свобода в реализации и проектировании может обернуться захламлением кодовой базы, что пугает разработчиков, особенно новичков.

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

Для нашей команды эти проблемы также актуальны. Чтобы их решить раз и навсегда, мы обратились к активно развивающейся методологии Feature-Sliced Design (FSD). Ниже я познакомлю с ее главными принципами и с нашим опытом ее использования. Забыл представиться — я Женя, фронтенд-разработчик в команде Quick Experiments inDrive. Расскажу, как мы занимается разработкой внутренних стартапов на основе бизнес-гипотез с помощью FSD.

https://habr.com/ru/post/693768/?utm_source=habrahabr&utm_medium=rss&utm_campaign=693768