0Pricing
React Academy · Урок

Соглашения для папки хуков и размещение тестов рядом с кодом

Создайте простое соглашение для хуков (префикс use*, чистая логика), размещайте хуки в папках функций, а тесты держите рядом с проверяемыми единицами.

«Соглашения для папки хуков и размещение тестов рядом с кодом» — бесплатный урок React Academy на CoddyKit. Это урок 2 из 3. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения React Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс React Academy содержит 3 уроков всего.

Зачем нужны соглашения для хуков

Цель: поддерживать хуки аккуратными и пригодными для тестирования.

  • Префиксы: use*
  • Чистая логика внутри хуков; интерфейс снаружи
  • Размещайте проверки рядом с соответствующими единицами

Идея структуры папок

  • features/counter/useCounter.js
  • features/counter/CounterPanel.jsx
  • features/counter/useCounter.test.jsx
  • ui/Button.jsx

Шаблон хука: useCounter

Хуки возвращают состояние + действия; поддерживайте интерфейс небольшим и предсказуемым.

<div id="root"></div>

Повторное использование шаблона хука: useToggle

Небольшие хуки легко повторно использовать. Два компонента используют одно и то же поведение useToggle.

<div id="root"></div>

Имитация теста: useCounter

Храните небольшой файл тестов рядом с хуком (например, useCounter.test.jsx). Здесь мы имитируем проверки утверждений.

<div id="root"></div>

Советы и контрольный список

  • Называйте хуки с префиксом use*
  • Храните хуки чистыми (без DOM) и возвращайте небольшой интерфейс
  • Размещайте тесты рядом с хуками/компонентами

Проверка основ размещения рядом

Почему следует размещать тесты рядом с проверяемым компонентом или хуком?

Итоги

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

Часто задаваемые вопросы

Урок «Соглашения для папки хуков и размещение тестов рядом с кодом» бесплатный?

Да — полный текст урока «Соглашения для папки хуков и размещение тестов рядом с кодом» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс React Academy, подпишись на CoddyKit PRO. Курс React Academy содержит 3 уроков всего.

Чему я научусь в уроке «Соглашения для папки хуков и размещение тестов рядом с кодом»?

Создайте простое соглашение для хуков (префикс use*, чистая логика), размещайте хуки в папках функций, а тесты держите рядом с проверяемыми единицами. Ты практикуешь React Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать React Academy?

Предыдущий опыт не требуется. React Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 3.

Сколько времени занимает урок «Соглашения для папки хуков и размещение тестов рядом с кодом»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке React Academy?

Да. Каждый урок React Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Папки функций и различия между UI-компонентами и составными компонентами
  2. Соглашения для папки хуков и размещение тестов рядом с кодом
  3. Рекомендации по рефакторингу
← Назад к React Academy