29203
🚀 Статьи, новости, туториалы по frontend разработке. http://jem-space.ru Admin: @jem_jem Пишу в @five_a_m Хорошие серваки от DigitalOcean: https://m.do.co/c/1351d64475ee Реклама: http://bit.ly/2NxmVDu
React Router 6
Цикл видео по работе с 6 версией React Router.
https://www.youtube.com/watch?v=0auS9DNTmzE&list=PLiZoB8JBsdznY1XwBcBhHL9L7S_shPGVE
Анимация тултипов
Несколько видов анимаций появления и исчезания тултипов.
Демо | Github
https://tympanus.net/codrops/2023/11/08/dynamic-tooltip-reveal-animations/
NextJS Authentication
Курс по работе с NextAuth.
https://www.youtube.com/watch?v=MNm1XhDjX1s
Проверка валидности вложенных элементов
Если есть сомнения, можно ли вложить div в span например. Подробно расписывается почему можно/нельзя.
https://caninclude.glitch.me/
Анонс TypeScript 5.3 RC
Список новшеств новой версии с примерами.
https://devblogs.microsoft.com/typescript/announcing-typescript-5-3-rc/
CSS фичи, которые в скором времени упростят вашу разработку
▫️text-wrap
▫️scoped CSS
▫️автоувеличивающийся textarea
▫️вложенный CSS
и еще несколько фич.
https://www.amitmerchant.com/upcoming-css-features-to-make-your-life-easier/
Время учить Python.
⏰ Уже 8 ноября старт Подготовительного курса!
✔️ Упражняемся в браузерном тренажере — учимся понимать и писать код на Python.
✔️ Погружаемся в реальный продакшен — создаем конвертер валют вместе с наставником.
✔️ Размещаем изменения на GitHub — получаем основу для своего первого пет-проекта.
База по Python 8 ноября. На практике. За 990 рублей.Реклама. ООО "ХЕКСЛЕТ РУС". ИНН 7325174845. erid:LjN8KRZmi
React Forward Ref
Дмитрий Павлутин рассказывает как передавать рефы в дочерние компоненты.
https://dmitripavlutin.com/react-forwardref/
Ты просто 5-й час бездумно скроллишь ленту, и вдруг видишь ЭТОТ ЗНАК…
18 ноября в московском бизнес-центре SkyLight (офис VK), конференция от магазина приложений RuStore Mobile Conf.
Здесь топ-менеджеры и инди-разработчики встретятся, чтобы поговорить о главном: трендах в мире мобильной Android-разработки, методах монетизации и стратегиях дистрибуции приложений. Также на конференции можно будет познакомиться с представителями IT-индустрии, принять участие в увлекательных активностях и даже получить подарки. Почему бы и нет?
Выбирай формат участия — конференция RuStore Mobile Conf доступна как в офлайн, так и в онлайн-режиме. Зарегистрироваться можно здесь.
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/
Как CSS свойство content-visibility помогает улучшить скорость рендеринга
https://blog.logrocket.com/using-css-content-visibility-boost-rendering-performance/
Это — Дмитрий Безуглый, у него огромный опыт во фронтенд-разработке. Кто, если не он, научит вас делать серьёзный фронтенд?
Дима участвовал в принятии решений по разработке на все команды Вконтакте, с нуля запустил рекламный кабинет для новичков и выстроил множество процессов в команде как тимлид. А если вы используете Яндекс.Трекер, то знайте, его интерфейсы – тоже работа Димы.
Сейчас Дима — CTO Chrome Extension Frogly. Сервис помогает в изучении иностранных языков.
Диме нравится передавать свой опыт другим — у него был бесплатный курс, личные консультации. Теперь он собрал весь свой опыт воедино и вместе с друзьями сделал программу с огромным количеством практики и инсайтов индустрии.
Если вы junior+ фронтендер и хотите научиться работать над масштабными проектами, вам сюда!
Кстати, начать можно бесплатно. Обучение начинается уже 16 ноября, а сейчас как раз можно вписаться по самой приятной цене
[Узнать подробнее и записаться на курс]
Новые математические функции в CSS: rem() и mod()
https://danielcwilson.com/posts/mathematicss-rem-mod/
Прокачайте скиллы на реальной задаче и приблизьте оффер на онлайн-хакатоне Hack&Change by Changellenge >>! Интересно будет и новичкам, и тем, кто уже имеет опыт в разработке.
На хакатоне вас ждет:
— возможность попасть в шорт-лист кандидатов и получить оффер в IT-компанию;
— практика на настоящих кейсах и крутая строчка в резюме;
— треки на выбор с задачами от МТС Digital, СБЕРа, QIWI, а также дополнительные баллы к общему результату по тестированию от СИБУР Диджитал;
— погружение в IT-среду: тренинги, вебинары и новые полезные знакомства.
Готовы получить новый опыт и дать старт карьере? Тогда регистрируйтесь до 19 ноября: https://u.to/dEcXIAРеклама, ООО "Ченж", ИНН 9703058770, erid 2Vtzqx83VxK
17 распрoстраненных ошибок при работе с NodeJS
И способы их устранения.
https://blog.logrocket.com/17-common-node-js-errors/
Виды рендеринга в NextJS
Михаил Непомнящий рассказывает о видах рендеринга и как NextJS собирает и преобразует компоненты в статику или SSR.
https://www.youtube.com/watch?v=EH1WsQGSrWU
Эволюция SSR
Улучшаем показатели TTFB (Time to first byte) и TTI (time to interact) с SSR Streaming.
https://medium.com/cstech/800735e37bad
CSS prefers-reduced-transparency
Подстройка прозрачности под предпочтения пользователя.
https://developer.chrome.com/blog/css-prefers-reduced-transparency/
Анимируем слои с 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 и balancehttps://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