react native ai

원시 AI에 반응합니다

크로스 플랫폼 모바일 AI 앱을 구축하기위한 전체 스택 프레임 워크 LLM 실시간 / 스트리밍 텍스트 및 채팅 UI, 이미지 서비스 및 자연스러운 언어를 여러 모델 및 이미지 처리를 지원합니다.

여기에서 비디오 자습서를 확인하십시오

특징

• OpenAi Chatgpt, Anthropic Claude, Cohere, Cohere Web, Gemini 및 Mistral에 대한 LLM 지원
• fal.ai가 제공하는 이미지 모델 배열
• 모든 공급자의 실시간 / 스트리밍 응답
• 코드 통역사 및 검색을 포함한 Openai 보조원
• Server Proxy는 선택한 인증 제공 업체와 인증 및 승인을 쉽게 활성화 할 수 있습니다.
• 테마 (5 개의 테마로 상자에서 나옵니다) - 몇 줄의 코드만으로 쉽게 추가 테마를 추가하십시오.
• 바이트 케일을 사용한 이미지 처리

용법

실행하여 새로운 프로젝트를 생성하십시오.

npx rn-ai

다음으로 CLI로 환경 변수를 구성하거나 나중에 그렇게하십시오.

앱 실행

앱 디렉토리로 변경하고 실행하십시오.

npm start

서버 실행

서버 디렉토리로 변경하고 실행 :

npm run dev

환경 변수

서버 환경 변수는 server/.env.example 에서 사용할 수 있습니다. 이미 존재하지 않으면이 파일 이름을 .env 로 업데이트하고 서버 환경 변수를 구성하십시오.

테마

새로운 테마를 추가하려면 app/src/theme.ts 열고 다음 구성으로 새로운 테마를 추가하십시오.

 const christmas = {
  // extend an existing theme or start from scratch
  ... lightTheme ,
  name : 'Christmas' ,
  label : 'christmas' ,
  tintColor : '#ff0000' ,
  textColor : '#378b29' ,
  tabBarActiveTintColor : '#378b29' ,
  tabBarInactiveTintColor : '#ff0000' ,
  placeholderTextColor : '#378b29' ,
}

파일 맨 아래에서 새 테마를 내보내십시오.

 export {
  lightTheme , darkTheme , hackerNews , miami , vercel , christmas
} 

LLM 모델 구성

다음은 새로 추가하거나 기존 LLM 모델을 제거하는 방법입니다.

앱에서

constants.ts 에서 MODELS 업데이트하여 모델을 추가하거나 구성 할 수 있습니다.

모델을 제거하려면 지원하지 않으려는 모델 만 제거하십시오.

모델을 추가하기 위해 모델 정의가 MODELS 배열에 추가되면 src/screens/chat.tsx 업데이트하여 새 모델을 지원해야합니다.

1. 새로운 모델 데이터를 보유 할 로컬 상태를 만듭니다
2. 새 모델 유형을 처리하려면 chat() 기능을 업데이트합니다
3. 새로운 모델을 호출하려면 generateModelReponse 함수를 만듭니다
4. utils.ts 의 getChatType 업데이트하여 서버 경로에 해당하는 LLM 유형을 구성하십시오.
5. UI에서 새 모델을 렌더링합니다

 {
  chatType . label . includes ( 'newModel' ) && (
    < FlatList
      data = { newModelReponse . messages }
      renderItem = { renderItem }
      scrollEnabled = { false }
    / >
  )
}

서버에서

모바일 앱에서 만든 모델 유형에 해당하는 server/src/chat 폴더에서 새 파일을 만듭니다. 다른 기존 경로에서 많은 스트리밍 코드를 복사하고 재사용하여 시작할 수 있습니다.

다음으로 server/src/chat/chatRouter 업데이트하여 새 경로를 사용하십시오.

이미지 모델 구성

다음은 새로 추가하거나 기존 이미지 모델을 제거하는 방법입니다.

앱에서

constants.ts 에서 IMAGE_MODELS 업데이트하여 모델을 추가하거나 구성 할 수 있습니다.

모델을 제거하려면 지원하지 않으려는 모델 만 제거하십시오.

모델을 추가하기 위해 모델 정의가 IMAGE_MODELS 배열에 추가되면 src/screens/images.tsx 업데이트하여 새 모델을 지원해야합니다.

주요 고려 사항은 입력입니다. 모델은 텍스트, 이미지 또는 둘 다 입력으로 가져 갑니까?

앱은 둘 다 처리하도록 구성되어 있지만 값을 API로 전달하려면 generate 기능을 업데이트해야합니다.

서버에서

fal.ai

server/src/images/fal 에서 새 모델을 고려하도록 처리기 기능을 업데이트하십시오.

다른 API 제공자

server/src/images/modelName 에서 새 파일을 만들고 새 API 호출을 처리하려면 핸들러 기능을 업데이트하십시오.

다음으로 server/src/images/imagesRouter 를 업데이트하여 새 경로를 사용하십시오.