스테이블 디퓨전으로 AI 이미지 생성하는 리액티브 자바스크립트 만들기

모두가 아는 것처럼 생성형 AI가 최근 엄청난 인기를 끌고 있다. 오픈AI의 챗GPT, 구글 바드와 같은 텍스트 생성기가 대표적이다. 이외에도 텍스트 투 이미지(text-to-image) 생성기가 있는데, 이 분야에서 여기서 가장 앞서 나가는 것이 오픈소스 이미지 생성 AI 시스템인 스테이블 디퓨전(Stable Diffusion)이다. 여기서는 스테이블 디퓨전의 무료 평가판 API를 사용해 서비스에 연결해 작동하는 React.js 클라이언트를 만들어 보자. 

스테이블 디퓨전 시작하기 

스테이블 디퓨전은 깃허브 리포지토리에서 받을 수 있다. 호스팅되는 스테이블 디퓨전 설치본과 상호작용하기 위한 엔드포인트를 제공하는 여러 프로젝트가 있으므로 직접 모델을 설정하고 학습시키지 않아도 된다. 가장 좋은 스테이블 디퓨전 인터페이스 중 하나는 무료 평가판을 제공하는 스테이블 디퓨전 API다. 이 API를 사용해 무료 오픈소스 프론트 엔드 자바스크립트 라이브러리인 리액트로 스테이블 디퓨전과 상호작용할 수 있다.

먼저 create-react-app 명령줄 툴을 사용해 새 리액트 애플리케이션을 시작한다. 이를 위해서는 노드(Node)와 NPM을 미리 설치해야 한다. 그런 다음 $ npm i -g create-react-app으로 create-react-app을 설치한다. 이제 $ create-react-app react-sd 명령으로 간단한 애플리케이션을 만들 수 있다. 테스트하려면 react-sd 디렉터리로 이동해 $ npm start를 입력한 다음 시작 페이지인 localhost:3000을 방문한다.