29611
🚀 Статьи, новости, туториалы по frontend разработке. http://jem-space.ru Admin: @jem_jem Пишу в @five_a_m Хорошие серваки от DigitalOcean: https://m.do.co/c/1351d64475ee Реклама: http://bit.ly/2NxmVDu № 4850240725
В CSS появился условный оператор
Подробнее о синтаксисе и примеры использования читайте в статье.
https://css-tricks.com/if-css-gets-inline-conditionals/
Используем @starting-style и transition-behavior для анимации сцен
Практический пример с использованием новых экспериментальных функций для создания анимаций на чистом CSS.
https://nerdy.dev/using-starting-style-and-transition-behavior-for-enter-and-exit-stage-effects
Отменяем Promises в JS
Создаем отменяемые задачи в JS с помощью Promise.withResolvers и AbortController
https://webdeveloper.beehiiv.com/p/cancel-promises-javascript
Однострочники на CSS
Еще одна подборка небольших CSS стилей, которые сделают ваш проект чуточку лучше.
https://alvaromontoro.com/blog/68055/ten-css-one-liners-for-almost-every-project
Sravni Podcast — о разработке, технологиях, процессах и карьере в IT
В новом выпуске — беседа о настоящем и будущем фронтенд-разработки с Алексеем Чимочихиными, фронтенд-архитектором Сравни.
Поговорили об анархии во фронтенде, о том, в каких случаях фронтендеру нужно знать бэкенд, почему любить JS проще, чем TS, и о многом другом.
Думаю, будет интересно разработчикам самого разного уровня.
Можно смотреть на YouTube👀
Слушать на Яндекс Музыке👂
Git. Скачем между ветками как древесные лягушки
О частых проблемах при разработке, когда не можешь переключить ветку, опасаясь потерять локальные изменения. Несколько способов, помогающих вам решить проблемы и писать код, не боясь потерять наработки.
https://habr.com/ru/articles/826260/
Интерактивный курс по HTML
Курс для начинающих в формате глобального npm пакета (так что начинающим придется попотеть и поставить его через npm).
https://github.com/denysdovhan/learnyouhtml
Большой гайд по разработке с flexbox
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
Разбираем как решать задачи на LeetCode
✅ Примеры решений
✅ Пояснения
Выбери своё направление:
1. Python
2. JavaScript
3. Java
4. C#
5. Golang
6. С/C++
7. PHP
8. Kotlin
9. Swift
Scroll-driven анимации
Набор демо, а также различных вспомогательных инструментов для разработки эффектов завязанных на скролле.
https://scroll-driven-animations.style/
Новые методы JavaScript Set
О новых возможностях по работе с Set: создание новых множеств со специфичными свойствами, сравнение множеств и многое другое.
https://developer.mozilla.org/en-US/blog/javascript-set-methods/
Исследуем React Compiler
Подробное руководство по работе и использованию React Compiler в новых и существующих проектах.
https://blog.logrocket.com/exploring-react-compiler-detailed-introduction/
Простое руководство по Markdown
https://piccalil.li/blog/a-quick-and-easy-guide-to-markdown/
Девстанция - сайт для эффективной подготовки к собеседованиям
⚡️ Решение задач с запуском кода
⚡️ 800+ ответов на вопросы с собеседований
⚡️ 250+ решений для популярных задач
⚡️ Интерактивная тренировка по вопросам
⚡️ Викторины по вопросам со звёздочкой
⚡️ Треды для общения с сообществом
Совершенствуйся на Девстанции!
Заходите на https://dev-station.ru
Геймдев с Kaboom.js
Туториал по разработке игры на JavaScript с Kaboom.js в стиле Metroidvania. От настройки окружения и сборки до реализации сложной игровой механики.
https://www.youtube.com/watch?v=iM1iSvloMlo
Разрезаем изображение на кусочки (и соединяем при наведении)
Интересный и простой эффект без использования JS.
https://codepen.io/thebabydino/pen/VwOGJQx
15 советов по оптимизации страниц
Аспекты разработки (на которые часто не обращают внимание), которые помогут улучшить загрузку и работу вашего приложения.
https://www.speedcurve.com/blog/15-neglected-page-speed-optimizations/
В открытом курсе AvitoTech по JavaScript вышел третий урок.
Те, кто прослушал первые два, уже могут написать простой скрипт.
А в третьем уроке всё о данных в JavaScript, их организации и обработке: объявление переменных и инициализация, стек и куча, память, проблемные числа, области видимости.
Подписывайтесь на канал, чтобы не пропустить новые выпуски.
Что нас ждет в следующих релизах ESLint?
Последний релиз ESLint это только начало серьезных изменений. Что будет дальше - в короткой заметке по ссылке.
https://eslint.org/blog/2024/07/whats-coming-next-for-eslint/
Cors - быстрое объяснение
6 минут чтобы понять, что такое CORS и как его побороть.
https://www.youtube.com/watch?v=PNtFSVU-YTI
Занимаетесь разработкой? Вам подойдёт облако Рег.ру 😎
Мы предлагаем множество линеек с разными процессорами и дисками, включая AMD EPYC и высокочастотные E2388. Сервисы запускаются за считанные минуты, у нас честная модель оплаты pay-as-you-go, управление через панель или API и много готовых образов — Docker, GitLab. Всё как вы любите!
А на нашем канале вы узнаете как собрать пайплайн, масштабировать инфраструктуру, повысить отказоустойчивость, и многое другое. Подписывайтесь. 😉
Реклама. ООО «Регистратор доменных имен РЕГ.РУ». ИНН 7733568767 erid: 2VtzqukFLja
7 примеров использования Proxy в JS
Мало кто использует в своей работе Proxy, потому что мало кто знает, для чего их можно и удобно использовать. Вот несколько примеров, где задачу можно решить с помощью Proxy.
https://dev.to/mattlewandowski93/7-use-cases-for-javascript-proxies-3b29
Парсинг HTML в JS
Несколько способов парсинга HTML с помощью JavaScript, а также где и зачем это может быть полезно.
https://blog.apify.com/javascript-parse-html/
Вырезаем фигуры с clip-path
Руководство по использованию свойства clip-path для получения фигур со сложной геометрией.
https://verpex.com/blog/website-tips/how-to-create-cut-out-shapes-using-the-clip-path-property
Валидируем формы React / React Native приложений
Руководство по валидации данных с Yup и Formik.
https://www.freecodecamp.org/news/react-how-to-validate-user-input/
🔥Тесты для подготовки к собеседованию🔥
Выбери своё направление:
1. Frontend
2. Python
3. Java
4. Тестировщик QA
5. Data Science
6. DevOps
7. C#
8. С/C++
9. Golang
10. PHP
11. Kotlin
12. Swift
Список open-source проектов на NextJs + App Router
Алексей Рябов собрал 15 проектов на NextJS, которые уже находятся в продакшн (а значит их можно пощупать) и имеют открытые исходники.
https://dev.to/datarockets/real-world-open-source-projects-built-with-nextjs-14-and-app-router-i1n
Работа с операторами RxJs, которые вы знаете, но, возможно, недостаточно хорошо
Сравнение операторов, похожих по функционалу, и различные тонкости работы с ними.
https://dev.to/krivanek06/advanced-rxjs-operators-you-know-but-not-well-enough-1ela
Что aria-hidden="true" на самом деле делает с интерактивными элементами
Небольшая заметка о нюансах использования aria-hidden="true" и почему лучше не применять данный атрибут.
https://cerovac.com/a11y/2024/06/what-does-aria-hiddentrue-actually-do-to-interactive-elements/
cap - малоизвестная единица измерения в CSS
Ахмад Шадид рассказывает и показывает на интерактивных примерах, как и для чего можно использовать cap.
https://ishadeed.com/article/css-cap-unit/