Ramda.js — библиотека, которая избавит вас от reduce и map-каши

Привет, Хабр! Если вас когда-либо раздражало, что Array.prototype.map нельзя использовать для объектов или reduce постоянно требует передавать начальное значение, Ramda.js решает эти проблемы, делая код чище, декларативнее и удобнее. Ramda — это библиотека для функционального программирования в JavaScript, которая по умолчанию не мутирует данные и поддерживает каррирование. В отличие от Lodash, где функциональность чаще заточена под удобство, Ramda больше ориентирована на чистоту кода и прогнозируемость работы функций.

https://habr.com/ru/companies/otus/articles/886512/

React и графики: 8 библиотек для визуализации данных

Хабр, привет! Меня зовут Юра, я работаю в МТС Диджитал тимлидом. Сегодня хочу поговорить о визуализации данных в React: какую библиотеку выбрать, чтобы было красиво и без проблем? Recharts, Visx, Nivo, ECharts или, может, что-то еще? Давайте разбираться! В посте оценим восемь разных библиотек: возможности, плюсы и минусы. Поехали!

https://habr.com/ru/companies/ru_mts/articles/885650/

Микрофронтенды: зачем дробить фронтенд и почему это может быть хорошо

Привет, Хабр! Меня зовут Александр Гончаров, и я — Head of Frontend в ГК Юзтех. В коммерческом IT я c 2011 года, регулярно выступаю как спикер на конференциях и митапах, а также с 2014 года веду подкасты, в том числе «Суровый веб» . Мы в Юзтехе занимаемся заказной и продуктовой разработкой с 2006 года, в моём отделе около 80 человек, а в команде текущего проекта — 50 разработчиков. Ещё любопытные факты с цифрами: у меня три высших образования (также сейчас учусь в аспирантуре), четыре кошки, более 300 записанных выпусков подкастов и больше 200 проведенных стримов. Эта статья — адаптация моего доклада, который я рассказал на TechleadConf 2024 . В ней я не буду углубляться в технические детали реализации микрофронтендов и архитектурных паттернов, а вместо этого разберу, как они могут помочь командам работать быстрее и без боли.

https://habr.com/ru/companies/oleg-bunin/articles/884562/

Что можно узнать из логов сервера: разбираем на 3 примерах

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

https://habr.com/ru/companies/runity/articles/884594/

Как ускорить загрузку сайта: гайд для разработчиков

Привет! Меня зовут Руслан, и я работаю React-разработчиком в компании SimbirSoft. На одном из моих проектов я столкнулся с проблемой низкой производительности сайта, которую нужно было решить быстро и с минимальными затратами ресурсов. В этой статье я хочу рассказать о том, почему важна производительность сайта и зачем её нужно улучшать, а также поделиться несколькими способами увеличения скорости загрузки веб-страниц.

https://habr.com/ru/companies/simbirsoft/articles/883090/

Интеграция Vue.js в Битрикс24: Как разработать сложный фронтенд за два месяца

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

https://habr.com/ru/companies/bitrix/articles/880530/

[Перевод] Почему именно в Chrome под Windows на сайтах не работают эмодзи флагов

Предположим, вы захотели приукрасить в UI своего сайта опцию выбора страны/языка симпатичными эмодзи флагов. Превосходно! Это создаст дополнительный визуальный ориентир, который поможет пользователям быстро находить нужную страну, да и в целом это просто красиво. Более того, вы даже можете легко реализовать динамическое определение иконок на основе кода региона: // Смещение для корректировки кода ASCII каждого символа в строке кода ISO страны для определения соответствующего флага.
const EMOJI_CHARACTER_OFFSET = 127397;

const getEmojiForCountryCode = (countryCode: string) =>
String.fromCodePoint(
...countryCode
.toUpperCase()
.split('')
.map((char) => char.charCodeAt(0) + EMOJI_CHARACTER_OFFSET),
);

// "en-US"
const currentLanguageCode = navigator.language;
// "US"
const currentCountryCode = currentLanguageCode.split("-")[1];
// ""
getEmojiForCountryCode(currentCountryCode);
// ""
getEmojiForCountryCode("FR");
// ""
getEmojiForCountryCode("SE"); Всё идёт шикарно! Как вдруг…

https://habr.com/ru/companies/ruvds/articles/879938/?utm_source=habrahabr&utm_medium=rss&utm_campaign=879938

[Перевод] Динамические формы с Flask

Одной из распространенных задач в веб-приложениях является создание формы, в которую можно вводить заранее неопределённое количество элементов. Этот подход часто используется при вводе пользовательской информации, например, телефонных номеров или адресов. В примере ниже можно увидеть, как пользователь динамически добавляет дополнительные телефонные номера в форму, нажимая на кнопку "Add another".

https://habr.com/ru/articles/880864/

[Перевод] Почему именно в Chrome под Windows на сайтах не работают эмодзи флагов

Предположим, вы захотели приукрасить в UI своего сайта опцию выбора страны/языка симпатичными эмодзи флагов. Превосходно! Это создаст дополнительный визуальный ориентир, который поможет пользователям быстро находить нужную страну, да и в целом это просто красиво. Более того, вы даже можете легко реализовать динамическое определение иконок на основе кода региона: // Смещение для корректировки кода ASCII каждого символа в строке кода ISO страны для определения соответствующего флага.
const EMOJI_CHARACTER_OFFSET = 127397;

const getEmojiForCountryCode = (countryCode: string) =>
String.fromCodePoint(
...countryCode
.toUpperCase()
.split('')
.map((char) => char.charCodeAt(0) + EMOJI_CHARACTER_OFFSET),
);

// "en-US"
const currentLanguageCode = navigator.language;
// "US"
const currentCountryCode = currentLanguageCode.split("-")[1];
// ""
getEmojiForCountryCode(currentCountryCode);
// ""
getEmojiForCountryCode("FR");
// ""
getEmojiForCountryCode("SE"); Всё идёт шикарно! Как вдруг…

https://habr.com/ru/companies/ruvds/articles/879938/

Ежегодный опрос PHP-сообщества: итоги 2024 года

2024 стал насыщенным годом для русскоязычного сообщества PHP-разработки. PHP Russia 2024, релизы PHP 8.4, Symfony 7.2 и Laravel 11. Как и в последние 4 года, мы провели масштабный опрос, чтобы узнать, чем живут разработчики, какие инструменты используют и куда движется индустрия. На этот раз своим мнением делились 1207 респондентов.

https://habr.com/ru/articles/880552/

Как использовать собственный опыт и успешные наработки для ускорения разработки

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

https://habr.com/ru/articles/879992/

Как из каши импортов сделать сортированный список Frontend

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

https://habr.com/ru/articles/878638/

Как из каши импортов сделать сортированный список Frontend

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

https://habr.com/ru/articles/878636/

Безопасность на уровне кода: руководство по защите веб-приложений для начинающих

Привет, Хабр! Я — Виталий Киреев, руковожу разработкой в хостинг-провайдере SpaceWeb. Сегодня поделюсь с вами базовыми практиками в области безопасности кода для веб-приложений и расскажу о пяти подходах, которые мы применяем в компании для повышения общей безопасности нашей экосистемы и продуктов. Эта статья будет интересна, прежде всего, для начинающих разработчиков и веб-мастеров.

https://habr.com/ru/companies/spaceweb/articles/878066/

[Перевод] Создаем мультитенантные Symfony-приложения с помощью Ecotone

Способ реализации мультитенантности (multitenancy, мультиарендности) зависит от сферы деятельности, в которой мы работаем. В некоторых случаях нам может хватать одной общей базы данных, а в некоторых нам могут потребоваться отдельные базы данных для полной изоляции. У нас может быть всего пара арендаторов (tenants, тенантов) или же наоборот сотни, нам может потребоваться замедлить или ускорить производительность для конкретного арендатора. Все это создает уникальную среду, в которой мультитенантность является не только техническим вопросом, но и вопросом бизнес‑логики. Данная статья представляет из себя практическое руководство, после изучения которого вы узнаете, как и зачем следует применять мультитенантность для различных сценариев в вашем проекте.

https://habr.com/ru/companies/otus/articles/877348/

Что такое MR-стенды и с чем их едят

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

https://habr.com/ru/companies/samolet/articles/870308/

[Перевод] Что случилось с легковесными десктопными приложениями? История Electron

Electron — это один из самых известных инструментов современного разработчика. Если присмотреться, то это родственник Reactive Native, манящий лозунгом «пиши один раз, запускай везде!», но с гораздо меньшими издержками по сборке и релизу, чем в случае мобильной разработки. Его уникальное преимущество заключается в комбинации Node.js и Chromium, создающей мощную десктопную среду для веб-технологий. Официальный блог Electron не так давно отметил своё десятилетие, что весьма удивляет с учётом того, насколько глубоко этот инструмент успел проникнуть в культуру разработки.

https://habr.com/ru/companies/ruvds/articles/873714/

Исследование: победители awwwards и их performance в Lighthouse

Все дизайнеры обожают сайт awwwards – площадку с платной публикацией, где собраны самые классные работы в сфере веб-дизайна. А поскольку мы душнилы по части performance, мы собрали почти 5000 сайтов, определили их фреймворк и проверили производительность в Lighthouse. Также собрали статистику по их авторам. И вот что получилось.

https://habr.com/ru/articles/874094/

Работает? Трогай! Рефакторинг

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

https://habr.com/ru/articles/873386/

Почему джуны путаются в асинхронном коде (и как научиться с ним работать)

Асинхронный код часто становится камнем преткновения для начинающих разработчиков. Почему функции выполняются не в том порядке, зачем нужны промисы, и что делает async/await? В статье я простыми словами объясняю: - Как работает Event Loop и почему это важно. - Какие ошибки чаще всего допускают джуны при работе с асинхронностью. - Как научиться писать понятный и предсказуемый асинхронный код. Если асинхронность вызывает больше вопросов, чем ответов, загляните в статью - там всё по шагам.

https://habr.com/ru/articles/871328/