Анимируем слои с clip-path
Демо | Github
https://tympanus.net/codrops/2023/10/31/image-layer-animations-with-clip-path/
Атрибуты async и defer у элементов script
Как правильно подключить скрипт, чтобы не навредить перфомансу.
https://learn.javascript.ru/script-async-defer
Community Day HolyJS 2023 Autumn 🔥
Осенняя HolyJS совсем скоро, и у вас еще есть возможность купить билет со скидкой по промокоду FRONTENDDEV
.
Но если вы не готовы купить билет на конференцию, то присоединяйтесь к бесплатному Community Day 3 ноября.
Этот день такой же насыщенный, как и другие дни конференции:
✔️ Доклады о графике и анимации, архитектуре, производительности и не только.
✔️ Воркшоп «Побеждаем в GameFi-хакатоне с призом в 30К $», обсуждение Bun 1.0 и квиз по JS-докладам разных лет;
✔️ Дискуссии со спикерами и участниками после докладов;
✔️ Чат с коллегами со всего мира.
➡️ Для участия достаточно зарегистрироваться.
Увидимся на HolyJS 2023 Autumn 💜
Реклама, ООО «Джуг Ру Груп», ИНН 7801341446, erid 2RanyoLjHfe
Chrome 117 поддерживает text-wrap: pretty
Короткая заметка о значениях pretty
и balance
https://developer.chrome.com/blog/css-text-wrap-pretty/
Нюансы преобразования строк в base64 в JS
О работе с функциями btoa() и atob() и возможными ошибками.
https://web.dev/articles/base64-encoding?hl=en
Веб-стандарты — выпуск 392
DevTools Chrome и Firefox, скролбары, скрытие IP, text-indent, Safari TP, Node.js, Eleventy 3.0
https://web-standards.ru/podcast/392/
Релиз NextJS 14
Turbopack, Server Actions, Partial Rendering.
https://nextjs.org/blog/next-14
Книги по Frontend на русском языке - канал, где ты можешь бесплатно КАЧАТЬ Frontend книги на русском языке
- качай книги
- читай
- становись программистом.
Все книги 2017-2020 годов. Все русскоязычные.
Самая удобная навигация по тегам: #js #css #node #react #angular #vue
Подписывайся и качай: @frontbooksru
React Server Components
Как и зачем использовать RSC.
https://www.freecodecamp.org/news/how-to-use-react-server-components/
Использование Web Workers для многопоточности в вебе
Статья о работе с web workers, их практическом применении и ограничениях.
https://www.smashingmagazine.com/2023/04/potential-web-workers-multithreading-web/
Разработка приложений для всех категорий пользователей
Основные принципы веб доступности. Как семантическая верстка, дополнительные атрибуты элементов и инструменты для тестирования доступности помогут вам в этом.
https://www.sitepoint.com/designing-for-all-the-basics-principles-of-web-accessibility/
Круговой текст на CSS
Решаем задачу при помощи svg и тригонометрии.
https://dev.to/jh3y/circular-text-with-css-57jf
Как на основе единой кодовой базы построить несколько веб-приложений в принципиально разных средах? Зачем соблюдать практики SDL и как оптимизировать производительность фронтенда?
Приходите обсудить эти и другие вопросы на онлайн-митап «Гетерогенность, или Деплой JavaScript туда и обратно» от Kaspersky. Вместе с командой JavaScript-разработки поговорим про:
● построение В2В единой консоли: комплексного, сложного приложения;
● единую модель деплоймента для cloud-native-разработки и on-premise;
● разработку в распределенных командах (фича-тимы).
Митап пройдет 26 октября в 17.00.
Регистрируйтесь, будет интересно 😎
JS minification benchmarks
Результаты сравнения популярных инструментов для сжатия JS.
https://github.com/privatenumber/minification-benchmarks
Опрос для опытных ИТ-специалистов.
Поделитесь мнением об ИТ-работодателях. Напишите, что вам нравится, а что — нет. Так компании смогут исправить ошибки, улучшить условия и присылать офферы, на которые хочется соглашаться.
Посмотрите, это займет не больше 10 минут
Front-end. Вопросы на собеседовании #53
HTML теги и атрибуты, prefers-reduced-motion, реализация отложенной загрузки изображений, объект Proxy и еще несколько тем.
https://www.youtube.com/watch?v=zcF-CVtXSBI
Гайд по микрофронтендам на single-spa
Как уже наконец-то уйти от монолита во фронтенде.
https://habr.com/ru/companies/samokat_tech/articles/766978/
Релиз Yarn 4.0
Обновленный ui и улучшенная в 3 раза производительность.
https://yarnpkg.com/blog/release/4.0
Развлекаемся с Gamepad API
О том, какие возможности предоставляет Gamepad API + реализация простой игры, управляемой с геймпада.
https://alvaromontoro.com/blog/68044/playing-with-the-gamepad-api
На данный момент в Авито открыто более 140 вакансий в направлении «Разработка» 🔎
Вас ждут:
• Талантливая команда и возможность реализовать свои идеи в проекте с многомиллионной аудиторией;
• Гибридный и удалённый форматы работы;
• ДМС со стоматологией с первого дня;
• Прозрачная система премий;
• Личный бюджет на обучение, который можно тратить на книги, курсы и конференции;
• Мощное железо, дополнительные мониторы и всё, что нужно для комфортной работы;
• Классный офис в Москве в двух минутах от метро «Белорусская» с местами для уединённой работы и зонами отдыха, а ещё офисы в Питере, Казани и Самаре.
Подробнее о вакансиях по ссылке. Откликайтесь и присоединяйтесь!
CSS будущего: State Container Queries
Как работать с State Container Queries и для чего это может быть удобно - в статье.
https://ishadeed.com/article/css-state-queries/
Использование React Portal
Что такое React Portal, как и когда его использовать.
https://semaphoreci.com/blog/react-portals
Photoshop Web CSS
Ахмад Шадид разбирает разметку и CSS решения сложного онлайн инструмента.
https://ishadeed.com/article/photoshop-web-css/
Чистая frontend архитектура
Почему важна архитектура при разработке приложения и какие принципы помогут правильно ее построить.
https://medium.com/bitsrc/clean-frontend-architecture-2995c68702fb
HTML, CSS, JS, Node.JS, 🤯 - пора бы всё объединить!
Все для изучения веба
👉 Логово фронтендера - самый большой канал для изучения фронта
👉 Логово верстальщика - все о верстке
👉 Логово Node.JS разраба - для тех кто хочет писать бэк на JS
Собрано всё, проверяй🔥
Подкаст про код - выпуск 24
Interop 2024, бета TypeScript 5.3, анти-паттерны конфигурирования в Node.js.
https://www.youtube.com/watch?v=HRcFHKEU3F4
Нативные способы валидации форм
Как отловить ошибки валидации при помощи атрибутов input либо встроенными методами форм.
https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation
44 вопроса c frontend собеседований
Вопросы по React, JavaScript, стейт менеджерам и современным аспектам web разработки
https://dev.to/m_midas/44-react-frontend-interview-questions-2o63
Добавляем web app манифест
Как с помощью одного конфига превратить ваше приложение в PWA.
https://web.dev/articles/add-manifest?hl=en
Техника загрузки изображений-плейсхолдеров в низком разрешении
Улучшаем метрики Web Vitals при помощи предзагрузки картинок в плохом качестве.
https://csswizardry.com/2023/09/the-ultimate-lqip-lcp-technique/