FrontEndDev
28.2K subscribers
2.34K photos
23 videos
7.54K links
🚀 Статьи, новости, туториалы по frontend разработке.

http://jem-space.ru

Admin: @jem_jem
Пишу в @five_a_m

Читать на парковке: https://max.ru/front_end_dev

Реклама: http://bit.ly/2NxmVDu
РКН: https://clck.ru/3GLw7G
Download Telegram
DOM - введение для начинающих

Руководство по расположению и геометрии элементов внутри DOM.

https://www.smashingmagazine.com/2022/11/document-object-model-geometry-guide/
👍18😐1
Что нового в DevTools (Chrome 108)

https://developer.chrome.com/en/blog/new-in-devtools-108/
👍15
Полное руководство по Web Workers

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

https://www.sitepoint.com/developing-faster-javascript-apps-the-ultimate-guide-to-web-workers
🔥16👍6👌21
This media is not supported in your browser
VIEW IN TELEGRAM
Набор CSS анимаций на все случаи жизни

Выбираете анимацию, жмете like и download и копируете сгенерированный код

https://animista.net
👍27🔥11👌2
Рефакторинг на максималках

Сборник правил от Саши Беспоясова, который поможет облегчить рефакторинг кода.

https://refactor-like-a-superhero.vercel.app/ru
👍26❤‍🔥7
Используем npm query для менеджмента зависимостей

CLI инструмент для аудита установленных пакетов, в том числе поиска недостающих, и определения пакетов, зависимых от других.

https://blog.logrocket.com/npm-query-better-dependency-management/
👍10
Дебажим тесты с React Testing Library и методом debug()

https://blog.logrocket.com/using-react-testing-library-debug-method/
👍13
5 способов сделать ваш JS код более функциональным

https://www.sitepoint.com/make-javascript-functional/
👍13👎6
Объясняем работу flame charts из вкладки Perfomance на примере

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

https://calendar.perfplanet.com/2022/make-sense-of-flame-charts-in-performance-tab-by-example/
👍7🔥2
Что разработчики должны знать о режимах экономии памяти и энергии в Chrome

https://developer.chrome.com/blog/memory-and-energy-saver-mode/
👍11
Релиз Vite 4

Что нового и как мигрировать с Vite 3 в статье.

https://vitejs.dev/blog/announcing-vite4.html
15
Преобразуем макет в разметку

Советы для начинающих по верстке макетов: разбивка на блоки, порядок верстки и семантика.

https://www.htmhell.dev/adventcalendar/2022/1/
👍15
Доступные front-end паттерны для отображения таблиц

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

https://www.smashingmagazine.com/2022/12/accessible-front-end-patterns-responsive-tables-part1
🔥13👍2👏1
Используем псевдо-селектор :modal

О работе с псево-элементами и псевдо-селекторами и конкретно с селектором :modal

https://blog.logrocket.com/css-modal-pseudo-selector/
👍15
Интегрируем recaptcha в React приложение

https://blog.openreplay.com/implementing-recaptcha-in-react/
😁13👍6
Практическое руководство по CSS media queries

Синтаксис, использование media через CSS, HTML, JS, основные правила.

https://stackdiary.com/css-media-queries/
👍5🔥3
Как собрать, покрыть тестами и опубликовать TypeScript-пакет в npm в 2022 году

https://habr.com/ru/company/otus/blog/704398/
👍11🔥4🍌21
React: работа с 3D-графикой

Рендерим модели и объекты с React Three Fiber, React Three Drei и Three.js

https://habr.com/ru/company/timeweb/blog/704024/
👍15