WebDEV
8.96K subscribers
2.21K photos
11 videos
2.73K links
Сообщество веб-разработчиков.

На канале можно найти: видео-уроки, полезные статьи, новости из мира IT и веб-разработки.

Ссылка: @Portal_v_IT

Сотрудничество: @oleginc, @tatiana_inc

Канал на бирже: telega.in/c/webb_dev

РКН: clck.ru/3L2oTf
Download Telegram
Выберите правильный вариант 👇🏼 #test #js
Подробное объяснение теста в чате @webb_chat
♥️ Наши телеграм боты

UI8 Bot — бот предоставляет безлимитный доступ к сайту ui8.net Стоимость доступа на сайте стартует от 188$ с ограничениями на загрузки. Стоимость в нашем боте начинается от 4$ в месяц без каких-либо ограничений.

Craftwork Bot — предоставляет полный доступ к сайту craftwork.design намного дешевле.

Боты работают очень просто: присылаете ссылку в бота, а бот в ответ присылает файл для скачивания. Попробуйте сами!
📑 До свидания, Google Fonts. Последний аргумент

Шрифты Google Fonts страшно популярны. Их загружают более 42,8 миллиона сайтов, в том числе Хабр. Библиотека Google Fonts содержит 1023 свободных шрифта и программные интерфейсы для их внедрения через CSS. Очень удобно, казалось бы.

Во многих статьях отмечалось, в какую цену обходятся многочисленные запросы через API. Совет самостоятельно хостить шрифты дают много лет. Даже сама Google давала такой совет на конференции Google I/O 2018 года в выступлении на тему веб-производительности.

Так почему же многие до сих пор загружают шрифты через Google Fonts API? Ну, был последний аргумент — кэширование. Мол, благодаря общему CDN пользователю не нужно скачивать шрифт заново с каждого сайта. Однако в октябре 2020 года этот аргумент перестал работать...

#статьи
🛠 Screenshot to Code — отличный инструмент, который превращает макеты дизайна в статические веб-сайты. Он основан на нейронной сети, которая анализирует изображения дизайна, разбивает их на компоненты HTML и отображает макет дизайна на основе Bootstrap.

#инструменты
💡 Современные и эффективные CSS-раскладки

▍Часть 18

Перед прочтением рекомендуем ознакомиться с первой, второй, третьей, четвёртой, пятой, шестой, седьмой, восьмой, девятой, десятой, одиннадцатой, двенадцатой, тринадцатой, четырнадцатой, пятнадцатой, шестнадцатой и семнадцатой частями.

▍Сохранение пропорций: aspect-ratio: <width> / <height>

Чтобы поддерживать соотношение сторон 16 x 9 без этого свойства, следует использовать хак с padding-top, задав padding 56.25%. Но сСкоро у нас появится свойство, позволяющее не прибегать к этому хаку и вычислению процентов. Можно сделать квадрат с соотношением сторон 1 / 1 или прямоугольник с соотношением 2 / 1, или любым другим, необходимым для изображения определённых размеров.

.square {
aspect-ratio: 1 / 1;
}

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

#советы #coding #css
🔥 Лучшее на канале за неделю

1
. До свидания, Google Fonts. Последний аргумент.

2. Jimp — это библиотека обработки изображений для Node.

3. Современные и эффективные CSS-раскладки.
♥️ Наши каналы для программистов

На канале Daily Coding мы каждый день публикуем интересные задачи с собеседований, обучающие статьи, бесплатные книги, советы разработчикам и многое другое.

На канале Говнокод ежедневно выходят забавные подборки плохого кода и мемы для программистов.

Подписывайтесь! Неважно на каком языке вы пишете, вы обязательно найдете что-то новое и интересное.
📑 Токен авторизации на примере JSON WEB Token

В данной статье рассказываем об одном из самых популярных (на сегодняшний день) способов авторизации в различных клиент-серверных приложениях - токен авторизации. А рассматривать мы его будем на примере самой популярной реализации - JSON Web Token или JWT.

#статьи
Выберите правильный вариант 👇🏼 #test #js
Подробное объяснение теста в чате @webb_chat
🛠 Cutestrap Two — отличный UI-фреймворк с прекрасным дизайном, множеством вариантов настройки и простым в использовании API. Он поставляется с современной сеткой для создания макетов, компонентами для ввода форм и кнопок, типографикой и хорошим набором удобных утилит.

#инструменты
💡 Современные и эффективные CSS-раскладки

▍Часть 18

Перед прочтением рекомендуем ознакомиться с первой, второй, третьей, четвёртой, пятой, шестой, седьмой, восьмой, девятой, десятой, одиннадцатой, двенадцатой, тринадцатой и четырнадцатой, пятнадцатой, шестнадцатой и семнадцатой частями.

▍Сохранение пропорций: aspect-ratio: <width> / <height>

Чтобы поддерживать соотношение сторон 16 x 9 без этого свойства, следует использовать хак с padding-top, задав padding 56.25%. Но сСкоро у нас появится свойство, позволяющее не прибегать к этому хаку и вычислению процентов. Можно сделать квадрат с соотношением сторон 1 / 1 или прямоугольник с соотношением 2 / 1, или любым другим, необходимым для изображения определённых размеров.

.square {
aspect-ratio: 1 / 1;
}

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

#советы #coding #css
Выберите правильный вариант 👇🏼 #test #js
Подробное объяснение теста в чате @webb_chat