WebDev+ | Веб-разработка

Отличная демонстрация функции if() в CSS Функция if() в CSS позволяет использовать условную логику прямо внутри значений CSS-свойств. CSS постепенно превращается в полноценный язык программирования :) @WebDev_Plus

CSS совет Знаешь поле для одноразового пароля (OTP)? Его можно реализовать с помощью всего одного input и нескольких строк CSS. HTML: <input type="text" maxlength="6"> Код и демо: https://css-tip.com/single-digit-inputs/ Количество символов можно контролировать через атрибут maxlength @WebDev_Plus

Привет! Мы — инди-студия NEXT GENIUM, команда, которая живет играми и создает их с душой. Совсем недавно вышла наша дебютная демо-версия игры 14:Overmind и за 2 месяца мы набрали более 5 тысяч вишлистов в STEAM! Это потрясающий результат для нас🔥 В нашем Telegram-канале 14:Overmind мы делимся закулисьем разработки. Новые механики, локации, загадки, анимации — это и многое другое можно увидеть тут: https://t.me/OvermindGame Скачать демо 14:Overmind в Steam: https://store.steampowered.com/app/3610160/14_Overmind_Demo/

Лучший каталог пользовательского интерфейса для быстрого создания приборных панелей С полным набором диаграмм, данных, форм и шаблонов. ✓ Открытый исходный код ✓ +35 компонентов React ✓ Возможность настройки с помощью Tailwind CSS 4 → tremor․so @WebDev_Plus

Устал каждый раз копипастить --set-upstream при пуше новой ветки? Есть git-настройка, которая решает это:

git config --global push.autoSetupRemote true

@WebDev_Plus

Наконец-то кто-то сделал это нормально. Не нужно больше копаться в 100500 сайтов в поисках нормальных иконок, шрифтов или UI-компонентов. Здесь всё в одном месте. Просто, быстро, без тупой регистрации и "ограниченного доступа". Нет бестолковых каруселей, нет «Pro»-версий, нет душной рекламы. Просто ресурсы — бери и работай. 👉 https://freesets.dev/ @WebDev_Plus

Знал ли ты это про HTML? С помощью атрибута start в элементе ol можно начать нумерацию с любого нужного числа: @WebDev_Plus

«Как сделать так, чтобы пиксель-арт не был размытым в Chrome?» Попробуй image-rendering: pixelated @WebDev_Plus

Я открыл лендинг Dia и заметил, что он как-то подлагивает — оказалось, при первом заходе он грузит ~120 МБ данных, а потом каждые 4 секунды в цикле подтягивает ещё по 10 МБ, лол. Если честно, я бы не доверил кому-то разрабатывать веб-браузер, если они не справляются даже с обычной веб-страницей 🥺 @WebDev_Plus

ХОСТИНГИ для твоей БАЗЫ ДАННЫХ бесплатно Актуальные лучшие варианты на сегодня ↓ NEON TECH PostgreSQL, 500 MB, 190 часов вычислений → neon.tech MONGODB ATLAS MongoDB, 512 MB, автоматические бэкапы → mongodb.com TURSO SQLite, 5 GB, до миллиарда чтений → turso.com XATA PostgreSQL, 15 GB, неограниченный трафик → lite.xata.io SUPABASE PostgreSQL, 500 MB, 5 GB трафика → supabase.com COCKROACHDB 10 GB хранилища, 50 млн запросов → cockroachlabs.com KOYEB PostgreSQL, 1 GB, 5 часов выполнения → koyeb.com FREEDB TECH MySQL, 25 MB, максимум 200 подключений → freedb.tech @WebDev_Plus

Вау! Этот AI-инструмент позволяет составить роадмап для любой профессии, в которую ты хочешь войти! 🔥 Просто нажми «Create Roadmap» и введи свой запрос. Через пару секунд ты получишь интерактивный пошаговый роадмап :) @WebDev_Plus

Эта библиотека frontend-компонентов действительно впечатляет 🔥 В ней собраны тщательно проработанные UI-компоненты, идеально подходящие для создания современных, чистых и адаптивных интерфейсов @WebDev_Plus

Совет по HTML: Используй <input type="range">, чтобы создать нативный HTML-слайдер. @WebDev_Plus

🎁 РАЗЫГРЫВАЕМ MacBook Air! Разыгрываем шикарный 13-дюймовый MacBook Air! Отличная рабочая машинка! Условия участия максимально простые: 🔸Подписаться на телеграм-канал: @sqlhub 🔸Подписаться на телеграм-канал: @ai_machinelearning_big_data 🔸Нажать кнопку "Участвовать" ниже. ВСЁ! Вы участник! Бот выберет одного человека, которому мы подарим этот MacBook. Доставка по зоне СДЭК. Итоги подведём 14 августа. Всем удачи! Пусть победит самый приятный человек! ⚠️ Если бот подвис — не беспокойтесь, вас все равно зарегистрирует, просто выполните условия и нажмите «Участвую».

12 бесплатных сайтов с иллюстрациями для дизайнеров и разработчиков 🔹 blush.design 🔹 drawkit.io 🔹 iconscout.com 🔹 illustrations.co 🔹 icons8.com 🔹 humaaans.com 🔹 undraw.co 🔹 iradesign.io 🔹 storyset.com 🔹 openpeeps.com 🔹 svgrepo.com 🔹 pixeltrue.com @WebDev_Plus

Ищешь логотип в SVG? Этот сайт предлагает более 500 доступных логотипов! Оптимизированы и готовы для использования с React, Vue, Angular и SVG: → https://svgl.vercel.app @WebDev_Plus

Возможности веб-разработки безграничны, и этот сайт — отличное тому подтверждение Сайт Adidas Chile — впечатляющий пример того, что можно сделать с современными веб-технологиями. Надеюсь, это будет полезно https://adidaschile20.com/ @WebDev_Plus

Совет по CSS Знаешь ли ты, что можно использовать offset() для размещения изображений по кругу? А если совместить это с новыми функциями sibling-*(), можно добиться идеального позиционирования, которое работает с любым количеством элементов Можно также добавить красивую анимацию появления с помощью простого кода:

img {
  transition: 1s 1s; 
  @starting-style {
    offset: circle(0px) 0% 0deg;
  }
}

@WebDev_Plus

Знал, что можно просматривать HTML-файл прямо в VS Code, без открытия в браузере? 😲 Просто кликни правой кнопкой внутри HTML-файла и выбери «Show Preview» — получишь живой предпросмотр с поддержкой редактирования в реальном времени. @WebDev_Plus

Знал об этом? В любом репозитории на GitHub замени «github» на «deepwiki» в URL. Ты попадёшь на документацию, сгенерированную ИИ. Можно задавать вопросы как в чате. Настоящая находка, чтобы разбираться в коде без лишней траты времени @WebDev_Plus