Unsplash — бесплатные изображения по лицензии CC0. Есть отличное API для встраивания графики в ваши приложения.
🌐Подробнее
Made in HTML/CSS
🌐Подробнее
Made in HTML/CSS
🔥4👍3
Метод Promise.all упрощает одновременную обработку нескольких асинхронных операций, позволяя выполнить их параллельно и продолжить работу только после завершения всех.
Например, можно запустить несколько запросов к API, ожидая их результаты в виде массива, где каждый элемент соответствует результату одной операции.
Если хотя бы одна операция завершится с ошибкой, Promise.all сразу перейдет в состояние отклоненного промиса. Этот подход эффективно сокращает время выполнения и делает код более организованным.
Made in HTML/CSS
Например, можно запустить несколько запросов к API, ожидая их результаты в виде массива, где каждый элемент соответствует результату одной операции.
Если хотя бы одна операция завершится с ошибкой, Promise.all сразу перейдет в состояние отклоненного промиса. Этот подход эффективно сокращает время выполнения и делает код более организованным.
Made in HTML/CSS
👍4🔥2
5 HTML-атрибутов для улучшения пользовательского опыта и SEO
🌐 Читать статью
Made in HTML/CSS
Разбираем мощные, но часто игнорируемые атрибуты HTML, способные значительно улучшить пользовательский опыт и SEO вашего сайта. От многоязычности до удобства заполнения форм – все, что нужно современному разработчику
🌐 Читать статью
Made in HTML/CSS
👍6
Что такое BEM?
BEM (Блок, Элемент, Модификатор) — это методология веб-разработки, которая предлагает структурированный подход к созданию интерфейсов путем их разделения на независимые компоненты. Основные понятия БЭМ:
Блок — независимая часть интерфейса, которая может использоваться повторно в разных местах проекта (например, кнопка, меню, карточка товара).
Элемент — часть блока, которая не может существовать отдельно от своего родителя (например, пункт меню внутри блока меню).
Модификатор — флаг, который изменяет внешний вид или поведение блока или элемента (например, активная кнопка или кнопка с прозрачным фоном).
БЭМ позволяет разрабатывать масштабируемые и поддерживаемые проекты, упрощает повторное использование кода и делает его более понятным для других разработчиков.
Made in HTML/CSS
BEM (Блок, Элемент, Модификатор) — это методология веб-разработки, которая предлагает структурированный подход к созданию интерфейсов путем их разделения на независимые компоненты. Основные понятия БЭМ:
Блок — независимая часть интерфейса, которая может использоваться повторно в разных местах проекта (например, кнопка, меню, карточка товара).
Элемент — часть блока, которая не может существовать отдельно от своего родителя (например, пункт меню внутри блока меню).
Модификатор — флаг, который изменяет внешний вид или поведение блока или элемента (например, активная кнопка или кнопка с прозрачным фоном).
БЭМ позволяет разрабатывать масштабируемые и поддерживаемые проекты, упрощает повторное использование кода и делает его более понятным для других разработчиков.
Made in HTML/CSS
👍6🔥3
This media is not supported in your browser
VIEW IN TELEGRAM
px to rem - плагин для VS Code, позволяющий конвертировать значения из пикселей (px) в относительные единицы (rem) и наоборот прямо в редакторе кода, что полезно для веб-разработчиков при создании адаптивного дизайна
Made in HTML/CSS
Made in HTML/CSS
👍7🔥4
This media is not supported in your browser
VIEW IN TELEGRAM
Проект с интерактивными элементами
Этот CSS-код создает стильную веб-страницу с шестью карточками, каждая из которых имеет уникальную тень. Каждая карточка имеет фиксированные размеры, закруглённые углы и белый фон. Текст на карточках отображается с градиентным эффектом, а при наведении курсора на карточку, её тень меняется.
Made in HTML/CSS
Этот CSS-код создает стильную веб-страницу с шестью карточками, каждая из которых имеет уникальную тень. Каждая карточка имеет фиксированные размеры, закруглённые углы и белый фон. Текст на карточках отображается с градиентным эффектом, а при наведении курсора на карточку, её тень меняется.
Таким образом, этот проект показывает, как можно использовать современные CSS-технологии, такие как переменные, Flexbox и Grid, чтобы создать адаптивный и интерактивный дизайн.
Made in HTML/CSS
👍8🔥1
Lorem Picsum — генерирует случайные картинки-плейсхолдеры любого нужного вам размера.
🌐Подробнее
Made in HTML/CSS
🌐Подробнее
Made in HTML/CSS
👍5🔥2
Функция "debounce" ограничивает частоту вызовов другой функции, гарантируя её выполнение только после периода неактивности заданной длительности. Это особенно полезно для обработки событий, которые срабатывают часто, таких как изменение размера окна или ввод текста.
Например, при использовании "debounce" с событием "resize", функция будет вызвана лишь после того, как пользователь прекратит изменять размер окна на определённое время (200 мс в примере). Это снижает нагрузку на систему и повышает производительность, так как исключает избыточные вызовы функции.
Made in HTML/CSS
Например, при использовании "debounce" с событием "resize", функция будет вызвана лишь после того, как пользователь прекратит изменять размер окна на определённое время (200 мс в примере). Это снижает нагрузку на систему и повышает производительность, так как исключает избыточные вызовы функции.
Made in HTML/CSS
👍5🔥3
Функция "throttle" ограничивает частоту выполнения другой функции, гарантируя её вызов не чаще одного раза за заданный период времени. Это особенно полезно для обработки событий, которые происходят часто, таких как прокрутка страницы или изменение размера окна. В отличие от "debounce", "throttle" выполняет функцию регулярно через фиксированные интервалы, если событие продолжает срабатывать.
Например, при использовании "throttle" с событием "scroll", функция будет вызываться только один раз каждые 200 мс, даже если событие срабатывает гораздо чаще. Это снижает нагрузку на систему и повышает производительность, сохраняя отзывчивость интерфейса.
Например, при использовании "throttle" с событием "scroll", функция будет вызываться только один раз каждые 200 мс, даже если событие срабатывает гораздо чаще. Это снижает нагрузку на систему и повышает производительность, сохраняя отзывчивость интерфейса.
🔥6👍1
Полезная статья о том, как добавлять иконки из Figma на сторонний сайт 4мя способами. Также присутствует видео для тех, кто любит визуальную демонстрацию.
🌐 Читать статью
Made in HTML/CSS
Как дополнение, разбираются положительные и отрицательные стороны каждого способа
🌐 Читать статью
Made in HTML/CSS
👍5🔥3
Что такое ECMAScript?
ECMAScript (ES) представляет собой стандарт, который определяет язык программирования JavaScript. Он описывает синтаксис, типы данных, структуры управления, операторы и другие основные элементы языка.
Made in HTML/CSS
ECMAScript (ES) представляет собой стандарт, который определяет язык программирования JavaScript. Он описывает синтаксис, типы данных, структуры управления, операторы и другие основные элементы языка.
Например, стандарт ECMAScript 2015 (ES6) привнес множество новых возможностей в язык, таких как стрелочные функции, классы, блочная область видимости переменных let и const, деструктуризация, шаблонные строки и многое другое. В дальнейших версиях стандарта были добавлены дополнительные функции, такие как async/await для управления асинхронным кодом, операторы распространения (spread operator) и рест (rest operator), улучшенные методы массивов и многое другое.
Made in HTML/CSS
👍4🔥3
Stack Overflow — крупнейшая в мире платформа вопросов и ответов для программистов.
С момента запуска в 2008 году она стала одним из главных источников технической информации: здесь разработчики находят проверенные решения, делятся знаниями и получают помощь от опытных коллег по любым темам из области программирования — от ошибок синтаксиса и отладки до архитектурных решений и оптимизации производительности.
Made in HTML/CSS
С момента запуска в 2008 году она стала одним из главных источников технической информации: здесь разработчики находят проверенные решения, делятся знаниями и получают помощь от опытных коллег по любым темам из области программирования — от ошибок синтаксиса и отладки до архитектурных решений и оптимизации производительности.
Made in HTML/CSS
👍10
Глубокое клонирование объектов позволяет создавать полные копии объектов, включая все вложенные свойства, что предотвращает изменение исходного объекта при работе с копией. Простые методы, такие как присваивание или поверхностное копирование, не справляются с вложенными структурами, так как копируют только ссылки на них.
Для глубокого клонирования можно использовать подходы вроде JSON.parse(JSON.stringify(obj)), который работает для простых случаев, или специализированные библиотеки, такие как Lodash, которые обеспечивают более надежное и универсальное клонирование. Это особенно важно при работе со сложными объектами, где требуется избежать побочных эффектов от изменения данных.
Made in HTML/CSS
Для глубокого клонирования можно использовать подходы вроде JSON.parse(JSON.stringify(obj)), который работает для простых случаев, или специализированные библиотеки, такие как Lodash, которые обеспечивают более надежное и универсальное клонирование. Это особенно важно при работе со сложными объектами, где требуется избежать побочных эффектов от изменения данных.
Made in HTML/CSS
👍6🔥1
WebStorm оптимизирован для кодирования с HTML, CSS, Node.js, JS, другими известными технологиями, связанными с JavaScript.
К его мощным функциям относятся автозавершение кода, выявление багов, оперативная навигация по коду, объединение с контролем версий, в Git, GitHub.
Made in HTML/CSS
К его мощным функциям относятся автозавершение кода, выявление багов, оперативная навигация по коду, объединение с контролем версий, в Git, GitHub.
Made in HTML/CSS
👍5🔥3
Чем отличаются JavaScript и ECMAScript?
Статья разбирает различия между JavaScript и ECMAScript, пытаясь прояснить часто путающиеся понятия. Вот ключевые моменты того, что рассматривается в статье:
🌐 Читать статью
Made in HTML/CSS
Статья разбирает различия между JavaScript и ECMAScript, пытаясь прояснить часто путающиеся понятия. Вот ключевые моменты того, что рассматривается в статье:
- Ecma International : организация, создающая стандарты для технологий.
- ECMA-262 : стандарт, изданный Ecma International, который описывает спецификацию языка программирования
- ECMAScript : это сам язык программирования, описанный в стандарте ECMA-262.
- JavaScript : реализация языка ECMAScript, созданная компанией Netscape (ныне Mozilla) и используемая в браузерах.
🌐 Читать статью
Made in HTML/CSS
👍5🔥1
Мемоизация — это техника оптимизации, которая ускоряет выполнение функций за счет кэширования их результатов. При повторном вызове функции с теми же аргументами она возвращает сохранённый результат вместо повторного выполнения вычислений. Это особенно полезно для затратных операций, таких как сложные математические вычисления или запросы данных.
Например, используя мемоизацию, функция будет выводить сообщение "Computing…" только при первом вызове с определённым аргументом, а все последующие вызовы с тем же аргументом будут возвращать закэшированный результат, что значительно повышает производительность и снижает нагрузку на систему.
Made in HTML/CSS
Например, используя мемоизацию, функция будет выводить сообщение "Computing…" только при первом вызове с определённым аргументом, а все последующие вызовы с тем же аргументом будут возвращать закэшированный результат, что значительно повышает производительность и снижает нагрузку на систему.
Made in HTML/CSS
👍6🔥1
Komodo IDE — это коммерческая среда разработки, которая построена на Komodo Edit и имеет ряд дополнительных функций, как например, отладка кода (включая удаленную), рефакторинг, работа с VCS, HTTP Inspector, Rx Toolkit, интегативный шелл, юнит-тесты, интеграцию с другими продуктами компании (Stackato, Perl Dev Kit и TCL Dev Kit) и другие мелочи.
Made in HTML/CSS
Made in HTML/CSS
🔥4👍2
Каррирование — это техника преобразования функции с несколькими аргументами в последовательность функций, каждая из которых принимает один аргумент. Это позволяет частично применять параметры постепенно, создавая новые функции с предустановленными значениями.
Например, функция sum(a, b, c) может быть каррирована, чтобы вызываться как curriedSum(1)(2)(3) или curriedSum(1, 2)(3), что делает код более гибким и удобным для повторного использования. Каррирование упрощает работу с функциями, особенно в ситуациях, где нужно создавать специализированные варианты функций с заранее заданными параметрами.
Made in HTML/CSS
Например, функция sum(a, b, c) может быть каррирована, чтобы вызываться как curriedSum(1)(2)(3) или curriedSum(1, 2)(3), что делает код более гибким и удобным для повторного использования. Каррирование упрощает работу с функциями, особенно в ситуациях, где нужно создавать специализированные варианты функций с заранее заданными параметрами.
Made in HTML/CSS
👍5🔥3
Coding Fantasy — это образовательная платформа в формате игровых интерактивных историй для изучения программирования. Она представляет сложные концепции кодирования через увлекательные приключенческие игры, где процесс обучения сочетается с решением игровых задач.
Made in HTML/CSS
На платформе можно найти такие проекты, как:
- MCP Panic : Текстовая игра с использованием TypeScript, где игроки спасают стартап от краха.
- Flex Box Adventure : Игра в стиле RPG для обучения CSS Flexbox, где нужно помогать королю Артуру победить злодеев.
- Grid Attack : Приключенческая игра для освоения CSS Grid, направленная на создание макетов и борьбу с демонами.
Made in HTML/CSS
🔥4👍3
Что такое всплытие событий?
Всплытие событий (bubbling phase) — это финальная фаза процесса обработки событий в JavaScript, которая происходит после того, как событие достигло целевого элемента (target phase). На этом этапе событие начинает перемещаться вверх по иерархии DOM, последовательно вызывая привязанные к родительским элементам обработчики.
По умолчанию большинство событий поддерживают всплытие. Это означает, что если вы кликаете на дочернем элементе, событие будет не только обработано на нем самом, но и "всплывет" к его родителям, запуская их обработчики. Такое поведение позволяет использовать технику делегирования событий — установку одного обработчика на родительский элемент вместо множества обработчиков на каждом дочернем элементе.
Made in HTML/CSS
Всплытие событий (bubbling phase) — это финальная фаза процесса обработки событий в JavaScript, которая происходит после того, как событие достигло целевого элемента (target phase). На этом этапе событие начинает перемещаться вверх по иерархии DOM, последовательно вызывая привязанные к родительским элементам обработчики.
По умолчанию большинство событий поддерживают всплытие. Это означает, что если вы кликаете на дочернем элементе, событие будет не только обработано на нем самом, но и "всплывет" к его родителям, запуская их обработчики. Такое поведение позволяет использовать технику делегирования событий — установку одного обработчика на родительский элемент вместо множества обработчиков на каждом дочернем элементе.
Made in HTML/CSS
👍9
Brackets — это современный текстовый редактор, специально разработанный для веб-разработчиков. Он был создан Adobe и является бесплатным и с открытым исходным кодом.
Brackets поддерживает HTML, CSS и JavaScript, что делает его идеальным инструментом для создания веб-приложений и сайтов.
Made in HTML/CSS
Brackets поддерживает HTML, CSS и JavaScript, что делает его идеальным инструментом для создания веб-приложений и сайтов.
Made in HTML/CSS
👍8