Вайб-кодинг – Telegram
Вайб-кодинг
26K subscribers
1.51K photos
518 videos
30 files
708 links
Авторский канал по ВАЙБ КОДИНГУ

Ссылка для друзей: https://news.1rj.ru/str/+ll3pbl442dNkZmYy

Связь: @devmangx
По контенту: @codingpepe

РКН: https://clck.ru/3RRVfk
Download Telegram
Спред-синтаксис (spread) ... позволяет передавать итерируемые коллекции (например, массивы или строки) как список аргументов функции или добавлять содержащиеся в них элементы в новый массив.

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

#JavaScript
Псевдоэлемент ::first-leter позволяет задать стили для первой буквы первой строки блочного элемента, если перед текстом нет другого содержимого.

#CSS
Существует категория HTML-атрибутов, которые можно применить к любому или почти любому HTML-тегу.

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

#HTML
Псевдоэлемент ::selection позволяет применить стили к пользовательскому выделению (например, к выделенному с помощью мыши тексту) и изменить его вид. Это полезно, если необходимо оформить выделение текста в соответствии с конкретным дизайном.

#CSS
Для улучшения пользовательского интерфейса, используйте регистр заголовка вместо верхнего регистра.

#UX_UI
Тернарный оператор работает с тремя операндами: одним условием и двумя выражениями. Возвращает первое выражение, если условие истинно и второе, если условие ложно.

Используется как компактная замена условного оператора if...else.

#JavaScript
Тег dialog создаёт всплывающее окно или диалог. По умолчанию не показывается на странице.

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

#HTML
Псевдокласс :checked активируется, когда пользователь отмечает чекбокс или выбирает одну из радиокнопок. С его помощью удобно стилизовать эти элементы в их активном состоянии.

#CSS
Спред на объектах используют в библиотеке React. Программист может передать в функцию объект с произвольными свойствами, но мы хотим запретить устанавливать некоторые из них. В этом случае создаётся новый объект, в который сначала копируются присланные значения, а потом значения «запрещённых» свойств. В этом случае даже если запрещённое свойство было передано, оно будет перезаписано.

#JavaScript
Не используйте модальные окна для рейтинга в отзывах. Это усложняет их функционал.

#UX_UI
С помощью атрибута aria-labelledby можно добавить подпись к элементу. Это свойство связи для одного или нескольких элементов c видимым именем (подписью) для другого.

#HTML
В новом коде используйте только let или const. Используйте let в тех случаях, когда значение переменной меняется. Во всех остальных используйте const. Проще всего всегда по умолчанию использовать ключевое слово const и исправлять объявление переменной на let, если появляется нужда изменить её значение далее в коде.

Называйте переменные так, чтобы можно было легко понять, что в них хранится.

#JavaScript
Свойство text-decoration-line создаёт декоративные линии в тексте. Заодно их можно разукрасить при помощи свойства text-decoration-color и стилизовать с помощью text-decoration-style.

#CSS
Как сделать элемент тултипом? Тултипом называют небольшую подсказку к элементу, которая появляется при наведении курсора, фокусе с клавиатуры и тапе на мобильном устройстве.

#HTML
Для имени переменной можно использовать следующие символы:
✓ буквы латинского алфавита;
✓ цифры;
✓ символы $ и _.

Первый символ не должен быть цифрой. В качестве названий переменных нельзя использовать зарезервированные языком слова. 

#JavaScript
Псевдокласс :indeterminate
используется для стилизации трёх элементов: чекбоксов, радиокнопок и прогресс-баров.

Пригодится в двух случаях. Во-первых, для стилизации элементов в их исходном состоянии — при открытии формы или начале загрузки. Во-вторых, для показа пользователю незавершённости процесса выбора или загрузки.
Для чекбоксов и радиокнопок состояние indeterminate не получится присвоить напрямую в HTML, его можно задать только через JavaScript.
Прогресс-бару браузер присваивает indeterminate автоматически, если не определён атрибут value — процент загрузки.

#CSS
В HTML атрибут loading откладывает загрузку изображений, которые находятся за пределами экрана, до тех пор, пока пользователь не прокрутит страницу до изображения.

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

#HTML
Функция — это блок из различных команд. С ней легко создавать порядок в коде программы, избавляясь от ненужных повторений и запутанных частей.

✓ Первый способ — просто объявить функцию в коде (по-английски Function Declaration).

✓ Второй — создать функциональное выражение (Function Expression). Это похоже на первый способ, но здесь функция становится значением переменной.

#JavaScript
Для удобства пользователя, на странице лучше не использовать насыщенные цвета.

#UX_UI
Свойство clip-path задаёт видимую область изображения. Всё, что выходит за пределы указанной области скрывается. Пригодится, например, если нужно сделать наклонный участок.

#CSS
Атрибут capture указывает на запись нового файла (по кнопке выбора файла) и определяет устройство, которое используется для захвата контента. Тип контента определён атрибутом accept. Значение user означает обращённую к пользователю камеру и/или микрофон, а значение environment — фронтальную.

#HTML