Свойство float в CSS
Свойство float в CSS используется для выравнивания элементов (часто изображений) слева или справа на веб-странице, позволяя тексту и другим элементам "обтекать" их.
Когда элементу присваивается свойство float, он выносится из нормального потока документа и сдвигается влево или вправо в зависимости от значения свойства (left, right, или none). Остальные элементы на странице будут "обтекать" его.
- Элементы с float выходят из нормального потока, что может привести к некоторым проблемам макета, которые обычно решаются с использованием дополнительных CSS-техник, таких как clear.
- float особенно полезен для макетов с несколькими столбцами и для обтекания текста вокруг изображений.
- Современные методы макетирования, такие как Flexbox и Grid, делают float менее необходимым для создания сложных макетов, но это свойство все еще широко используется и полезно знать.
#css #обучающийПост #float
Свойство float в CSS используется для выравнивания элементов (часто изображений) слева или справа на веб-странице, позволяя тексту и другим элементам "обтекать" их.
Когда элементу присваивается свойство float, он выносится из нормального потока документа и сдвигается влево или вправо в зависимости от значения свойства (left, right, или none). Остальные элементы на странице будут "обтекать" его.
- Элементы с float выходят из нормального потока, что может привести к некоторым проблемам макета, которые обычно решаются с использованием дополнительных CSS-техник, таких как clear.
- float особенно полезен для макетов с несколькими столбцами и для обтекания текста вокруг изображений.
- Современные методы макетирования, такие как Flexbox и Grid, делают float менее необходимым для создания сложных макетов, но это свойство все еще широко используется и полезно знать.
#css #обучающийПост #float
👍8👌2
for... а что дальше in или of?
for...in цикл перебирает все перечислимые свойства объекта, включая свойства, унаследованные от прототипов. Он чаще всего используется для перебора свойств объекта. (Для каждого В объекте)
for...of цикл используется для перебора итерируемых объектов, таких как массивы, строки, Map, Set и др. Он не может использоваться для перебора объектов. (Для каждого ИЗ элементов)
#JavaScript #обучающийПост #цикл #array #object
for...in цикл перебирает все перечислимые свойства объекта, включая свойства, унаследованные от прототипов. Он чаще всего используется для перебора свойств объекта. (Для каждого В объекте)
for...of цикл используется для перебора итерируемых объектов, таких как массивы, строки, Map, Set и др. Он не может использоваться для перебора объектов. (Для каждого ИЗ элементов)
#JavaScript #обучающийПост #цикл #array #object
👍7🔥5
Видео по TypeScript готово на 60%👌🏻
Стараюсь изо всех сил, доделать и выложить в понедельник🤝
Стараюсь изо всех сил, доделать и выложить в понедельник🤝
🫡12🤝2👍1
Кодировка HTML-страницы
Для корректного отображения текста на нескольких языках на веб-странице, вам следует убедиться, что используется правильная кодировка символов. Это можно сделать, добавив тег <meta charset="UTF-8"> внутрь тега <head> вашего HTML-документа. UTF-8 поддерживает большое количество символов и идеально подходит для многоязычных сайтов.
#html #обучающийПост #кодировка
Для корректного отображения текста на нескольких языках на веб-странице, вам следует убедиться, что используется правильная кодировка символов. Это можно сделать, добавив тег <meta charset="UTF-8"> внутрь тега <head> вашего HTML-документа. UTF-8 поддерживает большое количество символов и идеально подходит для многоязычных сайтов.
#html #обучающийПост #кодировка
👍4❤3🔥1
Анонимные функции в JS
Анонимными называются функции, которые не имеют собственного имени, как следствие, их нельзя сначала объявить, а потом вызвать.
#обучающийПост #JavaScript #function
Анонимными называются функции, которые не имеют собственного имени, как следствие, их нельзя сначала объявить, а потом вызвать.
#обучающийПост #JavaScript #function
👍8💯2🔥1
Interface Segregation Principle
Принцип разделения интерфейса (Interface Segregation Principle, ISP) в контексте React гласит, что ни один компонент не должен быть вынужден реализовывать методы, которые ему не нужны. В других словах, большие интерфейсы следует разбивать на более мелкие, чтобы клиентский код имел дело только с теми методами, которые ему нужны. Это способствует уменьшению "тяжести" зависимостей между компонентами и улучшает модульность.
Представьте, что у вас есть компонент User, который может иметь различные роли, такие как Admin, Guest, Subscriber и так далее. Разные роли могут иметь различные операции или методы.
Принцип разделения интерфейса в React заключается в создании специфичных компонентов с ограниченными функциями. Это обеспечивается передачей только необходимых пропсов, исключая лишние функции и данные, для повышения читаемости и эффективности кода.
#обучающийПост #react #solid
Принцип разделения интерфейса (Interface Segregation Principle, ISP) в контексте React гласит, что ни один компонент не должен быть вынужден реализовывать методы, которые ему не нужны. В других словах, большие интерфейсы следует разбивать на более мелкие, чтобы клиентский код имел дело только с теми методами, которые ему нужны. Это способствует уменьшению "тяжести" зависимостей между компонентами и улучшает модульность.
Представьте, что у вас есть компонент User, который может иметь различные роли, такие как Admin, Guest, Subscriber и так далее. Разные роли могут иметь различные операции или методы.
Принцип разделения интерфейса в React заключается в создании специфичных компонентов с ограниченными функциями. Это обеспечивается передачей только необходимых пропсов, исключая лишние функции и данные, для повышения читаемости и эффективности кода.
#обучающийПост #react #solid
👍5🔥3
Data-атрибуты
Используются для хранения пользовательских данных прямо в HTML-тегах. Эти данные можно затем использовать в JavaScript. Это особенно полезно, когда необходимо ассоциировать некоторые данные с конкретным элементом, но не хочется засорять DOM дополнительными тегами или неструктурированными атрибутами.
#html #attribute #data #обучающийПост
Используются для хранения пользовательских данных прямо в HTML-тегах. Эти данные можно затем использовать в JavaScript. Это особенно полезно, когда необходимо ассоциировать некоторые данные с конкретным элементом, но не хочется засорять DOM дополнительными тегами или неструктурированными атрибутами.
#html #attribute #data #обучающийПост
👍4👌2❤1
Feature detection, feature inference и User Agent String — это методы, позволяющие определить возможности и особенности работы браузера.
Feature Detection:
- Проверяет, поддерживает ли браузер конкретную функцию или API.
- Например, вы можете проверить, поддерживает ли браузер localStorage прежде, чем использовать его.
Feature Inference:
- Основан на предположении, что наличие одной функции в браузере гарантирует наличие другой.
- Например, если браузер поддерживает один HTML5 API, он, возможно, поддерживает и другие. Однако такой подход не является надежным.
User Agent String:
- Это идентификатор браузера, который он отправляет веб-серверу при запросе страницы.
- Позволяет определить браузер, ОС и другие детали, но может быть легко подделан или изменен.
#обучающийПост #JavaScript #browser
Feature Detection:
- Проверяет, поддерживает ли браузер конкретную функцию или API.
- Например, вы можете проверить, поддерживает ли браузер localStorage прежде, чем использовать его.
Feature Inference:
- Основан на предположении, что наличие одной функции в браузере гарантирует наличие другой.
- Например, если браузер поддерживает один HTML5 API, он, возможно, поддерживает и другие. Однако такой подход не является надежным.
User Agent String:
- Это идентификатор браузера, который он отправляет веб-серверу при запросе страницы.
- Позволяет определить браузер, ОС и другие детали, но может быть легко подделан или изменен.
#обучающийПост #JavaScript #browser
👍5🔥2
https://youtube.com/@reactify-it
🎓 Reactify Academy
https://academy.reactify.ru
🤝 Reactify Community
@reactify-community
Please open Telegram to view this post
VIEW IN TELEGRAM
Руслан Куянец | Reactify pinned «📹 Reactify YouTube https://youtube.com/@reactify-it 🎓 Reactify Academy https://academy.reactify.ru 🤝 Reactify Community @reactify-community»
Темы из видео:
0:00 - Введение. Для чего нужен.
1:15 - Как начать. Компиляция. Файлы и настройки
6:40 - Виды типизаций (Сильная, слабая, явная, неявная...)
9:40 - Структурная типизация. (Утиная)
11:05 - Типы данных
12:35 - Анотация типов
12:52 - Enum (Перечисления)
15:15 - Интерфейсы и Типы (Введение)
18:48 - Алиасы типов (псевдонимы, конкретизация, составные, простые)
20:32 - Объединение типов
22:00 - Пересечение типов
23:02 - Types Queries (Запросы типов, typeof)
24:55 - Литеральные типы (строковые, числовые)
27:00 - Типизация объектов
29:02 - Типизация массивов
30:10 - Типизация кортеж
33:31 - Типизация функций
35:33 - Extends Интерфейсы
37:50 - Implements Интерфейсы
38:16 - Индексные члены типов
41:22 - Модификаторы доступа. Классы. (public, private, protected)
44:34 - Операторы Optional, Not-Null, Not-Undefined
48:24 - Generics (Обобщения) (Promise, axios, api)
56:48 - Generic Constraints (Параметры типа, Extends)
58:52 - Generic parameter defaults (Значение по умолчанию, условные типы)
1:00:30 - Дискриминантное объединение
1:05:00 - Type assertions (Утверждения типов)
1:07:05 - Type Guards (Защитники типов)
1:08:36 - Оператор keyof, lookup types, mapped types, mapped types - префиксы + и -
1:13:14 - Утилитарные типы (Readonly, Partial, Required, Pick, Record)
1:18:27 - Утилитарные типы (Exclude, Extract, Nonnullable, Returntype, Instancetype, Omit)
1:22:00 - Массивоподобные Readonly типы (ReadonlyArray, ReadonlyMap, ReadonlySet)
1:24:16 - Заключение, Практика, Планы
0:00 - Введение. Для чего нужен.
1:15 - Как начать. Компиляция. Файлы и настройки
6:40 - Виды типизаций (Сильная, слабая, явная, неявная...)
9:40 - Структурная типизация. (Утиная)
11:05 - Типы данных
12:35 - Анотация типов
12:52 - Enum (Перечисления)
15:15 - Интерфейсы и Типы (Введение)
18:48 - Алиасы типов (псевдонимы, конкретизация, составные, простые)
20:32 - Объединение типов
22:00 - Пересечение типов
23:02 - Types Queries (Запросы типов, typeof)
24:55 - Литеральные типы (строковые, числовые)
27:00 - Типизация объектов
29:02 - Типизация массивов
30:10 - Типизация кортеж
33:31 - Типизация функций
35:33 - Extends Интерфейсы
37:50 - Implements Интерфейсы
38:16 - Индексные члены типов
41:22 - Модификаторы доступа. Классы. (public, private, protected)
44:34 - Операторы Optional, Not-Null, Not-Undefined
48:24 - Generics (Обобщения) (Promise, axios, api)
56:48 - Generic Constraints (Параметры типа, Extends)
58:52 - Generic parameter defaults (Значение по умолчанию, условные типы)
1:00:30 - Дискриминантное объединение
1:05:00 - Type assertions (Утверждения типов)
1:07:05 - Type Guards (Защитники типов)
1:08:36 - Оператор keyof, lookup types, mapped types, mapped types - префиксы + и -
1:13:14 - Утилитарные типы (Readonly, Partial, Required, Pick, Record)
1:18:27 - Утилитарные типы (Exclude, Extract, Nonnullable, Returntype, Instancetype, Omit)
1:22:00 - Массивоподобные Readonly типы (ReadonlyArray, ReadonlyMap, ReadonlySet)
1:24:16 - Заключение, Практика, Планы
🫡7👍3👌2
Что будем добавлять в React Новости?
Anonymous Poll
38%
React Context (избавимся от пропсов)
14%
Сохранение новостей (localstorage)
16%
Поиск по дате (запрос к апи с датой)
14%
Сортировка баннеров по дате
19%
Модальное окно для открытия новости целиком
0%
Другое
👍5