⚙️ Что такое свойство text-transform в CSS и зачем оно используется?

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

➡️ Пример:

<div class="box">hello world</div>

<style>
  .box {
    font-size: 20px;
    text-transform: uppercase;
  }
</style>

🗣 В этом примере текст "hello world" будет отображён как HELLO WORLD.

Популярные значения:

• none — без изменений (по умолчанию)
• uppercase — все буквы заглавные
• lowercase — все буквы строчные
• capitalize — каждая первая буква слова заглавная

Полезно для заголовков, кнопок, меню и приведения текста к единому стилю.

CodeBase | Frontend | #CSS

🖥 SRE на Frontend`е

Уже есть статьи про качество кода (линты, хинты, хорошие практики), стратегии обработки ошибок (feature toggle, request retry) и UX/UI их отображения.

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

🔗 Ссылка

CodeBase | Frontend | #article

⚡️Glitch Experiment — Красивый эффект для текста.

Технологии: CSS и JS

🔗 Ссылка

CodeBase | Frontend | #animate

#it #джун #Сеньор

🦥Ленивый программист ©

👩‍💻 Метод every() в JavaScript и как он используется

Метод every() проверяет, удовлетворяют ли все элементы массива заданному условию.

Возвращает true, если условие выполняется для каждого элемента, иначе false.

➡️ Пример:

const numbers = [2, 4, 6, 8];

const allEven = numbers.every(num => num % 2 === 0);
console.log(allEven); // true

🗣️ В этом примере:

• every() проверяет все числа на чётность
• Возвращает true, так как все элементы подходят
• Полезен для валидации данных (например, все ли поля заполнены)

every() часто используют для проверки массивов перед отправкой данных на сервер

CodeBase | Frontend | #JS

🖥 Вам больше не нужен JavaScript

Покажу, как CSS+HTML берут интерактив: вложенность, @starting-style, dvh/dvw, :has(), переходы — меньше JS, больше скорости и красоты. Примеры, гайды

🔗 Ссылка

CodeBase | Frontend | #article

Он тимлид в российском бигтехе! Но ещё с универа мечтает о переезде в Лондон!

Он отправил уже несколько тысяч откликов на вакансии! Позади — сотни собеседований и столько же отказов 😳

Какое-то время он даже жил в лесу, чтобы ничего не отвлекало его от подготовки к интервью.

Он 14 лет в ИТ: писал сервисы, менеджерил команды, ломал монолиты и собирал новые 😅

Он видел всё — и даже то, чего не стоило бы видеть.

Весь свой опыт, знания и советы он публикует в своём канале, говорит простым и понятным языком.

Подпишись на его канал @artur_speaking

Узнай первым о том, что тебя ждёт впереди, чтобы оставить конкурентов далеко позади, добраться до самых вершин карьеры — и наказать своих врагов и завистников 💀

⚡️SVG background animation test — Разъезжающиеся фигуры произвольной формы в качестве фона.

Технологии: CSS

🔗 Ссылка

CodeBase | Frontend | #animate

⚙️ Что такое свойство text-shadow в CSS и зачем оно используется?

text-shadow — это CSS-свойство, которое добавляет тень к тексту, улучшая его визуальное восприятие. Оно позволяет задавать цвет, смещение, размытие и создавать эффекты, такие как свечение или объёмный текст.

➡️ Пример:

<div class="text">Тень у текста</div>

<style>
  .text {
    font-size: 24px;
    font-weight: bold;
    color: darkblue;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); /* Тень с размитием */
  }
</style>

🗣 В этом примере text-shadow делает текст более выразительным. Это свойство часто используется для стилизации заголовков, кнопок и декоративных элементов.

CodeBase | Frontend | #CSS

⚙️ Что такое атрибут required в HTML и зачем он используется?

Атрибут required делает поле формы обязательным для заполнения.

Если пользователь попытается отправить форму без значения — браузер покажет предупреждение.

➡️ Пример:

<form>
  <label>
    Email:
    <input type="email" required>
  </label>
  <button type="submit">Отправить</button>
</form>

🗣️ Почему полезно:

• Проверка происходит прямо в браузере, без JavaScript
• Повышает удобство для пользователя
• Работает с <input>, <textarea>, <select>


required — простой способ добавить валидацию в форму «из коробки».

CodeBase | Frontend | #Основы

🖥 К вопросу о кошмарном качестве книг по программированию. Моя не наглядная книга о наглядном CSS

Расскажу, почему современные комп-книги стыдно читать: дело не в переводе, а в ляпах и кривом коде. Покажу примеры, посчитаю фейлы, дам чек-лист, как выбирать годноту.

🔗 Ссылка

CodeBase | Frontend | #article

⚡️Circular Mask — Анимация переходов.

Технологии: CSS

🔗 Ссылка

CodeBase | Frontend | #animate

⚙️ Что такое свойство letter-spacing в CSS и зачем оно используется?

Свойство letter-spacing управляет расстоянием между символами текста.

Можно уменьшать или увеличивать интервал для улучшения читаемости и стилизации.

➡️ Пример:

<div class="box">HELLO WORLD</div>

<style>
  .box {
    font-size: 20px;
    letter-spacing: 5px;
  }
</style>

🗣 В этом примере текст "HELLO WORLD" будет отображён с увеличенным интервалом между буквами.

Популярные значения:

• normal — стандартное расстояние (по умолчанию)
• положительные числа — увеличивают интервалы
• отрицательные числа — уменьшают интервалы

Полезно для заголовков, логотипов и стилизованного текста в интерфейсах.

CodeBase | Frontend | #CSS