Направите једноставан фронт-енд за ДАЛЛ-Е АПИ и почните да експериментишете са садржајем генерисаним вештачком интелигенцијом данас.

Вештачка интелигенција се стално побољшава и сада може да створи запањујуће слике. Недавни вирални пример приказује најбогатије и најутицајније људе на свету у поцепаној одећи, који живе у сиротињским четвртима. Оно што је импресивно у вези са сликама је висок ниво детаља снимљених иу људима и њиховом окружењу.

Језички модели као што су ДАЛЛ-Е и Мидјоурнеи покрећу ове могућности генерисања слика, узимајући текстуалне описе као улаз и генеришући задивљујуће слике.

Научите како да интегришете ОпенАИ-јев ДАЛЛ-Е АПИ за генерисање слика у Реацт апликацији.

Генерисање слика коришћењем ОпенАИ-јевог ДАЛЛ-Е језичког модела

Како ДАЛЛ-Е језички модел заправо генерише слике? Не копајући превише у сложеност генерисања АИ слика, ДАЛЛ-Е прво тумачи текстуалне описе који су му достављени као улазе користећи обраду природног језика (НЛП). Затим даје реалистичну слику која се у потпуности подудара са датим описом.

instagram viewer

Упутства за унос могу укључивати текстуалне описе особе, објекта или сцене. Поред тога, може укључивати и детаље као што су одређена боја, облик и величина. Без обзира на сложеност или једноставност уносног текста, ДАЛЛ-Е ће генерисати слику која се у потпуности подудара са описом уноса.

Важно је напоменути да је језички модел, баш као и други модели, обучен на великом скупу података са милионима сликовних података да научите како да идентификујете и генеришете фотореалистичне слике из датих инпутс.

Почетак рада са ОпенАИ-јевим ДАЛЛ-Е АПИ-јем

ОпенАИ-јев ДАЛЛ-Е АПИ је доступан за употребу као јавна бета верзија. Да бисте интегрисали АПИ за коришћење у вашој Реацт апликацији, биће вам потребан кључ за ОпенАИ АПИ. Пређите на ОпенАИи пријавите се на страницу са прегледом налога да бисте преузели свој АПИ кључ.

Када се пријавите, кликните на икону корисничког профила у горњем десном делу странице са прегледом. Затим изаберите и кликните на Погледајте АПИ кључеве.

На страници подешавања АПИ кључева кликните на Креирајте нови тајни кључ дугме, наведите име за свој АПИ кључ и кликните на Направите тајни кључ да генеришете свој АПИ кључ.

Направите Реацт пројекат

Покрените наредбе испод на свом терминалу да бисте локално креирали нови Реацт пројекат. Напомена, требало би да имате инсталиран Ноде.јс.

Погледајте ова два чланка да бисте сазнали како инсталирајте Ноде.јс на Виндовс и како инсталирати Ноде.јс на Убунту.

мкдир Реацт-пројекат 
цд Реацт-пројекат
нпк цреате-реацт-апп имаге-генератор-апп
цд имаге-генератор-апп
нпм старт

Алтернативно, уместо да користите команду цреате-реацт-апп, можете користити Вите да бисте подесили свој Реацт пројекат. Вите је алатка за прављење дизајнирана за брзу и ефикасну израду веб апликација.

Интегришите ОпенАИ-јев ДАЛЛ-Е АПИ за генерисање слика

Када покренете и покренете своју Реацт апликацију, инсталирајте ОпенАИ-ову Ноде.јс библиотеку за коришћење у вашим Реацт апликацијама.

нпм инсталл опенаи

Затим, у основном директоријуму фасцикле вашег пројекта, креирајте нову .енв датотеку за чување вашег АПИ кључа.

РЕАЦТ_АПП_ОПЕНАИ_АПИ_КЕИ = „АПИ КЉУЧ“

Овде можете пронаћи код овог пројекта ГитХуб спремиште.

Направите компоненту генератора слика

У /src директоријум, креирајте нови фолдер, дајте му име компоненте, и креирајте нову датотеку унутар ње под називом ИмагеГенератор.јс. Додајте код испод у ову датотеку.

Започните увозом потребних модула:

увоз'../Апп.цсс'; 
увоз { усеСтате } из"реаговати"; 
увоз { Конфигурација, ОпенАИАпи } из"опенај";

Модул за конфигурацију конфигурише ОпенАИ АПИ клијент за употребу, док ОпенАИАпи модул обезбеђује методе за интеракцију са ОпенАИ АПИ-јем. Ова два модула омогућавају приступ и коришћење ДАЛЛ-Е-ових функција из Реацт апликације.

Затим дефинишите функционалну компоненту и додајте јој следећи код:

функцијаИмагеГенератор() {
конст [промпт, сетПромпт] = усеСтате("");
конст [резултат, сетРесулт] = усеСтате("");
конст [лоадинг, сетЛоадинг] = усеСтате(лажно);
конст [плацехолдер, сетПлацехолдер] = усеСтате(
„Потражите лава четком који слика слику Мона Лизе...“
 );


конст конфигурација = Нова Конфигурација({
 апиКеи: процесс.енв. РЕАЦТ_АПП_ОПЕНАИ_АПИ_КЕИ,
 });

конст опенаи = Нова ОпенАИАпи (конфигурација);

конст генератеИмаге = асинц () => {
 сетПлацехолдер(`Тражи ${промпт}..`);
 сетЛоадинг(истина);


покушати {
конст рес = чекати опенаи.цреатеИмаге({
 промпт: брз,
 н: 1,
 величина: "512к512",
 });
 сетЛоадинг(лажно);
 сетРесулт (рес.дата.дата[0].урл);
 } улов (грешка) {
 сетЛоадинг(лажно);
конзола.еррор(`Грешка при генерисању слике: ${еррор.респонсе.дата.еррор.мессаге}`);
 }
 };

Овај код дефинише Реацт функционалну компоненту под називом ИмагеГенератор. Компонента користи неколико променљивих стања за управљање промптом за унос, излазним резултатом, статусом учитавања и текстом чувара места.

Компонента такође ствара а конфигурацију објекат за ОпенАИ АПИ клијент, који укључује АПИ кључ преузет из променљиве окружења.

Асинхрони генератеИмаге функција ће се покренути када корисник кликне на дугме, пролазећи дуж корисничког упита.

Затим, позива на опенаи.цреатеИмаге метод за генерисање слике на основу датог упита. Овај метод враћа објекат одговора који укључује генерисани УРЛ слике.

Ако АПИ позив успе, код ажурира резултат променљиву стања са УРЛ-ом и поставља статус учитавања на лажно. Ако АПИ позив не успе, он и даље поставља статус учитавања на лажно, али такође евидентира поруку о грешци на конзоли.

На крају, рендерујте Реацт ЈСКС елементе који чине компоненту генератора слике.

повратак (
"контејнер">
 { лоадинг? (
 <>
Генерисање слике... Молимо сачекајте...</h3>
 </>
 ): (
 <>
Генеришите слику користећи Опен АИ АПИ</h2>




 цлассНаме="унос апликације"
 плацехолдер={плацехолдер}
 онЦханге={(е) => сетПромпт (е.таргет.валуе)}
 ровс="10"
 цолс="100"
 />




 { ресулт.ленгтх > 0? (
"слика резултата" срц={резултат} алт="резултат" />
 ): (
 <>
 </>
 )}
 </>
 )}
 </div>
 )
}


извозУобичајено ИмагеГенератор

Код ове компоненте условно приказује различите елементе на основу вредности лоадинг променљива стања.

Ако лоадинг је тачно, приказује поруку о учитавању. Насупрот томе, ако лоадинг је нетачан, приказује главни интерфејс за генерисање слике помоћу ОпенАИ АПИ-ја који се састоји од области за текст која хвата корисничке упите и дугмета за слање.

Тхе резултат променљива стања садржи генерисани УРЛ слике који се касније приказује у претраживачу.

Ажурирајте Апп.јс компоненту

Додајте овај код у своју Апп.јс датотеку:

увоз'./Апп.цсс';
увоз ИмагеГенератор из'./цомпонент/ИмагеГенератор';
функцијаАпликација() {
повратак (


"Апликација">
„Заглавље апликације“>

 </header>
 </div>
 );
}


извозУобичајено Апликација;

Сада можете да покренете развојни сервер да ажурирате промене и да се крећете до њега http://localhost: 3000 са својим претраживачем да бисте тестирали функционалност генерисања слика.

Да бисте добили најбоље могуће резултате када користите АИ алат за генерисање слике, обавезно наведите детаљан упит у пољу за текст. То значи да опишете слику што је могуће детаљније, не изостављајући детаље.

Овај процес се назива Промпт Енгинееринг и укључује пружање детаљних упутстава како би језички модел могао произвести најбоље резултате на основу датих корисничких инпута.

С обзиром на недавни пораст АИ софтвера доступног на тржишту, настављајући каријеру у Промпт Енгинеерингу може бити уносна прилика.

Максимизирајте моћ језичких модела у развоју софтвера

Алати вештачке интелигенције засновани на великим језичким моделима су освојили област развоја софтвера због својих невероватних карактеристика и могућности.

Ови алати поседују потенцијал да побољшају тренутни софтверски екосистем омогућавајући програмерима да интегришу сјајне АИ функције који побољшавају употребу различитих производа—користећи АИ технологију представља јединствену прилику за израду софтвера у иновативном начине.