Привет, друзья!

В данном туториале я покажу вам, как тестировать компоненты на React с помощью Jest и Testing Library.

Список основных задач, которые мы решим на протяжении туториала:

1. Создание шаблона React-приложения с помощью Vite.
2. Создание компонента для получения приветствия от сервера.
3. Установка и настройка Jest.
4. Установка и настройка Testing Library.
5. Тестирование компонента с помощью Testing Library:
   
   1. Используя стандартные возможности.
   2. С помощью кастомного рендера.
   3. С помощью кастомных запросов.
6. Тестирование компонента с помощью снимков Jest.

Репозиторий с кодом проекта.

Если вам это интересно, прошу под кат.

В этом руководстве вы пройдете через процесс создания и публикации собственной библиотеки компонентов React и размещения ее на Github.

От переводчика: в статье автор демонстрирует как создать библиотеку с React компонентом внутри, подготовить её к публикации с помощью Rollup, опубликовать через npm, настроить StoryBook, настроить тестирование с использованием React Testing Library и Jest. В оригинальной статье есть ссылка на видеоверсию текущего урока.

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

Привет, друзья!

В этой статье я покажу вам, как создать полноценный сервис для аутентификации и авторизации (далее — просто сервис) с помощью Auth0.

Auth0 — это платформа, предоставляющая готовые решения для разработки сервисов любого уровня сложности. Auth0 поддерживается командой, стоящей за разработкой JWT (JSON Web Token/веб-токен в формате JSON). Это вселяет определенную уверенность в безопасности Auth0-сервисов.

Бесплатная версия Auth0 позволяет регистрировать до 7000 пользователей.

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

Знакомство с Auth0 можно начать отсюда.

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

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

В статье я расскажу только о самых основных возможностях, предоставляемых Auth0.

В примерах и на скриншотах ниже вы увидите реальные чувствительные данные/sensitive data. Это не означает, что вы сможете их использовать. После публикации статьи сервис будет удален.

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXX-X']);
_gaq.push(['_trackPageview']);

(function() {
 var ga = document.createElement('script');
 ga.src = ('https:' == document.location.protocol ? 'https://ssl' :
   'http://www') + '.google-analytics.com/ga.js';
 ga.setAttribute('async', 'true');
 document.documentElement.firstChild.appendChild(ga);
})();

• UserGide
• Как переехать со старого кода

qTip

Небольшая предыстория