react native openai jsx

реакция-native-openai-jsx

⚛️ ? ? Используйте OpenAI для создания функционирующих компонентов React Native ! Посмотрите это в действии! ?

Можно использовать react-native-openai-jsx для создания реальных, работающих приложений React Native, просто предоставив некоторые высокоуровневые описания того, что вы хотели бы видеть.

Например:

 import { Alert } from 'react-native' ;
import { Prompt } from 'react-native-openai-jsx' ;

export default function App ( ) : JSX . Element {
  return (
    < Prompt
      extraProps = { React . useMemo ( ( ) => ( {
        onPress : ( message : string ) => Alert . alert ( message ) ,
      } ) , [ ] ) }
      prompt = { [
        'Provide a complete example of a React Native View component which contains a big Button in the center with the text "Press Me".' ,
        'When the Button is pressed, it must call a function prop passed into the component called onPress with the parameter "Hello from OpenAI!".' ,
      ] . join ( ' ' ) }
    / >
  ) ;
}

Это может показаться полным безумием, но это действительно работает ! Используя клиентскую библиотеку openai , мы можем использовать их сложную модель машинного обучения , чтобы представить себе функциональные приложения React Native. Во время выполнения мы можем использовать @babel/runtime для транспиляции автоматически сгенерированного модуля в удобный для выполнения JavaScript и его выполнения поверх react-native-wormhole .

Начиная

Во-первых, вам нужно установить react-native-openai-jsx и react-native-url-polyfill :

yarn add react-native-openai-jsx react-native-url-polyfill

Пока идет загрузка, вам необходимо создать ключ клиентского API для OpenAI, если у вас его еще нет. Инструкции о том, как это сделать, вы можете найти здесь .

Примечание. Вам понадобится react-native-url-polyfill , чтобы включить совместимость с официальным SDK openai .

Затем в корне вашего приложения импортируйте полифилы в точку входа вашего приложения, то есть:

 + import 'react-native-url-polyfill/auto';

import { AppRegistry } from 'react-native';
import App from './src/App';
import { name as appName } from './app.json';

AppRegistry.registerComponent(appName, () => App);

Это должно быть все!

Чтобы увидеть все это воедино, вы можете попробовать example приложения:

 cd example/
OPENAI_API_KEY="<your-api-key>" yarn (ios|android|web)

? Конфигурация

Компонент <Prompt /> предоставляет все возможности интерфейса, позволяющие создавать и настраивать подсказки вашей собственной языковой модели.

Имя	Тип	Описание	Значение по умолчанию
prompt	string?	Текстовая строка, используемая для предложения модели машинного обучения, какое приложение создать.	Условие, предназначенное для вычисления пустого React.Fragment .
completionSettings	CompletionSettings	Объект CreateCompletionRequest .	Необходимый
style	StyleProp<ViewStyle>?		undefined
debug	boolean?	Используется для отображения ошибок во время транспиляции и предварительного просмотра ответов, сгенерированных OpenGPT.	false
extraProps	<T>	Пользовательский объект, который можно использовать для передачи в OpenGPT. Например, вы можете передать функцию обратного вызова и сообщить модели машинного обучения, что она существует в качестве возможного реквизита.	{}
Wormhole	React.FC	Wormhole . Это можно использовать для включения поддержки дополнительных библиотек, таких как react-native-svg .	DefaultWormhole

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

✌️ Лицензия

Массачусетский технологический институт