How To WebDev

​🧾 Элемент textarea Элемент textarea определяет многострочное поле ввода (текстовой области): Пример: Код Атрибут rows указывает видимое количество строк в текстовой области. Атрибут cols определяет видимую ширину текстовой области. Так приведенный выше HTML код будет отображаться в браузере: Кот играл в саду. Вы также можете определить размер текстовой области с помощью CSS: Пример: Код 📋 #HTML #Код ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Разрешить выбор в HTML Для разрешения выбора используйте атрибут multiple, позволяющий пользователю выбрать более одного значения: Пример: Код 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Видимые значения HTML Для указания количества видимых значений используется атрибут size. Также этот атрибут определяет ширину для элемента (в символах). Пример: Код 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Элемент option HTML Сегодня разберёмся, что такое элемент option. Элемент option определяет параметр, который может быть выбран. По умолчанию выбирается первый элемент в раскрывающемся списке. Чтобы определить предварительно выбранный параметр, добавьте атрибут selected с параметром option. Пример: Код 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Элемент select HTML Элемент select определяет раскрывающийся список. Пример использования: Код 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Текстовое поле HTML «<input type="text">» определяет однострочное поле ввода для ввода текста. Приведём пример, форма с двумя полями ввода текста: Код Сама форма не видна. Также обратите внимание, что ширина поля ввода по умолчанию составляет 20 символов. 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Элемент <input> HTML Элемент <input> - самый важный элемент формы. Элемент <input> отображается несколькими способами, в зависимости от атрибута type. Приведём несколько примеров: <input type="text"> – определяет однострочное поле ввода текста. <input type="radio"> – определяет переключатель (для выбора одного из многих вариантов). <input type="submit"> – определяет кнопку отправки (для отправки формы). 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Элемент <form> HTML HTML элемент <form> определяет форму, которая используется для сбора пользовательских данных: <form> . элементы формы . </form> HTML форма содержит элементы формы. Элементы формы - это различные типы элементов ввода, такие как текстовые поля, флажки, переключатели, кнопки отправки и многое другое. 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Задачи по спискам Python (часть 2) 6. Даны два списка, удалите все элементы первого списка из второго. a = [1, 3, 4, 5] b = [4, 5, 6, 7] # Вывод >>> [6, 7] 7. Создайте список из случайных чисел и найдите наибольший элемент в нем. 8. Найдите наименьший элемент в списке из задания 7. 9. Найдите сумму элементов списка из задания 7. 10. Найдите среднее арифметическое элементов списка из задания 7. Решение для того, чтобы проверить себя: код 📋 #Задача ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Задачи по спискам Python (часть 1) Начнём с решения более простых задач. 1. Создайте список из 10 четных чисел и выведите его с помощью цикла for. 2. Создайте список из 5 элементов. Сделайте срез от второго индекса до четвертого. 3. Создайте пустой список и добавьте в него 10 случайных чисел и выведите их. В данной задаче нужно использовать функцию randint: from random import randint n = randint(1, 10) # Случайное число от 1 до 10 4.Удалите все элементы из списка, созданного в задании 3. 5. Создайте список из введенной пользователем строки и удалите из него символы 'a', 'e', 'o'. 📋 #Совет ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Эффективность методов массивов Методы push/pop выполняются быстро, а методы shift/unshift – медленно. Теперь посмотрим, что происходит во время выполнения: fruits.shift(); // удаляем первый элемент с начала Операция shift должна выполнить 3 действия: 1.Удалить элемент с индексом 0. 2.Сдвинуть все элементы влево, заново пронумеровать их, заменив 1 на 0, 2 на 1 и т.д. 3.Обновить свойство length . Чем больше элементов содержит массив, тем больше времени потребуется для того, чтобы их переместить, больше операций с памятью. 📋 #Совет ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Внутреннее устройство массива (финал) Варианты неправильного применения массива: Добавление нечислового свойства, например: arr.test = 5. Создание «дыр», например: добавление arr[0], затем arr[1000] (между ними ничего нет). Заполнение массива в обратном порядке, например: arr[1000], arr[999] и т.д. Массив следует считать особой структурой, позволяющей работать с упорядоченными данными. Для этого массивы предоставляют специальные методы. Массивы тщательно настроены в движках JavaScript для работы с однотипными упорядоченными данными, поэтому используйте их именно в таких случаях. Если вам нужны произвольные ключи, возможно, лучше подойдёт обычный объект {}. 📋 #Совет ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Внутреннее устройство массива (часть 3) Движок JavaScript старается хранить элементы массива в непрерывной области памяти, один за другим. Существуют и другие способы оптимизации, благодаря которым массивы работают очень быстро. Но все они утратят эффективность, если мы перестанем работать с массивом как с «упорядоченной коллекцией данных» и начнём использовать его как обычный объект. Например, технически мы можем сделать следующее: let fruits = []; // создаём массив fruits[99999] = 5; // создаём свойство с индексом, намного превышающим длину массива fruits.age = 25; // создаём свойство с произвольным именем Это возможно, потому что в основе массива лежит объект. Мы можем присвоить ему любые свойства. Но движок поймёт, что мы работаем с массивом, как с обычным объектом. Способы оптимизации, используемые для массивов, в этом случае не подходят, поэтому они будут отключены и никакой выгоды не принесут. 📋 #Совет ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Внутреннее устройство массива (часть 2) В JavaScript массив является объектом и ведёт себя как объект. Например, копируется по ссылке: let fruits = ["Банан"] let arr = fruits; // копируется по ссылке (две переменные ссылаются на один и тот же массив) alert( arr === fruits ); // true arr.push("Груша"); // массив меняется по ссылке alert( fruits ); // Банан, Груша - теперь два элемента 📋 #Совет ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Полезные материалы по фронтенду (часть 2) Coolors – это веб-приложение предназначено для выбора подходящей цветовой палитры. После регистрации можно сохранять готовые палитры в таких форматах, как PDF, PNG, SCSS, SVG, или же просто копировать ссылку и пересылать результат. 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Полезные материалы по фронтенду (часть 1) К таким сервисам относится MDM. Данный ресурс предоставляет информацию обо всех открытых стандартах в веб-технологиях. Этот справочник будет полезен, когда нужно решить проблему и желательно его использовать по требованию. Все материалы на этом сайте – труд разработчиков со всего мира. Каждый может поучаствовать в расширении базы знаний, в добавлении новой информации. 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Что такое фронтенд и бэкенд? (часть 2) Бэкенд — это серверная часть веб-приложения, скрытая от глаз пользователя. Она включает в себя серверы, на которых расположены веб-страницы и определенную логику, которая управляет функциями и процессами сайта. Для разработки бэкенд используют: Java, PHP, Ruby, C# и JavaScript. 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Что такое фронтенд и бэкенд? (часть 1) Фронтенд веб-сайта — это все, что пользователь видит и с чем он может взаимодействовать при помощи браузера. Создание этой визуальной части называется фронтенд-разработкой. Для разработки фронтенда в основе базовых инструментов используются: HTML (для создания базовой структуры страниц и контента), CSS (для стилизации внешнего вида) и JavaScript (для добавления интерактивности). 📋 #Frontend ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Метод copy в Python (финал) Но если у нас список в списке, то внутренний список с помощью метода copy не скопируется: fruits = ['Banana', 'Apple', 'Grape', ['Orange','Peach']] new_fruits = fruits.copy() fruits[-1].pop() print(fruits) # 1 print(new_fruits) # 2 >>> ['Banana', 'Apple', 'Grape', ['Orange']] # 1 >>> ['Banana', 'Apple', 'Grape', ['Orange']] # 2 📋 #Совет ▬▬▬▬▬▬▬▬ // How To WebDev

​🧾 Метод copy в Python (часть 2) Когда при прямом присваивании спис­ков копи­рования не проис­ходит, то обе пере­менные начи­нают ссылаться на один и тот же список. То есть, если мы изме­ним один из них, то изме­нится и другой. Исправить ситуацию поможет этот же метод – copy: fruits = ['Banana', 'Apple', 'Grape'] new_fruits = fruits.copy() fruits.pop() print(fruits) print(new_fruits) >>> ['Banana', 'Apple'] >>> ['Banana', 'Apple', 'Grape'] 📋 #Совет ▬▬▬▬▬▬▬▬ // How To WebDev