Как преобразовать голосовые команды в код с помощью преобразования речи в текст

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

Я создал полностью основанное на JavaScript приложение преобразования речи в текст с использованием Web Speech API, React, Node и Express, чтобы доказать, что это возможно. Просто сказав несколько слов, я могу мгновенно вставить сегменты кода в свой редактор. Я даже могу изменять части этого кода с помощью динамических команд и говорить на разных языках.

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

Я не набирал ни одной буквы в этом предварительном просмотре, но у меня был новый компонент и различные шаблоны заполнителей для формы менее чем за 20 секунд. Я запустил приложение и просто произнес в микрофон слова component, email, check, toggle, quote и alert success. Приложение выбирает эти команды, находит соответствующие сопоставления, обновляет любые динамические части текста команды (например, тип «успех» для предупреждения) и вставляет код в мой редактор; довольно аккуратно.

Как это устроено

Первым шагом было найти программу преобразования речи в текст (вы можете использовать свою собственную, если хотите). Изначально у меня было приложение, работающее с Cloud Speech-to-Text Google, но я понял, что вы слишком быстро достигаете их бесплатных лимитов, а это означает, что в конечном итоге вы можете потратить довольно много денег. Поэтому я выбрал Web Speech API, который встроен в Chrome и полностью бесплатен. Чтобы использовать это, я создал простое приложение React с использованием библиотеки React Speech Recognition.

Затем я построил сопоставления, чтобы связать голосовые сообщения с фрагментами кода. Например, слово «компонент» соответствует шаблону функциональных компонентов React. И все, что будет взято после слова «компонент», будет использоваться в качестве имени компонента.

Затем мы можем отправить полученный шаблон на внутренний сервер Express для использования. Я использовал clipboardy, чтобы скопировать текст в буфер обмена моего компьютера, и robotjs, чтобы программно вставить текст, где бы я ни находился. Это копипастирование должно выполняться на внутреннем сервере, потому что браузеру не разрешено выполнять действия в вашей операционной системе (это было бы страшно).

И это все. Как только я запускаю интерфейсную и внутреннюю части, я могу нажать кнопку «Пуск» в пользовательском интерфейсе и оставить его работать в фоновом режиме. Пока я пишу код над проектами, мне просто нужно сказать несколько слов в микрофон, и предопределенный шаблон волшебным образом появится в моем редакторе (sugoi!).

Я также пробовал Speech API с разными языками. Английский был определенно самым плавным языком, который я тестировал, за ним следует испанский. Некоторые языки, такие как китайский и японский, имеют проблемы с определением конца речи Web Speech API. Таким образом, ваши результаты могут отличаться в зависимости от того, какой язык вы выберете.

Что еще он умеет?

Ну, почти все, что вы можете себе представить. Фреймворк в этом приложении может быть расширен для различных языков кодирования, голосового взаимодействия в пользовательском интерфейсе, команд npm или git, макросов на вашем компьютере, сценариев для автоматизации утомительных задач, интеграции IoT, чат-ботов и всего, что я даже не могу себе представить. Сейчас. Я включил инструкции о том, как добавить больше команд и разговорных языков в репозиторий, поэтому, если вы хотите внести свой вклад или разветвиться и поэкспериментировать с пользовательскими командами, пожалуйста, не стесняйтесь!