JavaScript заметки

Первые шаги в JavaScript: создание калькулятора Начинаете осваивать JavaScript? Создание простого калькулятора позволит вам оценить его возможности. Вы получите базовое представление о синтаксисе JavaScript и о том, как использовать его для создания интерактивных веб-приложений. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

Использование Object Destructuring для извлечения значений из объектов Деструктуризация объектов в JavaScript позволяет извлекать значения свойств объекта в переменные. #полезное

Циклы в JavaScript Рассмотрим циклы JavaScript, их типы, примеры использования и лучшие практики. Это поможет успешно управлять ходом выполнения программ, эффективно решая повторяющиеся задачи. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

Использование WebAssembly для выполнения высокопроизводительного кода в браузере WebAssembly — это бинарный формат инструкций, предназначенный для выполнения в веб-браузерах, что позволяет запускать высокопроизводительные приложения, написанные на языках, таких как C или C++, в браузере. #полезное

Как добавить несколько товаров в Shopify корзину одним кликом? Недавно я писал конфигуратор в Shopify и решил поделиться тем, как добавить несколько товаров в Шопифай корзину. Я находил не так много материалов по этому вопросу, тем более на русском языке. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

Работа с датами и временем: использование объекта Date и библиотек для работы с датами Работа с датами и временем является неотъемлемой частью разработки веб-приложений, особенно при работе с расписаниями, сроками и другими временными данными. Для работы с датами в JavaScript мы можем использовать встроенный объект Date, который предоставляет функциональность для работы с датами и временем. В данном примере мы создаем объект Date с помощью конструктора new Date(), который инициализирует его текущей датой и временем. Затем мы используем различные методы объекта Date, такие как getFullYear(), getMonth(), getDate(), getHours(), getMinutes() и getSeconds(), чтобы получить текущие значения года, месяца, дня, часа, минуты и секунды. Мы также форматируем дату и время, используя шаблон строки и значения, полученные от объекта Date. В данном примере мы форматируем дату в формате "день.месяц.год" и время в формате "часы:минуты:секунды". #полезное

Увеличиваем свою производительность в WebStorm / PhpStorm c помощью шаблонов В этой статье я хотел бы рассказать вам, как можно сократить рутинную работу написания кода, используя шаблоны для создания файлов. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

👩‍💻 Ищем JavaScript разработчиков. Релокейт, удалёнка, платим много! Специально для Вас, собираем лучшие вакансии по JavaScript с прямыми контактами в Telegram: 👩‍💻 Fronted Jobs - для фронтендеров 👩‍💻 Node.Js Jobs - для бекендеров Подпишись чтобы не упустить свой шанс получить лучший оффер!

Манипуляция с элементами страницы: создание, удаление и изменение HTML-элементов Манипуляция с элементами страницы - это важная часть разработки веб-приложений, которая позволяет создавать, удалять и изменять HTML-элементы динамически с помощью JavaScript. Это особенно полезно при обновлении содержимого страницы без перезагрузки. В данном примере мы создаем новый элемент div с текстом "Новый элемент" и классом "my-class". Затем мы добавляем этот элемент в конец body документа с помощью метода appendChild(). Мы также изменяем содержимое элемента с помощью свойства textContent и стилизуем его, устанавливая значение свойства backgroundColor. Через 3 секунды мы удаляем элемент с помощью метода remove(). Это демонстрирует возможность удаления элементов из документа. Таким образом, манипуляция с элементами страницы позволяет нам динамически создавать, изменять и удалять HTML-элементы, что открывает широкие возможности для создания интерактивных и динамических веб-приложений. #полезное

Миграция с Webpack и react-scripts на Vite: Путь к Быстрому и Легковесному React Я работаю фронтенд-разработчицей в IT-компании, и многие из моих проектов на протяжении долгого времени собирались с использованием Webpack. Настройка Webpack иногда бывала сложной, но в целом он справлялся с задачей сборки проектов. Однако в последнее время мои коллеги начали восторгаться новым инструментом - Vite. Они рассказывали о его легковесности, быстрой сборке и преимуществах для разработчиков React-приложений. В этой статье я поделюсь своим опытом миграции с Webpack и react-scripts на Vite. Я расскажу о причинах, по которым решила попробовать Vite, а также о том, с какими сложностями пришлось столкнуться и как они были решены. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

Асинхронные HTTP-запросы с использованием современного API Fetch В примере мы используем fetch для отправки GET-запроса к удаленному серверу. Мы обрабатываем результат запроса с использованием асинхронного синтаксиса с await и async. Если запрос выполнен успешно (HTTP-код 200), мы преобразуем полученные данные в JSON и выводим их в консоль. В противном случае, мы ловим ошибку и выводим сообщение об ошибке. #полезное

Web Accessibility в рассказе «A11Y от 0 до NaN» Данной статьёй я планирую рассказать про интересные случаи и про то, в каких ситуациях можно оказаться, постигая новые горизонты, но не собираюсь даже пытаться заменить справочники по aria-атрибутам и эталонным примерам доступных компонентов. Стандарт W3C полон полезной информации, которая сдержанно подаёт только нужное. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

Использование LocalStorage для хранения данных на стороне клиента LocalStorage предоставляет простой способ хранения данных на стороне клиента, которые могут быть доступны после перезапуска браузера. #полезное

8 углубленных вопросов на собеседованиях на роль сеньора в JavaScript В этом материале мы покажем подробное объяснение некоторых важных вопросов на интервью по JavaScript. Моя цель будет состоять в том, чтобы тщательно объяснить эти вопросы, чтобы мы могли понять лежащие в их основе концепции. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

Использование WebGL для создания интерактивных 3D-график в веб-приложениях WebGL позволяет создавать интерактивные 3D-графики в веб-приложениях, и библиотека Three.js упрощает этот процесс. #полезное

Как сгенерировать безопасный, типизированный Node.js API с использованием Prisma, TypeGraphQL и graphql-query-purifier Создание эффективного Node.js API, обеспечивающего безопасность данных и типобезопасность, может быть сложной задачей. Это руководство демонстрирует процесс с использованием Prisma, TypeGraphQL и graphql-query-purifier. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

Использование Proxy для валидации объектов Proxy позволяет перехватывать и изменять операции над объектом, в данном случае используется для валидации значений. #полезное

Интересные трюки HTML. Экстремальный минимализм Мы уже много говорили про оптимизацию сайтов до минимального размера, преимущества статичного HTML, а также упаковку сайта (и веб-сервера) в портативный формат одного исполняемого файла, который нативно исполняется под любой ОС. Но стремление к минимизации может пойти дальше, если вы хотите поместить весь сайт в адресную строку браузера. А с помощью сокращателя ссылок даже большой сайт сжимается до восьми байт. В этом случае и хостинг не нужен. #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью

Использование MutationObserver для отслеживания изменений DOM-элементов MutationObserver позволяет отслеживать изменения в DOM-структуре и реагировать на них в коде. #полезное

Архитектура серверного рендеринга для SPA Серверный рендеринг обеспечивает быстрый и надежный доступ к контенту. В этом подходе веб-страницы формируются на сервере, а не в браузере пользователя. Это позволяет значительно ускорить время загрузки, что особенно критично для современных одностраничных приложений, известных как SPA (Single-Page Applications). #статья ❤️ Прожимай реакции, если нравится такой формат 👉 Читать статью