Klever One SDK

🚀

쉬운 사용성

처음부터 개발자 친화적으로 설계된 SDK입니다.
단 몇 줄의 코드로 디지털 휴먼을 임베딩하고 실시간 상호작용을 시작하세요.

🌍

어디서나 사용 가능

플랫폼 독립적인 웹 표준 기술을 사용합니다.
React, JavaScript 등 어떤 환경에서든 자유롭게 사용하세요.

⚡

TypeScript 완벽 지원

타입 안정성과 뛰어난 개발자 경험을 제공합니다.
자동완성, 타입 체킹, 인텔리센스로 빠르고 안전한 개발이 가능합니다.

간단한 코드로 시작하세요

Klever One SDK를 사용해 디지털 휴먼을 웹 애플리케이션에 통합하는 방법을 확인해보세요

React Hook 사용

"use client"
import { useRef, useEffect } from "react";
import { useKleverOneClient } from "@klever-one/web-sdk/react";

function MyApp() {
  const containerRef = useRef<HTMLDivElement>(null);
  const client = useKleverOneClient({
    apiKey: "your-api-key",
    container: containerRef.current,
  });

  const handleConnect = async () => {
    if (containerRef.current && client.client) {
      await client.connect();
    }
  };

  const handleDisconnect = () => {
    if (client.client) {
      client.disconnect();
    }
  };

  return (
    <div>
      <div ref={containerRef} style={{ width: "100%", height: "300px", background: "black" }} />
      <button onClick={handleConnect}>연결 시작</button>
      <button onClick={handleDisconnect}>연결 종료</button>
      <p>연결 상태: {client.state.connection}</p>
    </div>
  );
}

JavaScript

// 클라이언트 생성
const { KleverOneClient } = window.KleverOneSdk;
const client = new KleverOneClient({
  apiKey: 'your-api-key',
  container: document.getElementById('avatar-container'),
  callbacks: {
    onReady: () => {
      console.log('디지털 휴먼과 연결되었습니다!');
    },
    onMessageReceived: (message) => {
      console.log('메시지 수신:', message.content);
    }
  }
});

// 연결 및 사용
await client.connect();
// 텍스트 전송
await client.sendText('안녕하세요!');
// 음성 녹음 시작
await client.startRecording();

완전한 예제 프로젝트

다양한 환경과 상황에서 사용할 수 있는 실제 코드 예제들을 확인해보세요

📦

예시 코드

웹과 모바일 웹뷰 환경에서 바로 사용할 수 있는 완전한 HTML 예제 프로젝트를 NPM 패키지에서 확인할 수 있습니다.

SDK HTML 예제Flutter WebView 예제실시간 디지털 휴먼완전한 구현체

Examples 보기 가이드 시작하기

다양한 분야에서 활용하세요

Klever One SDK는 다양한 산업과 사용 사례에 맞춰 설계되었습니다

💬

웹 애플리케이션

고객 서비스 챗봇과 실시간 상담 기능

📚

교육 플랫폼

AI 튜터와 개인맞춤 학습 경험 제공

🎭

엔터테인먼트

가상 인플루언서와 인터랙티브 콘텐츠

🏢

기업 솔루션

브랜드 대사와 제품 시연 플랫폼