FrontEndDev

Диалоговое окно с анимацией на показ и скрытие Простое демо с нативной поддержкой входных и выходных анимаций. https://frontendmasters.com/blog/the-dialog-element-with-entry-and-exit-animations/

Как оптимизировать ваше приложение еще до того как оно загрузилось? О сетевых взаимодействиях, которые происходят во время запросов — какие и как их можно ускорить. https://blog.sentry.io/how-to-make-your-web-page-faster-before-it-even-loads/

❗️Создайте свое приложение для прогноза погоды всего за 1 час ❓Хотите научиться создавать полезные приложения и работать со сторонними веб-сервисами? ⏰ Ждем вас на открытом вебинаре 4 сентября в 20:00 мск, где мы разберем: - как работать с API сторонних веб-сервисов на примере создания приложения для прогноза погоды; - основные принципы работы с API и их интеграции в проекты; - как расширить функционал приложения и использовать больше браузерных инструментов. 🔥 Урок идеально подходит для тех, кто знает основы JavaScript (циклы, условия, функции, базовая работа с DOM). Встречаемся в преддверии старта курса «JavaScript Developer. Basic». Все участники вебинара получат специальную цену на обучение! 👉Регистрируйтесь прямо сейчас, чтобы не пропустить мероприятие: https://vk.cc/cA5wlu Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru

Консольные команды для чайников Хотите быть адептом терминала, но не понимаете что делают те или иные команды? Держите сайт, который помогает разобраться с консолью, объясняя, что делает команда и значение каждого флага или опции в ней. https://explainshell.com/

Мониторим показатели Web Vitals с web-vitals.js Показатели CLS, INP и LCP теперь можно удобно отслеживать в консоли без необходимости запускать Lighthouse! https://www.debugbear.com/blog/core-web-vitals-js

Telegram Mini App. Как создать Web App с нуля Туториал по созданию веб-приложения для Telegram и работе с Telegram API. https://habr.com/ru/companies/amvera/articles/838180/

CSS Grid Areas Свежий взгляд на CSS grid template areas и как использовать их потенциал по максимуму. Интерактивное руководство. https://ishadeed.com/article/css-grid-area/

‼️Тест по React JS от OTUS — Ответьте на 30 вопросов и проверьте, насколько хорошо вы знаете язык. Сможете сдать — пройдёте на продвинутый онлайн-курс по React.js по спец. цене! 👉ПРОЙТИ ТЕСТ - https://vk.cc/czSWZI Курс доступен в рассрочку. ❇️ Пройдите тест и получите: ✔️ Живое общение с экспертами ✔️Получите видео-курс по Git в подарок ✔️ Лучшие открытые уроки прошлых наборов курса ✔️ Продвинутые темы и практика на «боевых» задачах уровня Middle+ ✔️ Скидку на прохождение онлайн курса «React.js Developer» Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru

Делаем таймер обратного отсчета на чистом CSS https://blog.logrocket.com/how-to-build-countdown-timer-using-css/

Кастомный слайдер с использованием API привязки позиционирования Пошаговый туториал по созданию слайдера на основе современных фич CSS: Anchor Positioning API и Scroll-Driven Animation. https://frontendmasters.com/blog/custom-range-slider-using-anchor-positioning-scroll-driven-animations/

10 консольных команд, необходимых для разработчика Grep, cat, tail и ещё несколько команд, которые повышают удобство и скорость разработки. https://www.trevorlasn.com/blog/10-essential-terminal-commands-every-developer-should-know

Настраиваем деплой приложений с Dokku Dokku - это мини-Heroku, который можно установить на свой сервер и удобно деплоить приложения командой git push. В статье — пошаговый туториал по установке, первоначальной настройке и конфигурации приложений для деплоя. https://jem-space.ru/dokku-deploy/

Больше никаких плохих контролов! Эти карточки появились благодаря яндексовской конференции «Я 💛 Фронтенд 2024». Ребята из Яндекса сделали их на основе доклада Ильи Бирмана, арт-директора Бюро Горбунова. Илья жёстко прошёлся по интерфейсам российских и международных сервисов и приложений, а главное, на примерах показал, как кнопки, слайдеры, выпадайки и прочие контролы делать нужно, а как ни в коем случае нельзя и где спрятаны различия. Полезные посты для фронтендеров вроде этого регулярно публикуют на канале [Yandex for Frontend]. Подписывайтесь, ребята готовят много интересного!

Пишем в буфер обмена с помощью JS Основы работы с Clipboard API и некоторые нюансы его использования. https://frontendmasters.com/blog/writing-to-the-clipboard-in-javascript/

Что нового в ECMAScript 2024 ▫️Улучшенная работа с unicode ▫️Atomics.waitAsync ▫️Расширяемые ArrayBuffer ▫️Promise.withResolvers Подробнее: https://pawelgrzybek.com/whats-new-in-ecmascript-2024/

Советы по CSS Профессиональные советы как с популярными так и с малоизвестными решениями по работе с CSS. https://github.com/AllThingsSmitty/css-protips/tree/master/translations/ru-RU

True Myth TS библиотека с type-safe обертками и утилитарными функциями для обработки ситуаций, когда у вас нет значений в переменной, и обработки успешных или ошибочных результатов выполнения. https://github.com/true-myth/true-myth

Набор инструментов для веб разработки Большая подборка инструментов для разработки, разбитая на категории: UI киты, библиотеки для анимации, расширения для Chrome, иконки и многое другое. https://surffers.notion.site/surffers/The-Best-Web-Development-Tools-2cf90734ead54d748edaf706120728d8

Уверены, что в коде вашего сайта нет уязвимостей? 💻 За последние три года в 63% случаев именно веб-приложения оказались исходным вектором атаки хакеров (данные Positive Technologies). Проверить свой веб-ресурс на наличие уязвимостей можно с помощью бесплатного анализатора PT BlackBox Scanner. Для этого вам нужно только ввести его домен на сайте сервиса. А после регистрации будут доступны все возможности сканера (тоже бесплатно) 🎯 По результатам более 110 видов проверок анализатор выдаст подробный отчет, в котором обнаруженные уязвимости будут распределены по уровню опасности, что позволит составить оптимальный план работы по их устранению и защитить сайт от хакерских атак. 🐈‍⬛ Проверить веб-ресурс с помощью PT BlackBox Scanner

Релиз Storybook 8.2 Что нового: хуки, портативные стори, онбординг. Подробнее по ссылке: https://storybook.js.org/blog/storybook-8-2/