FrontEndDev
28.9K subscribers
2.19K photos
22 videos
7.4K links
🚀 Статьи, новости, туториалы по frontend разработке.

http://jem-space.ru

Admin: @jem_jem
Пишу в @five_a_m

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

Реклама: http://bit.ly/2NxmVDu
РКН: https://clck.ru/3GLw7G
Download Telegram
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
Для чего нужна библиотека tRPC?

Объяснение на практическом примере.

https://www.freecodecamp.org/news/what-is-trpc/
Добавляем определения типов для CSS

Как свойство @property поможет вам избежать ошибок при использовании кастомных свойств.

https://moderncss.dev/providing-type-definitions-for-css-with-at-property/
Динамический Github профиль с Bun и Typescript

О том, как сделать свой профиль на GitHub динамическим используя Bun, TS и Github Actions.

https://tduyng.github.io/blog/dynamic-github-profile-with-bun-typescript/
This media is not supported in your browser
VIEW IN TELEGRAM
Выбираем рендер-стратегию для вашего приложения

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

https://vercel.com/blog/how-to-choose-the-best-rendering-strategy-for-your-app
Popover API 101

Нативный Popover с недавнего времени доступен в браузерах. Посмотрите как использовать его API и как можно его стилизовать и анимировать.

https://www.amitmerchant.com/popover-api-101/
Нужно развернуть приложения быстрее? С Облаком Рег.ру это возможно!

Мы предлагаем мгновенный запуск сервисов, линейку процессоров от мощных до очень мощных ( включая AMD EPYC и высокочастотные E2388), управление через панель или API. С нашими готовыми образами для Docker и GitLab вы сможете начать работу в несколько кликов.

Присоединяйтесь к нашему каналу, чтобы узнать, как облако Рег.ру помогает в разработке, и быть в курсе актуальных IT-новостей.

Реклама. ООО «Регистратор доменных имен РЕГ.РУ». ИНН 7733568767 erid: 2VtzquX6u22
Свойство CSS font-size-adjust теперь часть стандарта

Свойство может помочь предотвратить сдвиги контента при загрузке fallback шрифтов.

Подробнее — в небольшой заметке.

https://web.dev/blog/font-size-adjust?hl=en
Как использовать container query сейчас

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

https://web.dev/blog/how-to-use-container-queries-now?hl=en
React Conf 2024

Все доклады с прошедшей конференции по React. Enjoy!

https://conf.react.dev/talks
NodeJS добавил экспериментальную поддержку TS

С использованием флага --experimental-strip-types можно запустить TS код без транспиляции.

https://socket.dev/blog/node-js-adds-experimental-support-for-typescript
Разработчик ПО из Казани? Познакомься со специалистами ТехноХаба Сбера и прокачай свои скиллы! 👨‍💻👩‍💻

ИТ-академия ИТ-парка запустила курс для разработчиков «Cross-platform developer on JavaScript» совместно с Андреем Власовым — лидером компетенций, руководителем технологического Хаба Сбера в Казани с опытом в разработке 16 лет.

Для кого? 💻

— разработчики ПО с опытом работы frontend 1-2 года

По окончании курса ты получишь знания и навыки, соответствующие уровню Middle Javascript Developer, а именно:

Продуктовое мышление
UX/UI проектирования в figma
Разработка web-приложений на React
Разработка серверных приложений на Nodejs + Express + Mongo
Написание эффективных тестов для приложений
Глубокое понимание micro-frontend архитектуры на больших проектах

Запишись на собеседование прямо сейчас: записаться и получить бонусом офлайн-консультацию с наставником, защиту выпускной работы перед экспертами и удостоверение о повышении квалификации. 🔥

▪️Набор открыт до 15 августа
▪️Объем курса: 124 акад/ч (продолжительностью 5 месяцев)
▪️Формат: офлайн, в ИТ-парке им .Б. Рамеева

📲 Номер телефона для связи: +7 937 594 2209

Реклама: ТЕХНОПАРК В СФЕРЕ ВЫСОКИХ ТЕХНОЛОГИЙ "ИТ-ПАРК", ГАУ "ИТ-ПАРК", ИНН: 1655191213, ERID: 2VtzqwGw4hR
The Front-End Checklist

Чек-лист для вашего проекта, покрывающий все аспекты и практики разработки. Позволяет вам понять, не упустили ли вы чего-нибудь при разработке.

https://frontendchecklist.io/
Местоположение пользователя - это ложь

Почему нет 100% гарантии верного определения локации пользователя и какие есть способы ее определения. А также что стоит брать во внимание при решении задач, связанных с геолокацией.

https://austingil.com/user-location-is-a-lie/