Контейнерные CSS-запросы наконец-то здесь

С выходом Google Chrome (105) и Safari 16 появилась поддержка контейнерных запросов в CSS. Это даёт гораздо больше возможностей вёрстки. В этой статье вы узнаете, как работают контейнерные запросы, как мы можем их использовать и как выглядит синтаксис, а также увидите несколько реальных примеров и вариантов использования:

https://ishadeed.com/article/container-queries-are-finally-here/

#css #фронтенд

@hashdev

Coolors — сервис для генерации и просмотра цветовых комбинаций

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

У Coolors есть iOS- и Android-приложения, а также плагин для Figma и Chrome-расширение.

Стоимость: #бесплатно (но есть платный тариф)

#web #цвета

@hashdev

Mitosys Canvas — фоновая анимация в виде деления клеток, реализованная с помощью JavaScript.

#анимация #javascript

https://codepen.io/supah/pen/BqREob

​Document-This – VSCode расширение, которое автоматически генерирует детализированные JSDoc комментарии для TypeScript и JavaScript файлов

⤷ Ссылка на проект

@hashdev | #Interesting #JavaScript #TypeScript

CodeAbbey — огромная коллекция задач по программированию

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

Из интересного: девиз проекта звучит как «Мы верим, что три вещи ведут к успеху — практика, практика и практика!»

Стоимость: #бесплатно

#программирование #соревнование

@hashdev

Необычный datepicker на GSAP

Этот datepicker позволяет выбрать вам нужную дату, при этом обладая привлекательным внешним видом и нестандартной анимацией. Создан с помощью библиотеки GSAP, подробный код можно изучить здесь:

https://codepen.io/aaroniker/pen/MWQjxro

#codepen

@hashdev

Полезные советы при вёрстке сайта на HTML и CSS

В этом небольшом видео вы узнаете некоторые неочевидные, но важные нюансы, которые помогут улучшить вам качество ваше страницы, повысить скорость её загрузки и сделать разработку немного проще:

https://www.youtube.com/watch?v=41kjGvSPaEw

#видео #html #css

@hashdev

​Code Thesaurus — пожалуй, самая необычная шпаргалка по языкам программирования

С её помощью можно сравнивать структуры языков программирования. Сервис по сути позволяет легче перейти с одного языка программирования на другой.

А вместо многословных документаций, там реализована быстрая система быстрых ответов на конкретные вопросы: https://codethesaur.us/

#инструменты #шпаргалки

​github1s – полезный инструмент, который позволяет открывать любой github-репозиторий в браузерной версии VSCode

Это не плагин, а онлайн-ресурс который не связан с вашей локальной VSCode

⤷ Ссылка на проект

| #Interesting #Code #Useful

Speed lines

Можно задействовать как загрузку или переход между страницами сайта.

#js #css #html #coden

https://codepen.io/gvissing/pen/vYRoERY

@hashdev

Neumorphism.io — онлайн-инструмент для генерации CSS-кода в стиле неоморфизма

Работает сервис максимально просто: вы выбираете цвет элемента, его размеры, радиус, дистанцию тени и т.д

На выходе получаете готовый CSS-код, который можно вставить в ваш проект. И уже по необходимости самостоятельно «доработать»

Стоимость: #бесплатно

#css #web #open_source

Decryption Effect with Pseudo Elements

Эффект расшифровки с псевдоэлементами. Реализован с помощью CSS и JavaScript.

#анимация #css #js

https://codepen.io/georgehastings/pen/YNMEbe