maxwell coding
208 subscribers
27 photos
1 video
89 links
Frontend разработка: новости, полезная информация, работа, практика, и многое многое другое.

Чат: @front_room
Download Telegram
🔧 Не забываем чистить код от forwardRef с 19 версии React
Please open Telegram to view this post
VIEW IN TELEGRAM
👀5🔥1
😲 Чекните React Bits - крутая коллекция анимированных, интерактивных и полностью настраиваемых компонентов React для создания красивых пользовательских интерфейсов.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3
👩‍💻 Оператор IF в CSS на простом примере.

Как мы привыкли делать
@media (max-width: 600px) {
body {
background-color: red
}
}


Через IF
body {
background-color: if(media(max-width: 600px): red);
}


❓ Кто-то уже пользуется в проектах?

😓 К сожалению эта фича пока не поддерживается во всех браузерах.

🔗 Тут можно почитать подробнее и глянуть иные примеры
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4
🌚 Новые CSS функции sibling-index() и sibling-count()

🛑sibling-index() - для получения индекса текущего элемента относительно всех его соседних элементов;
🛑sibling-count() - для получения общего количества соседних элементов.

😓 Работает пока только в Хром

Вот пример - динамически устанавливаем ширину border и opacity:
<div class="container">
<div></div>
<div></div>
<div></div>
...
</div>


.container div { 
border: calc(sibling-index()*2px) solid;
opacity: calc(sibling-index()/sibling-count());
}
.container div::before {
content: counter(i) "/" counter(N);
counter-reset: N sibling-count() i sibling-index()
}


🔗 Почитать побольше и посмотреть полный код можно тут:
https://css-tip.com/element-index/
Please open Telegram to view this post
VIEW IN TELEGRAM
2👍1
☕️ Скоро - новая должность
Please open Telegram to view this post
VIEW IN TELEGRAM
9111
🚀 Сейчас пилю новую фичу - динамические страницы.

🛑В админке (React + TS + React Admin) нужно сделать возможность создавать страницы — задавать название и контент, все уходит в Firebase;
🛑В мобильном приложении (React Native + TS + Expo) эти страницы будут подгружаться, парситься и отображаться.

🤟 В таком случае, если захотим изменить название и содержимое страницы, то мы это можем сделать из админки и не нужно будет из-за этого каждый раз вносить правки локально в приложение и релизить.

Буду разбираться, как лучше хранить контент (HTML/Markdown/структура) и как динамически рендерить страницы в приложении. Сложность тут в том, что админка это WEB, и подходы верстки и рендера в WEB и приложениях разные.

🔴 Хочу постримить процесс — что думаете?
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍9
📖 Реакт ужасен - книга по Реакт, которую сгенерировал ИИ

😲 На удивление точная (и забавная!) книга о React, созданная с помощью искусственного интеллекта Claude. Я одновременно оскорблён и впечатлён. Тон книги немного токсичный, так что воспринимайте её осторожно.

📕 React is Awful
Please open Telegram to view this post
VIEW IN TELEGRAM
😍11
This media is not supported in your browser
VIEW IN TELEGRAM
🎹 Вдруг если вам не хватает внимательности во время кодинга.
Please open Telegram to view this post
VIEW IN TELEGRAM
😁42
🤬 У Cloudflare случился сбой в работе из-за бага в useEffect.

🤬 Я однажды находил баг в проде из-за подобной проблемы.

P.S. бесят эти массивы зависимостей. С ними надо быть аккуратнее.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥2
💡 На Linkedin в поиске введите We're hiring frontend и увидите посты, где ищут Frontend разработчиков.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥 URLPattern стал доступен во всех браузерах

❓Зачем он нужен?

URLPattern позволяет удобно разбирать и матчить URL без регулярных выражений и ручного парсинга.

Раньше
const url = new URL(location.href);
const pathRegex = /^\/users\/([a-zA-Z0-9]+)\/?$/;
const isMatch = pathRegex.test(url.pathname);


Сейчас
const pattern = new URLPattern({ pathname: "/users/:id" });
const isMatch = pattern.test(location.href);
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6👍4🎉1
🥇 TypeScript - самый популярный инструмент для программирования на GitHub в 2️⃣0️⃣2️⃣5️⃣ году. Он сместил с первого места Python. На третьем месте JavaScript.

😨 Если говорить про рост числа разработчиков на GitHub, то только за 2025 год из Индии их прибавилось 5.2 миллион.

🔗 Ознакомиться с полной статистикой можно тут.
Please open Telegram to view this post
VIEW IN TELEGRAM
🎉3