Новое CSS-свойство, облегчающее работу с transition

Анимация с помощью Transition является наиболее простым способом оживить сайт. Но в некоторых случаях это может вызвать трудности. Например, при задействии блоков с установленными размерами в значении auto или при отображении элемента, имевшего значение свойства display: none.

В CSS появилась новая фича calc-size(), которая позволяет справиться с этим. И в этом туториале вы узнаете не только, как воспользоваться ею для настройки переходов, но также свойством interpolate-size, правилом @starting-rule и свойством transition-behavior.

А вы уже пробовали спользоваться этими способами?

#css #фронтенд

Большой гайд по миграциям в Django

Макс — автор YouTube-канала PyLounge, о котором вы, возможно, слышали и чьи видео мы иногда выкладываем здесь или в нашем канале по питону. Он уже давно работает с Python в качестве бэкенд-разработчика и накопил достаточно опыта и знаний, связанных не только с разработкой, но и миграцией.

На этот раз он решил рассказать обо всех нюансах и подводных камнях, которые возникают при миграции в Django. В первой части он рассказал о том, что такое миграции, зачем они, как к ним подготовиться, а также избежать конфликтов и других неприятностей. Во второй части речь пойдёт о фиктивном применении, data-миграции, «сухой проверке» и основных проблемах, возникающих у новичков.

Эти материалы пригодятся как начинающих, так и опытным разработчикам, поэтому скорее читайте, либо сохраните себе в избранном, чтобы прочитать потом.

#django #бэкенд

Встречайте Limbo — новая компактная и портативная СУБД

По сути, это SQLite, полностью переписанная на Rust. Разрабатывает его команда Turso, которая ранее сделала форк SQLite — libSQL, имеющий 12 тысяч звёзд на GitHub и 85 контрибьюторов.

Limbo направлена на то, чтобы со временем стать полностью совместимой с SQLite, при этом имея нативную поддержку асинхронности.

Сейчас можно посмотреть, как работает версия 0.0.9, протестировать СУБД в связке с JS или Python и, возможно, помочь разработчикам в качестве контрибьютора, если вам такое интересно. Почитать подробнее можно в блоге Turso, а изучить кодовую базу и потестить на GitHub.

#субд #sqlite #limbo #rust

OffscreenCanvas в JavaScript: разгоняем графику до максимума

OffscreenCanvas — это API, которое позволяет рендерить графику в отдельном потоке Worker, не блокируя основной поток, где обрабатывается интерфейс. Технически это достигается за счёт разделения UI и вычислений.

В этой статье вы узнаете зачем он нужен и как правильно его использовать. Уже пробовали?

#javascript #canvas #фронтенд

BigDevSoon — полезный тренажёр для фронтендеров с большой коллекцией челленджей и проектов

На платформе собрано 100 челленеджей на каждый день. Каждый отличается по сложности и по тому, какие скиллы помогает прокачать. А ещё здесь готовые идеи проектов. Каждый проект разбит на отдельные карточки, которые позволяют разделить проект на отдельные части для последовательной разработки.

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

#тренажёры

Совет для React-разработчиков: старайтесь избегать множества вложений провайдеров в React

Это усложняет дальнейшую разработку и ухудшает читаемость. Вместо этого вы можете объединить их с помощью композиции, как показано на видео выше.

#react #советы

Техно-город из нашего виммельбуха продолжает готовиться к Новому Году!

На городской ёлке зажглись яркие огни, а улицы осветились блеском гирлянд и фонарей. Пока одни бегают в поисках подарков любимым, другие усердно доделывают важные задачи до конца года. В общем, что говорить, скорее открывайте третью главу и увидьте всё своими глазами: https://tprg.ru/nVBh

Игры для дизайнера: как прокачать перо (кривые Безье), как кернить буквы и другие полезности

Нечасто у нас выходят материалы для дизайнеров, но мимо этого нельзя было пройти мимо. Если вы веб-дизайнер или работаете с дизайном, то эта подборка вам будет очень кстати, серьёзно.

Здесь собраны полезные штуки, которые помогут вам прокачать ваши навыки. Например, рисование кривых, настройка кернинга, размера блоков, расположение текста и так далее. Всё бесплатное и интерактивное.

Смотрите видео и выбирайте понравившиеся сервисы. Для вашего удобства мы ещё и тайм-коды по сервисам оставим:

00:00 - bezier.method.ac
07:43 - type.method.ac
10:30 - shape.method.ac
11:28 - betterwebtype.com/triangle
14:53 - boolean.method.ac
16:32 - pixact.ly
17:08 - game.ioxapp.com/eye-test
18:35 - kolor.moro.es
19:14 - color.method.ac
20:55 - cantunsee.space
28:36 - userinyerface.com

#дизайн #видео

Запросы на сервер. Fetch, XMLHttpRequest (XHR), Ajax

Умение работать с запросами — один из главных навыков разработчика, потому что запросы отправляются и принимаются постоянно различными частями приложений. Здесь вы в простой форме сможете разобраться в том, как работают запросы, какие варианты существуют и как их применять.

#javascript #видео

Придумайте подпись в комментариях

Современные способы управления контентом

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

В этой статье разбираются:

— современные методы создания аккордеонов и подсказок;
— как использовать элементы <details> и <dialog> для улучшения UX;
— почему минимализм в веб-разработке сегодня так важен.

Подробности: https://css-tricks.com/the-different-and-modern-ways-to-toggle-content/

#фронтенд #css