Обновить
243.71

JavaScript *

Прототипно-ориентированный язык программирования

Сначала показывать
Порог рейтинга
Уровень сложности

Представляем вам Vue 3.3

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели17K

Сегодня мы рады объявить о релизе Vue 3.3 "Rurouni Kenshin"!

Этот выпуск сосредоточен на улучшении опыта разработки - в частности, на использовании SFC <script setup> с TypeScript. Вместе с релизом 1.6 Vue Language Tools (ранее известного как Volar) мы решили многие давние проблемы при использовании Vue с TypeScript.

В этом посте представлен обзор основных возможностей версии 3.3. Для получения полного списка изменений, пожалуйста, ознакомьтесь с полным журналом изменений на GitHub.

Читать далее

Запуск автотестов Cypress в Docker контейнерах с использованием различных Docker образов

Уровень сложностиПростой
Время на прочтение15 мин
Охват и читатели9.3K

Привет, Хабр!

В современном автоматизированном тестировании настройка и поддержка тестовой среды часто может стать трудоемкой задачей, особенно при работе со множественными зависимостями и их конфигурациями, различными операционными системами, библиотеками, инструментами и их версиями. Нередко на практике можно столкнуться с конфликтами зависимостей, рассогласованностью сред, ограничениями в масштабируемости и воспроизведении возникающих ошибок и т.д., что в конечном итоге приводит к непредсказуемости и ненадежности результатов тестирования. Использование Docker существенно помогает предотвратить возникновение большинства подобных проблем.

В данной статье описаны преимущества использования Docker в Cypress тестировании, в деталях рассмотрены существующие на сегодняшний день официальные образы Cypress, изложен механизм сборки настраиваемых Docker образов для запуска автотестов Cypress в Docker контейнерах, развертываемых на основе данных образов.

Надеюсь, что статья будет полезна для понимания основ использования контейнеризации в тестировании с помощью Cypress.

Читать далее

Удобства и боли рендеринга с React-pdf: опыт использования

Время на прочтение8 мин
Охват и читатели12K
Привет, Хабр! Меня зовут Алексей Сингур, я — фронтенд-разработчик в проекте KICS (Kaspersky Industrial CyberSecurity) for Networks «Лаборатории Касперского». Если коротко, то наш продукт защищает промышленные инфраструктуры и сети от киберугроз: анализирует трафик для выявления отклонений и обнаружения признаков сетевых атак, чтобы обеспечивать предприятию непрерывность процессов.

image

Одной из фичей KICS for Networks является генерация отчетов о сканировании инфраструктуры в формате PDF. При разработке этой фичи пришлось погрузиться в вопрос верстки и рендеринга PDF на Node.js. Речь пойдет об использовании для этих целей библиотеки React-pdf (в нашем проекте мы пока используем версию 2.1.1.), которая может показаться весьма экзотичной, если судить по количеству статей и отзывов в Интернете :)

Пост будет полезен веб-разработчикам для расширения кругозора в области инструментов рендеринга PDF, а также заинтересованным в генерации PDF-документов на стороне клиента или сервера.
Читать дальше →

Устраняем недостаток микрофронтендов: четыре способа коммуникации между frontend-приложениями

Уровень сложностиСредний
Время на прочтение5 мин
Охват и читатели7.2K

Микрофронтенды «выросли» из модного веяния web-разработки в технологию, которую активно используют на больших проектах. Микрофронтенд гибче монолита, может быстрее реагировать на непредвиденные ситуации и дорабатываться под запрос. Этот подход позволяет быстро расширять приложение и разрабатывать на разных фреймворках. Тем не менее один из ключевых недостатков технологии — сложность во взаимодействии между frontend-приложениями. 

Меня зовут Игорь, я frontend-разработчик SimbirSoft. Ранее мы с коллегами рассматривали вопрос построения архитектуры микрофронтендов. А в этой статье я разберу основные способы коммуникации между отдельными приложениями, которые можно применять в коммерческой разработке. Материал будет полезен разработчикам и архитекторам frontend-приложений.

Читать далее

React: революция использования фигурных скобочек

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели8.9K

Хорошо, react. Как много мы используем всего, потому что так исторически сложилось: пишем функции задом наперед (сначала объяви, потом вызывай). Оборачиваем все в стрелочные функции и константы с ними, когда достаточно именованной функции. Этот список можно хорошенько продолжить.

В этой статье хотелось бы обсудить несколько привычек, которые есть у нас всех и которые, возможно, пора переосмыслить.

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

Читать далее

Butterflynet. Обзор приложения с JS на Android

Уровень сложностиСредний
Время на прочтение4 мин
Охват и читатели2.8K

Чуть больше года назад у меня появилась идея сделать мобильное приложение, в котором можно будет писать код и смотреть результат прямо «не отходя от кассы». Для реализации такого «механизма» был выбран язык JS и HTML в качестве каркаса для представления. Разработка велась на Xamarin. Давайте посмотрим, что из этого вышло.

Читать далее

JavaScript для самых маленьких. Часть 2

Время на прочтение8 мин
Охват и читатели14K

Не так давно в блоге ЛАНИТ на Хабре мы представили вашему вниманию часть нашей методички по JavaScript. Сегодня же предлагаем ознакомиться с ещё одним блоком, который затрагивает самые базовые и необходимые понятия для тех, кто только начинает свой путь в мире JavaScript. Первую часть можно найти тут ― ну, чтобы всё слилось воедино. Продолжаем?

Читать далее

Алгоритмы поиска подстроки на JavaScript

Уровень сложностиСредний
Время на прочтение5 мин
Охват и читатели14K

Недавно я столкнулся с одной не очень сложной задачей на leetcode. В рамках задачи нужно было реализовать алгоритм поиска подстроки в строке. Пока я пытался сделать задачу, я понял, что я очень мало знаю про то как можно искать подстроку и решил изучить эту тему подробнее, и рассказать результат вам.

Как говорит Википедия «Поиск подстроки в строке — одна из простейших задач поиска информации», но это не совсем так, ниже я расскажу про разные алгоритмы решения и покажу примеры их реализации. Начнем!

Читать далее

Документирование API сервисов с помощью Swagger на примере фреймворков Express.js и Gin

Уровень сложностиСредний
Время на прочтение41 мин
Охват и читатели121K

В современных реалиях разработки программного обеспечения бывает достаточно трудно быстро и качественно написать техническую документацию к проекту, особенно когда данному процессу уделяется недостаточно времени по разным причинам: от временных ограничений, до индивидуальной непереносимости монотонного процесса участниками проектной группы, который, порой, может тормозить рабочие процессы.

Уже сейчас существуют инструменты, которые позволяют ускорить процесс документирования программного обеспечения. Эти инструменты значительно облегчают задачи разработчиков по ведению технической документации и внесению быстрых правок, что позволяет отражать в документации актуальные положения фактического поведения системы. В данной статье будет рассмотрен один из таких инструментов.

Основное внимание в статье будет уделено автоматизации процесса создания документации API сервисов, которые разрабатываются с помощью фреймворков Express.js и Gin, используя подходящий для этой задачи инструмент - Swagger.

Читать далее

Рендеринг модальных окон с помощью функций на Vue

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели6.5K

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

Вперед под кат

Вышел Chrome 113

Уровень сложностиПростой
Время на прочтение3 мин
Охват и читатели9.8K

Что вы узнаете:

WebGPU уже здесь, он позволяет использовать высокопроизводительную 3D-графику и параллельные вычисления в вебе.

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

Начинает распространяться First Party Sets, часть Privacy Sandbox, которая позволяет организациям объявлять связанные сайты.

И многое другое.

Читать далее

Расширенные концепции JavaScript для написания качественного, поддерживаемого кода

Уровень сложностиПростой
Время на прочтение15 мин
Охват и читатели9.7K

JavaScript является мощным языком программирования широко применяемым для веб‑разработки, написания серверных скриптов и много чего еще. Несмотря на простоту обучения для новичков, JavaScript также используется для создания сложных приложений и систем, требующих множества передовых концепций программирования.

В этой статье я буду объяснять некоторые из продвинутых концепций JavaScript, которые должны быть известны каждому опытному разработчику.

Читать далее

Как я написал удобную оболочку над электронным дневником

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели20K

Статья о том, как я в 15 лет облегчил работу с электронным дневником, представленным Кировской области в 2022 году.

Что получилось сделать и как это было реализовано.

Читать далее

Ближайшие события

Пишем свой хук для отслеживания изменений в LocalStorage

Уровень сложностиПростой
Время на прочтение2 мин
Охват и читатели14K

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

Были попытки отслеживания изменений через "window.addEventListener", но и тут меня ждала неудача, так как в этом случае отслеживание будет происходить только в другой вкладке браузера и тем самым я дошел до создания своего хука, назвал его - useLocalStorageEffect. Далее уже будем говорить о нем.

Читать далее

Я хотел улучшить React

Уровень сложностиСредний
Время на прочтение8 мин
Охват и читатели10K

Я давно пишу код, а React использую более пяти лет.

За это время у меня возникло несколько идей о том, как можно было бы улучшить React.

К реализации этих идей я приступил около трех лет назад. Сначала проверил концепцию, потом решил оформить всё в виде библиотеки.

А о том, что из этого вышло, я бы хотел рассказать в этой статье.

Читать далее

Загрузчик файлов для React

Уровень сложностиСложный
Время на прочтение13 мин
Охват и читатели13K

Пишем drag-and-drop загрузчик файлов для React приложения с помощью Context, подхода Compound components и нескольких кастомных хуков

Читать далее

Интересные трюки HTML, CSS и JS

Уровень сложностиСредний
Время на прочтение8 мин
Охват и читатели24K

Здесь вы найдёте небольшую подборку нестандартных вариантов использования HTML/CSS/JS. Если информация окажется полезной, будем собирать эти хаки на постоянной основе и публиковать по мере накопления.

Примечание. Некоторые трюки основаны на открытых уязвимостях браузеров и поисковой системы Google и др. Поэтому могут перестать работать в ближайшее время (или продолжат, если разработчики не признают баги и не захотят их исправлять). Другие функции работают только начиная с конкретных версий Chrome, Firefox и т. д.
Читать дальше →

Переключение цветовых тем в React приложении

Уровень сложностиСредний
Время на прочтение8 мин
Охват и читатели23K

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

Читать далее

Вклад авторов