Логово верстальщика – Telegram
Логово верстальщика
8.05K subscribers
996 photos
48 videos
4 files
1.71K links
Канал для верстальщиков с инфой о HTML и CSS, а так же JavaScript на уровне верстальщиков.

Канал на бирже - https://telega.in/c/webdevlair

По вопросам рекламы или разработки: @g_abashkin
Download Telegram
Почему стоит задуматься о разработке статических сайтов

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

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Обзор 10 приемов JavaScript для эффективного программирования

Пополни знания JavaScript 10 эффективными приемами и начни использовать его возможности по максимуму.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Fancy wipe

Стильный текст с анимированным появлением. Сделан на чистом CSS.

Открыть код...
Please open Telegram to view this post
VIEW IN TELEGRAM
🖥 В чем разница между UI и UX. Детальное сравнение

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

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👾 10 игр для изучения JavaScript

В этой статье вы найдете десятку интересных игр для изучения JavaScript. Попробуйте их, ведь учиться, играя, куда легче!

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 5 маленьких, но полезных библиотек React

Несколько библиотек React, которые мы рассмотрели в этой статье, довольно полезные и при том маленькие и простые в использовании.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Refs в React: от доступа к DOM до императивного API

React достаточно удобный инструмент для создания веб-приложений. Еще больше его возможности расширяют рефы (Ref или Reference), действующие как ссылки на элементы кода React и упрощающие решение нестандартных задач.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
⚙️ 7 HTML-трюков, которые вам нужно знать

Семь HTML-трюков, которые должны быть в арсенале каждого веб-разработчика. Эти приемы помогут вам создавать более удобные и визуально привлекательные сайты, улучшая взаимодействие с пользователями.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
Tailwind CSS: Как Добавить Эффектные Анимации

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

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Exes and Ohs

Проверьте, содержит ли строка одинаковое количество "x" и "o". Метод должен возвращать логическое значение и быть нечувствительным к регистру. Строка может содержать любой символ.

Пример кода:

XO("ooxx") => true
XO("xooxx") => false
XO("ooxXm") => true
XO("zpzpzpp") => true // when no 'x' and 'o' is present should return true
XO("zzoo") => false


Решение задачи🔽

function XO(str) {
// Преобразуем строку в нижний регистр
str = str.toLowerCase();

// Подсчитываем количество 'x' и 'o'
let xCount = 0;
let oCount = 0;

for (let char of str) {
if (char === 'x') xCount++;
if (char === 'o') oCount++;
}

// Сравниваем количество 'x' и 'o'
return xCount === oCount;
}

// Примеры использования
console.log(XO("ooxx")); // true
console.log(XO("xooxx")); // false
console.log(XO("ooxXm")); // true
console.log(XO("zpzpzpp")); // true
console.log(XO("zzoo")); // false
Please open Telegram to view this post
VIEW IN TELEGRAM
🖥 Генераторы CSS-кода: самая полная коллекция

Коллекция генераторов CSS-кода для разнообразных элементов дизайна UI (фоны, градиенты, кнопки, разделители, тени, фильтры изображений).

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Что такое замыкания в JavaScript?

В этой статье мы рассмотрим замыкания в JavaScript. Вы познакомитесь с определением замыкания и разберетесь в его работе на примере.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 CSS-only Custom range slider

Интересный слайдер с динамичным отображением. Сделан на чистом CSS.

Открыть код...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 VS Code на максималках: 15 крутых расширений для фронтендера

Собрали для вас 15 плагинов, которые облегчат жизнь веб-разработчику. Тут всё: от работы с HTML до интеграции с Figma и Docker.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Как реализовать feature gate в React

Предлагаем доступное руководство по реализации feature gate. Этот простой, но мощный механизм позволит легко управлять выпуском новых функций.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Как инженеру-программисту Reactjs перейти на Swift и SwiftUI

Узнаем, как плавно перейти с ReactJS на Swift и SwiftUI. Для этого сопоставим их наиболее распространенные шаблоны проектирования.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Text-Animation-test

Простая сцена с анимированным текстом. Сделан на чистом CSS.

Открыть код...
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Введение в Page Visibility API

Познакомимся с Page Visibility API, рассмотрим его назначение, принцип работы, область применения и практические примеры.

Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM