CLI для быстрой и удобной работы с React

Друзья! В данной статье я хочу рассказать вам об одном из моих проектов - CLI для создания элементов в React.

Вступление

Что такое CLI? Как гласит статья на википедии - это интерфейс командной строки (command line interface). Простыми словами - это такой интерфейс, в котором инструкции компьютеру даются путем ввода текстовых команд. Вводим команду в терминале, затем жмем "ввод" и получаем необходимый результат.

Зачем нужен CLI

В процессе работы над приложением возникает необходимость создавать различные файлы (компоненты, контейнеры и т.д.) и вписывать в них "начальную структуру файла", которая повторяется раз за разом. Так как мы, программисты, не любим повторять одно и тоже - я решил создать библиотеку, которая ускорит процесс разработки и избавит меня от обезьяньего труда.

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

Как это работает

На гитхаб и npm есть подробный Readme файл, в котором описаны команды и опции. Здесь же я познакомлю вас с общей идеей.

• Можно генерировать компоненты, хуки и фичи
• Есть поддержка TypeScript
• Другие опции (флаги) о которых вы можете узнать из Readme файла на github

Способ установки библиотеки стандартный для npm пакета:

npm install -g fx2-react-cli

Или при использовании yarn

yarn global add fx2-react-cli

Библиотека на данный момент поддерживает три команды создания элементов:

• gc - создать компонент
• gh - создать хук
• gf - создать feature (включает в себя такую структуру - компонент, контейнер, хук, экшн, редьюсер)

Пример:

Для того чтобы сгенерировать компонент Header, с использованием TS, в папке components/elements нужно прописать такую команду:

fx2 gc -t "components/elements/Header"

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

Ссылки на проект

• Github fx2-react-cli
• Npm

Послесловие

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

Это, конечно же, не призыв к тому, чтобы изобретать нескончаемое количество "велосипедов". Пользуйтесь тем что уже создано, но не бойтесь творить. Даже создание банальной, на первый взгляд, вещи может принести вам гораздо больше, чем вы думаете.