FrontEndDev
29.4K subscribers
1.96K photos
15 videos
7.16K links
🚀 Статьи, новости, туториалы по frontend разработке.

http://jem-space.ru

Admin: @jem_jem
Пишу в @five_a_m

Хорошие серваки от DigitalOcean: https://m.do.co/c/1351d64475ee

Реклама: http://bit.ly/2NxmVDu
Download Telegram
Интерактивный курс по HTML

Курс для начинающих в формате глобального npm пакета (так что начинающим придется попотеть и поставить его через npm).

https://github.com/denysdovhan/learnyouhtml
Git. Скачем между ветками как древесные лягушки

О частых проблемах при разработке, когда не можешь переключить ветку, опасаясь потерять локальные изменения. Несколько способов, помогающих вам решить проблемы и писать код, не боясь потерять наработки.

https://habr.com/ru/articles/826260/
Cors - быстрое объяснение

6 минут чтобы понять, что такое CORS и как его побороть.

https://www.youtube.com/watch?v=PNtFSVU-YTI
Sravni Podcast — о разработке, технологиях, процессах и карьере в IT

В новом выпуске — беседа о настоящем и будущем фронтенд-разработки с Алексеем Чимочихиными, фронтенд-архитектором Сравни.

Поговорили об анархии во фронтенде, о том, в каких случаях фронтендеру нужно знать бэкенд, почему любить JS проще, чем TS, и о многом другом.

Думаю, будет интересно разработчикам самого разного уровня.

Можно смотреть на YouTube👀
Слушать на Яндекс Музыке👂
Что нас ждет в следующих релизах ESLint?

Последний релиз ESLint это только начало серьезных изменений. Что будет дальше - в короткой заметке по ссылке.

https://eslint.org/blog/2024/07/whats-coming-next-for-eslint/
Однострочники на CSS

Еще одна подборка небольших CSS стилей, которые сделают ваш проект чуточку лучше.

https://alvaromontoro.com/blog/68055/ten-css-one-liners-for-almost-every-project
Отменяем Promises в JS

Создаем отменяемые задачи в JS с помощью Promise.withResolvers и AbortController

https://webdeveloper.beehiiv.com/p/cancel-promises-javascript
15 советов по оптимизации страниц

Аспекты разработки (на которые часто не обращают внимание), которые помогут улучшить загрузку и работу вашего приложения.

https://www.speedcurve.com/blog/15-neglected-page-speed-optimizations/
Используем @starting-style и transition-behavior для анимации сцен

Практический пример с использованием новых экспериментальных функций для создания анимаций на чистом CSS.

https://nerdy.dev/using-starting-style-and-transition-behavior-for-enter-and-exit-stage-effects
Разрезаем изображение на кусочки (и соединяем при наведении)

Интересный и простой эффект без использования JS.

https://codepen.io/thebabydino/pen/VwOGJQx
В CSS появился условный оператор

Подробнее о синтаксисе и примеры использования читайте в статье.

https://css-tricks.com/if-css-gets-inline-conditionals/
Создаем npm пакет с поддержкой CommonJS и ESM

Пошаговое руководство по созданию и оформлению npm пакета на TypeScript

https://blog.mastykarz.nl/create-npm-package-commonjs-esm-typescript/
Стилизуем таблицы современным способом

https://piccalil.li/blog/styling-tables-the-modern-css-way/
This media is not supported in your browser
VIEW IN TELEGRAM
Анимация повторения текста при скроле

Очередной необычный эффект для вашего приложения.

Демо | Github

https://tympanus.net/codrops/2022/04/13/on-scroll-text-repetition-animation/
В CSS в скором времени появятся нативные mixin

Подробнее о том как это будет — в черновиках CSSWG

https://drafts.csswg.org/css-mixins/
TypeScript. Что такое branded types?

https://www.youtube.com/watch?app=desktop&v=OCJX7L0VN7M
24 CSS проекта, которые сделают из вас мастера CSS

Анимации загрузки, прогресс бары, переворачивающиеся карты — во многом стандартные эффекты, которые иногда не так просты как кажется. Раскроем все секреты реализации в 2х часовом курсе от freeCodeCamp.

https://www.youtube.com/watch?v=TzuWIHGFKCQ
Мидлы и сеньоры тут?

Если вы не понимаете, как и куда расти дальше, но очень хотите, пора познакомиться с IT_One! Это аккредитованная IT-компания, разрабатывающая ПО на заказ. IT_One организует и проводит митапы, хакатоны, участвует в профессиональных мероприятиях, объединяя специалистов по всей стране.

Все сотрудники IT_One имеют возможность работать удалённо и свободно развиваться за счёт компании. Для каждого действует программа ротации — всегда можно сменить направление деятельности на более интересное для себя.

👉🏻 Переходите в профиль IT_One — прямо сейчас у вас есть возможность забрать бесплатный гайд для мидлов, желающих скорее дорасти до сеньоров, а также для сеньоров, которые упёрлись в потолок и не знают, как развиваться дальше!

Реклама. ИП Пчелинцева В.В. ИНН: 701752778729, erid: 2Vtzqwrsoop
Почему page.goto() замедляет ваши тесты на Playwright?

Разбираемся с оптимизацией e2e тестов на Playwright.

https://www.checklyhq.com/blog/why-page-goto-is-slowing-down-your-playwright-test/
JavaScript console.log

Способы логирования в консоль — улучшаем читабельность логов.

https://www.youtube.com/watch?v=eSGcBJIfAAU