Создайте приложение для отслеживания бюджета на React — изучение React & Context API с помощью интересного проекта
https://www.freecodecamp.org/news/react-budget-tracker-app/
https://www.freecodecamp.org/news/react-budget-tracker-app/
freeCodeCamp.org
Build a React Budget Tracker App – Learn React & Context API with this Fun Project
In this React Budget Tracker App tutorial we're going to: We’ll learn how break down a UI into React components Learn how to work with state using the Context API Learn about actions, reducers, and the dispatch function And I’ll give you some chal...
Практическая доступность, часть 1: семантика разметки и ARIA
https://www.filamentgroup.com/lab/practical-accessibility-1-semantics/
https://www.filamentgroup.com/lab/practical-accessibility-1-semantics/
Визуализация данных: легкое создание графиков на React
https://www.telerik.com/blogs/data-visualization-build-react-graphs-easy-way
https://www.telerik.com/blogs/data-visualization-build-react-graphs-easy-way
5 различных инструментов для мониторинга фронтенда
https://blog.bitsrc.io/5-different-tools-for-frontend-monitoring-79db94014d
https://blog.bitsrc.io/5-different-tools-for-frontend-monitoring-79db94014d
Medium
5 Different Tools for Frontend Monitoring
Avoiding runtime errors using frontend monitoring tools
Простые советы по написанию чистых компонентов React
https://isamatov.com/simple-tips-for-writing-clean-react-components/
https://isamatov.com/simple-tips-for-writing-clean-react-components/
Цветовые функции в CSS. Мечты сбываются: смешивание, прозрачность, контраст
https://www.youtube.com/watch?v=-6V7EvfUs3k
https://www.youtube.com/watch?v=-6V7EvfUs3k
YouTube
Цветовые функции в CSS 🎨 Мечты сбываются: смешивание, прозрачность, контраст
00:00 Интро
00:47 Смешивание цветов
01:48 Вариант на Sass
04:12 Функция color-mix
05:09 Кроссбраузерность
06:32 Относительные цвета
07:02 Прозрачность на Sass
09:35 Добавление прозрачности
11:18 Модификация цветов
13:14 История контраста
14:15 Вариант на…
00:47 Смешивание цветов
01:48 Вариант на Sass
04:12 Функция color-mix
05:09 Кроссбраузерность
06:32 Относительные цвета
07:02 Прозрачность на Sass
09:35 Добавление прозрачности
11:18 Модификация цветов
13:14 История контраста
14:15 Вариант на…
Интерактивные веб-компоненты проще, чем вы думаете
https://css-tricks.com/interactive-web-components-are-easier-than-you-think/
https://css-tricks.com/interactive-web-components-are-easier-than-you-think/
CSS-Tricks
Interactive Web Components Are Easier Than You Think | CSS-Tricks
In my last article, we saw that web components aren’t as scary as they seem. We looked at a super simple setup and made a zombie dating service profile,
JavaScript SEO: лучшие практики и инструменты отладки
https://www.searchenginejournal.com/javascript-seo-debugging-tools/398965/#close
https://www.searchenginejournal.com/javascript-seo-debugging-tools/398965/#close
Search Engine Journal
JavaScript SEO: Best Practices and Debugging Tools
JavaScript has its benefits when used correctly. Learn about JS SEO best practices and tools for JavaScript debugging here.
Основные тренды JavaScript, за которыми стоит следить в 2021 году
https://www.codica.com/blog/top-javascript-trends/
https://www.codica.com/blog/top-javascript-trends/
Переписываем Nuxt Hacker News с помощью Fastify, Vite и Vue 3
https://vuejsdevelopers.com/2021/03/23/nuxt-vite-fastify/
https://vuejsdevelopers.com/2021/03/23/nuxt-vite-fastify/
UnderJS Podcast #30 — Billing и бухгалтерия — инженерная сторона с Виталием Слободиным.
https://underjs.ru/podcast/2021/03/25/vitaly-slobodin.html
https://underjs.ru/podcast/2021/03/25/vitaly-slobodin.html
Друзья! 12 апреля стартует Podlodka Frontend Crew. Сам иду и зову вас с собой! Podlodka Frontend Crew — это абсолютно новая конференция для фронтенд-разработчиков от команды Podlodka!
Конференция будет идти в формате двухнедельного интенсива и будет посвящена оптимизации и стабильности разработки frontend’a.
🏃♂️На неделе “Оптимизация перфоманса” с разных сторон посмотрим на производительность: от оптимизации размера бандла и работы с инфраструктурой сети и до оптимизации сайта с точки зрения UX и разбора причин, почему бизнесу может быть важно заниматься производительностью.
🛠 А неделя “Стабильность и качество фронтенда” будет посвящена подходам и практикам, помогающим избегать и своевременно обнаруживать проблемы и ошибки. Обсудим контрактные, unit и end-to-end тесты, разберемся с мониторингами и алертингами и обсудим другие инженерные практики.
🗝 Ключевая особенность конференций Podlodka Crew: помимо докладов в программе множество нескучных форматов: рулетки кейсов, батлы, лайв-кодинги и не только. А что лично мне больше всего нравится - это возможность пообщаться со спикерами (и задать все вопросы, которые мучали тебя много лет) на зум-сессиях и нетворкинг в слаке!
Кроме того, вы получите доступ к записям всех сессий, чтобы потом в любой удобный момент можно было освежить знания!
Стартуем 12 апреля, примерное расписание первой недели уже на сайте, а до 5 апреля включительно билеты можно приобрести с очень приятной early-bird скидкой. Ждем на борту!
Конференция будет идти в формате двухнедельного интенсива и будет посвящена оптимизации и стабильности разработки frontend’a.
🏃♂️На неделе “Оптимизация перфоманса” с разных сторон посмотрим на производительность: от оптимизации размера бандла и работы с инфраструктурой сети и до оптимизации сайта с точки зрения UX и разбора причин, почему бизнесу может быть важно заниматься производительностью.
🛠 А неделя “Стабильность и качество фронтенда” будет посвящена подходам и практикам, помогающим избегать и своевременно обнаруживать проблемы и ошибки. Обсудим контрактные, unit и end-to-end тесты, разберемся с мониторингами и алертингами и обсудим другие инженерные практики.
🗝 Ключевая особенность конференций Podlodka Crew: помимо докладов в программе множество нескучных форматов: рулетки кейсов, батлы, лайв-кодинги и не только. А что лично мне больше всего нравится - это возможность пообщаться со спикерами (и задать все вопросы, которые мучали тебя много лет) на зум-сессиях и нетворкинг в слаке!
Кроме того, вы получите доступ к записям всех сессий, чтобы потом в любой удобный момент можно было освежить знания!
Стартуем 12 апреля, примерное расписание первой недели уже на сайте, а до 5 апреля включительно билеты можно приобрести с очень приятной early-bird скидкой. Ждем на борту!
podlodka.io
Онлайн-конференция Podlodka Frontend Crew, сезон #6
Недельное мероприятие от команды Podlodka: ежедневные интерактивные сессии в Zoom по актуальным проблемам frontend-разработки, нон-стоп общение с экспертами и звёздами индустрии, закрытое профессиональное сообщество в Telegram.
Эффект фрагментации изображения с помощью масок CSS и кастомных свойств
https://css-tricks.com/image-fragmentation-effect-with-css-masks-and-custom-properties/
https://css-tricks.com/image-fragmentation-effect-with-css-masks-and-custom-properties/
Headless: сценарии использования и для чего он нужен
https://www.smashingmagazine.com/2021/03/going-headless-use-cases/
https://www.smashingmagazine.com/2021/03/going-headless-use-cases/
Новые функции ES2021, которые вы могли пропустить
https://blog.logrocket.com/new-es2021-features-you-may-have-missed/
https://blog.logrocket.com/new-es2021-features-you-may-have-missed/
LogRocket Blog
New ES2021 features you may have missed - LogRocket Blog
Discover the five new ECMAScript (JavaScript)feature proposals that have an anticipated release date for mid-2021.
Как улучшить недостаточно проработанные элементы select
https://adrianroselli.com/2021/03/under-engineered-select-menus.html
https://adrianroselli.com/2021/03/under-engineered-select-menus.html
Adrian Roselli
Under-Engineered Select Menus
Others in this sorta-series: Under-Engineered Custom Radio Buttons and Checkboxen Under-Engineered Toggles Under-Engineered Toggles Too Under-Engineered Text Boxen I am still confounded how many developers and designers see a <select> and immediately reach…
CSS Container Queries, или Адаптация по-новому: контейнер вместо вьюпорта
https://www.youtube.com/watch?v=bP3ceQEXMhU
https://www.youtube.com/watch?v=bP3ceQEXMhU
YouTube
📦 CSS Container Queries, или Адаптация по-новому: контейнер вместо вьюпорта
00:00 Интро
01:05 Базовая раскладка
02:15 Адаптация от окна
04:12 Добавляем карточку
06:38 Проблема с карточкой
07:19 Раскладка карточки
08:13 Адаптация карточки
09:16 Адаптация от контейнера
10:22 Дополнительное условие
11:56 Выводы
12:32 Аутро
Нравится?…
01:05 Базовая раскладка
02:15 Адаптация от окна
04:12 Добавляем карточку
06:38 Проблема с карточкой
07:19 Раскладка карточки
08:13 Адаптация карточки
09:16 Адаптация от контейнера
10:22 Дополнительное условие
11:56 Выводы
12:32 Аутро
Нравится?…