James Devonport | Cloudflare Workers for Bubble Apps | Bubble.io
Summary
TLDRВ этом видео Джеймс рассматривает Cloudflare Workers и их преимущества для разработчиков без кода, особенно при использовании Bubble. Он демонстрирует, как легко настроить и использовать Workers для выполнения задач AI с помощью OpenAI, а также возвращает структурированные данные в Bubble. Джеймс также обсуждает стоимость и безопасность использования Cloudflare Workers, предлагая идеи для дальнейшего изучения и использования.
Takeaways
- 🌐 Cloudflare Workers - это небольшая программа, работающая на сети Cloudflare и выполняющаяся очень быстро.
- 🔐 Workers может хранить переменные, включая зашифрованные API-ключи для безопасности.
- 🛠️ Workers предоставляет пространство для хранения ключевых значений, что может быть полезно для хранения записей и быстрого доступа к ним.
- 📈 Cloudflare Workers подходит для выполнения быстрых задач, особенно для работы с AI и возврата структурированных данных в Bubble.
- 💼 В данном примере Workers используется для вызова конечных точек OpenAI Chat и возврата структурированных данных в JSON.
- 💻 Редактор Cloudflare Workers имеет разделы для кода, тестирования запросов, просмотра ошибок сети и консоли для отладки.
- 💰 Cloudflare Workers предоставляет 100 000 бесплатных запросов в день с очень низкой стоимостью CPU времени, что делает его экономичным решением.
- 🔗 Можно создать Cloudflare Worker, который будет отправлять POST-запросы с текстом резюме в OpenAI и возвращать структурированные данные в Bubble.
- 🔑 В Cloudflare Workers можно добавить переменную для API-ключа OpenAI и зашифровать ее для безопасности.
- 📝 Пример использования Workers включает в себя создание кода с помощью Claude, развертывание и тестирование в Cloudflare, а затем подключение к Bubble через API-коннектор.
Q & A
Что такое Cloudflare Workers?
-Cloudflare Workers - это небольшая программа, которая запускается в сети Cloudflare. Это эффективно кусочек JavaScript, который выполняется в облаке и может обрабатывать запросы с использованием HTTP GET или POST.
Какие преимущества Cloudflare Workers предоставляет для разработчиков?
-Cloudflare Workers предоставляет возможность выполнять код на краю сети Cloudflare, что обеспечивает высокую скорость. Он также имеет доступ к API для выполнения сетевых запросов и может использоваться для интеграции с различными сервисами и API.
Как Cloudflare Workers может быть полезен для разработчиков без знания кодирования?
-Cloudflare Workers упрощает интеграцию с AI и обработку данных, что может быть полезно для разработчиков без опыта программирования. Он позволяет создавать сложные функции и интеграции с минимальным кодированием.
Какие возможности предоставляет Cloudflare Workers для работы с Bubble?
-Cloudflare Workers может быть использован для выполнения задач AI и возврата структурированных данных в Bubble. Это может быть полезно для обработки данных, таких как резюме, и преобразования их в удобочитаемый формат.
Что такое переменные в Cloudflare Workers и как их использовать?
-Переменные в Cloudflare Workers используются для хранения информации, такой как ключи API. Они могут быть зашифрованы для обеспечения безопасности и легко настроены через панель управления Cloudflare Workers.
Какие функции хранения данных предоставляет Cloudflare Workers?
-Cloudflare Workers имеет встроенный кэш для хранения данных. Хотя в видео не рассказано об этом подробно, он предоставляет возможность быстрого доступа к данным на крупном масштабе.
Какие цены на Cloudflare Workers и какие лимиты существуют?
-Cloudflare Workers предлагает 100 000 бесплатных запросов в день с 10 миллисекундами CPU на вызов. Для более высоких потребностей существует платный план, начинающийся с 5 долларов в месяц.
Как установить Cloudflare Worker и как он взаимодействует с Bubble?
-Для установки Cloudflare Worker нужно войти в аккаунт Cloudflare, создать новый Worker и развернуть его. Затем Worker можно подключить к Bubble через API-коннектор и отправлять в него POST-запросы с данными для обработки.
Что такое пример использования Cloudflare Workers с OpenAI?
-В видео приведен пример, где Cloudflare Worker использует OpenAI для извлечения информации из резюме и возврата ее в структурированном JSON. Это показывает, как Worker может интегрироваться с AI для выполнения сложных задач.
Какие дополнительные возможности Cloudflare Workers можно исследовать в будущем?
-В будущем можно исследовать использование Cloudflare Workers для подключения к базам данных, группировки AI-запросов и выполнения анализа на их основе. Это может быть полезно для создания более сложных и мощных приложений.
Outlines
🌐 Введение в Cloudflare Workers
В этом разделе Джеймс представляет Cloudflare Workers как полезный инструмент для разработчиков без кода, особенно при работе с Bubble. Он рассматривает Workers как быстрые, маленькие программы, запускаемые на сети Cloudflare, и способные обрабатывать запросы через HTTP. Джеймс также отмечает, что Workers могут быть использованы для выполнения задач с AI, возвращая структурированные данные в Bubble. Он подчеркивает, что Workers просты в использовании и могут снизить нагрузку на рабочие процессы, делая их более доступными и экономичными.
🔑 Создание Cloudflare Worker для извлечения данных с резюме
Джеймс демонстрирует процесс создания Cloudflare Worker, который будет извлекать ключевую информацию из резюме и возвращать ее в виде структурированного JSON-объекта. Он использует сервис Claude для генерации кода Worker и обьявления переменной для ключа API OpenAI. В этом разделе также рассматривается использование JSON-моделей OpenAI для возврата данных и отправка POST-запроса с текстом резюме в Worker для дальнейшего обработки.
🛠 Тестирование и развертывание Worker в Cloudflare
В этом разделе Джеймс копирует сгенерированный код Worker из Claude в Cloudflare и начинает процесс тестирования. Он добавляет переменную с ключом API OpenAI, чтобы Worker мог обращаться к сервису OpenAI. После развертывания Worker тестируется с помощью примера POST-запроса с текстом резюме. Тестирование показывает, что Worker успешно извлекает данные и возвращает их в структурированном формате JSON.
🌀 Интеграция Worker с Bubble и дополнительные возможности
Джеймс продемонстрирует, как настроить Worker в Bubble, используя API-коннектор. Он копирует URL Worker и настраивает новый вызов в Bubble, который отправляет POST-запрос с текстом резюме. Результаты, возвращаемые Worker, структурированы и готовы к использованию в Bubble. В заключении Джеймс рекомендует добавить защиту Worker, например, с использованием ключей API, и отмечает, что в будущих выпусках будет рассмотрено использование Workers для более сложных задач, таких как соединение с базами данных и группировка запросов к OpenAI.
Mindmap
Keywords
💡Cloudflare Workers
💡No code developer
💡Bubble
💡AI
💡OpenAI
💡API
💡JSON
💡Post request
💡API connector
💡Encrypt
Highlights
Introduction to Cloudflare Workers and their usefulness in a toolkit for no code developers.
Cloudflare Workers are small programs that run on Cloudflare's network, effectively JavaScript in the cloud.
Workers run extremely fast and can handle GET or POST requests, accessing the internet like a workflow in Bubble.
Workers can interact with other services and APIs, exemplified by using OpenAI chat endpoints.
Workers can store variables securely, including API keys.
Workers have a KeyValue Store for data storage at a massive scale.
Workers are ideal for quick jobs, especially AI tasks, and returning structured data to Bubble.
Workers reduce workflow utilization and are more affordable than other solutions.
Cloudflare offers 100,000 free requests per day with each invocation having 10 milliseconds of CPU time.
Paid accounts start at $5 a month with competitive pricing.
Building a Cloudflare Worker to connect to Bubble through the API connector.
The process of creating a Cloudflare Worker involves writing code and deploying it.
Using Claude to generate Cloudflare Worker code for extracting key info from a resume.
Setting up variables in Cloudflare to secure API keys.
Testing the Cloudflare Worker with a sample resume to ensure it extracts and returns structured JSON.
Integrating the Cloudflare Worker with Bubble using the API connector.
Using the Cloudflare Worker to process a resume text and return a structured JSON in Bubble.
Adding security to the Worker by requiring an API key for execution.
Option to run Workers from a custom domain for a more professional setup.
Future episodes will cover more advanced uses of Cloudflare Workers, including database connections and batch AI requests.
Transcripts
hey there it's James here uh today we're
going to be taking a look at Cloud flare
workers and why I think they're such a
useful thing to have in your toolkit uh
as a no code developer particularly when
working with bubble uh they're really
handy for doing really cool stuff with
AI um so this is the session uh that I
did for Devo we had some technical
issues on that day I think cloud flare
were deploying a load of changes to
workers because it looks uh totally
different now so uh it's all working
great again so I thought I'd re-record
everything and we could just go through
exactly how it works it's really easy to
get started so yeah let's take a
look so let's dive into it I've put
together just a couple of simple slides
just to introduce cloudflare workers and
kind of explain a little bit more what
they actually are so um at the most
simple level what they are is it's a
small program that runs on cloud Flair's
network uh so it's effectively uh a bit
of JavaScript uh in our example anyway
that's going to run uh in the cloud uh
they run extremely fast uh and when you
so you can access it by kind of get
request or post request uh and then it
itself it has access to to do Network
requests itself so you can kind of think
of it a bit like a workflow in bubble uh
on the public internet so it can do
pretty much anything workflow in bubble
can do but obviously you've got access
to doing all sorts of more advanced
stuff uh with with custom code in there
can talk to other services uh and apis
so like in this example today we're
going to use uh open AI chats uh chat
endpoints to to do uh our request so the
worker is going to handle all of that
for us uh it can have variables uh so
you can put things like API Keys uh into
variables and encrypt them to keep them
secure uh we'll cover that again today
it's really easy to use uh it does have
a key Value Store as well um we're not
going to cover that today but we
probably will in the future but it's
basically a free data store uh so if you
need to store records and and have quick
access to them at a massive scale uh
this could be worth looking at uh so
it's it's it's got that built in but
really it's just a great way to do very
quick uh jobs I I think it's
particularly useful for doing AI tasks
uh and returning structured data to
Bubble so if you've watched any of my
previous editions where we've tried to
deal with
uh running requests to open Ai and then
paing the Json that we get back it can
be a bit of a faf in bubble uh so I
think this is a really good alternative
uh it's really easy to set up and use
and I use it in multiple of my own apps
and it's it's been absolutely amazing of
course it also is going to help reduce
on your workflow uh utilization because
all this uh AI jobs are going to be
happening in Cloud flare so uh yeah it's
it's a lot more
affordable um just to give you quick
preview of what the actual editor is
going to look like when we go into it
just at very high level the bit on the
left there is where the actual code goes
uh so this is where we're going to put
the code uh that our work is going to
run uh and on the right section there
you've basically got a little test panel
so this is where you can run test
requests against the worker see how they
perform see what the output is and also
you've got your kind of network tab
there so you can see any errors and
you've got the console errors and all
that kind of stuff in there um which
again is quite useful because if you do
get an error you we're going to just
take that straight out and put it back
into the AI uh to update our our code
and fix any errors so really works well
the other great thing about workers is
they're just insanely cheap uh for uh
getting up and started so you get uh
100,000 requests free every day uh with
10 millisecond milliseconds of CPU time
per invocation I personally don't really
go over that even with some of my more
complex things that uh little workers
that I've built and then if you do want
to get get a paid account it starts at
$5 a month and as you can see the
pricing is extremely extremely
competitive like I don't think there'd
be a cheaper way of doing these kind of
things uh that I've come
across so just at a very high level what
we're going to do today uh we're going
to build a cloud flare worker uh that uh
that're we're going to connect to from
Bubble so we're going to connect to it
through the API connector in bubble and
we're going to send it uh a post request
which is going to contain the text of uh
a resume so we're just going to have all
the text of the resume send it into the
cloudflare worker and then in the
cloudflare worker we're going to call
openai uh give it that text and ask
openai to return us a structured Json of
all the of all the data that's in that
resum so this is just to give you a bit
of an example of the kind of stuff you
can do obvious we can get way more
complex but um I think this is a good
example uh and then so we're then going
to return that structured Json that we
get back from open AI back to Bubble so
effectively in bubble we're going to
make our request with our our resum and
we're going to get back a really nicely
formatted block of Json uh with all the
data from that resumé formatted in a
nice way that we can then go on and use
in bubble uh and the API connector is
going to pick up all those fields and
and let us use them
so uh with that said let's dive into
Cloud flare and get
started so uh I've logged into my
cloudflare account and to go to workers
uh we're got to go down here on the left
and you'll see there's a whole section
for workers there's absolutely loads of
stuff uh but we're going to go to the
overview and we're just going to hit the
create uh a worker uh button uh and then
we're just going to create a blank
worker to get us
started I'm going to call our worker uh
resume
AI
extractor and I'm just going to hit
deploy and that's basically just going
to set us up uh a blank worker with some
kind of boilerplate code in it uh that
will let us just get started uh with
with kind of getting everything set up
so once we've got our worker here you
can see you've got the URL for it
already so this is the URL that we're
going to use in the bubble API connector
later but let's just get started with
actually putting the worker together so
I'm going to press the edit code button
uh and then we've open up here with our
worker in that uh in that mode that I
showed you
earlier and we've just got our kind of
boiler plate code here uh that is set us
off so we can just delete that to get
started so we're going to generate our
uh our code for this worker with uh
Claude so we're going to use anthropics
Claude uh you can also use chat G
I found Claude works really well with
this so let's just head over into
Claude and I've re uh already written my
prompt so I'm going to take my prompt
and put it in
here and uh I'm just going to talk you
through the prompt uh in a bit of detail
just to kind of explain uh what what I'm
actually asking for here because I think
it's quite useful to know uh what the
The Prompt is actually doing so you can
see here we're saying uh I want to
create a cloud flare worker which
extracts key info from a resume and
returns it as a structured Json object
the the cloudflare worker variable for
the open AI key is open AI key under
with big caps underscore I'll show you
where we're going to set that up later
basically that's what that what we're
saying there is we want to make our API
key a variable uh that we're going to
set in the cloud flare dashboard but it
means that we're not just putting our
API key into the code which we probably
wouldn't want to do we want to keep it a
bit more secure uh and encrypt it so
we're going to do it in Cloud flare and
that's just telling it what we want to
call the variable so we want to call it
open AI API key super
simple um I'm going to declare that I
want to use the open a open AI model uh
GPT 40 mini um sometimes this will try
and just use a random model because they
they're not always aware of the latest
things so I just always declare what
model I want to use um which just keeps
it kind of
simple uh we want to use uh open AI Json
mode to return structured data so we're
we're telling it okay I want you to make
sure you set up the API call to open AI
to use Json mode just to make sure we're
forcing it to return uh
Json and uh I want to make a post
request to the worker with an object
containing the text from a resume and
then I've just made a simple example
kind of Json object so this is what I
want to send into the worker a little uh
post request with this string here which
is going to be the actual resume super
simple uh and then the last thing here
is is I say uh I want the worker to
return a standard structure of data from
a resume you should Define the structure
so I'm just doing that to keep this easy
um but probably in your own use case you
may have adjacent structure you've
already got that You' put in here and
you say I want this exact structure back
uh but I'm just going to let claw
generate it so I'm just going to hit go
there and we're going to uh see what
Claude does so it's going to write all
the code for our worker here it's
probably not going to be that long uh
and we can see we've got our worker code
there and it's also given us uh an
example post request uh that we can do
as well later
um and it's it explains in detail what
the work is actually doing here uh so
yeah so now pretty much what we can do
is we can take this code copy it from
here go over to
cloudflare paste in our
code and uh that is all in there ready
to go now so first of all we're going to
just see that this is just basically
it's not going to work because first of
all we're we're not doing the proper
request here yet but also we haven't put
our API key in yet so what I'm going to
do is I'm just going to hit hit de
deploy up here basically that's just
going to save where we are with this and
then I'm going to go back into Cloud
flare into the settings for this worker
so this is all the code that is just
recently changed which I think was
changed the other day when I was doing
my demo um but all of this is different
now so uh we want to add in a variable
so this is the variable that we
described in that prompt earlier so this
is going to be our open AI API key and
I've got a quick test key that I'm going
to use
here put that in here I'm going to
delete that afterwards obviously and
then if you want it to be encrypted you
can hit the encrypt button here and that
will keep it secret uh so it can't be
seen uh and then you just hit deploy
down here and that will save that that
variable so now when that worker runs
and it looks for the open AI API key uh
it's going to know it's going to have it
there be able to to use it so I'm now
going to head back into edit the code so
we're going to go back into our worker
and now we're actually going to test it
so fingers crossed this should actually
just work uh the first time but
obviously uh we just need a test resume
to send into it so I'm just going to ask
Claude for this this is is the easiest
way uh can you give me
a example resume post request to test
with uh and then uh claude's just going
to generate a uh an example resume for
me here that I can use to test it but
you might already have your own one um
so yeah I'm just going to grab that head
back into Cloud flare and in our right
pain here we're going to say okay let's
test this we know we want to do a post
request so we're going send a post into
this and we're going to paste in the
body uh that resume that we just did so
second I paste that in the worker is
going to start
running uh and we should see in a second
uh yeah there we go there's our uh Jason
so uh the work has run uh open AI has
extracted all this data here and you can
see we've got a lovely structured Jason
uh with all of that uh data so uh we've
got it all in a nice format that we can
can then go and use so next step is we
want to go and set this up uh in bubble
which again going to be super super
simple uh and let's uh get started with
that so uh to get this set up in bubble
what I'm going to do first is I'm going
to copy this uh URL here so this is the
URL of our Cloud flare worker and I'm
going to head over into bubble into the
API connector
and in here I've just set up a uh a new
API call for cloud flare and I'm just
going to say add another
call and in here I'm going to say uh
let's just call this our resumé
extractor and it's going to be a post
request and I'm going to put in our
Cloud flare URL there and then I'm
actually just going to go and copy that
exact same call that we just did to
Cloud flare here so I'm going to copy
this
uh just make sure you've deployed this
by the way because obviously to call it
externally you need to make sure you've
uh you've deployed it uh and then I'm
going to head back into bubble Post in
our resume string here and then uh all I
should need to do now is hit initialize
call and what that's going to do is run
that cloud flare worker which in turn is
going to run its open aai job extract
the data from our uh resume and there we
go we can see it's returned to us our
lovely structured Jason so we've got our
name summary all the education skills
all in a really really perfect format
for us to use in bubble uh so I'm going
to hit save and that's it uh a very very
high level uh that's how you can use
cloudflare workers to do stuff now
obviously you could then go in and start
doing uh a lot more with this uh you
could you could update the prompt to
start doing more analysis and things
like that and the other thing thing I
would recommend is you add some security
uh onto your worker uh so maybe by
adding uh like an API key that you need
to run it uh but we'll probably cover
that in in a future uh Edition just to
make sure that you've got uh some
security on your worker and not just
anyone can run it but again very easy
don't need to write any code you can do
it all through uh just with with Claude
going back and forth uh and putting
another variable in Cloud flare the
other thing to note is in Cloud flare if
you want uh you can also run this from
your own domain so uh by default it runs
on this this workers. Dev domain but if
you want to you can go in and hook up
your own domain so you could have this
as
resume. yourown domain.com and run it
from that which is the recommended way
of doing it uh and there is a ton more
stuff in here uh that we could dive into
and we probably will in future episodes
so if you found this useful let me know
um because I'd love to cover this more
in more detail because obviously I've
used this for for much more advanced
things like connecting to databases
looping AI requests so batching up
multiple calls to open Ai and doing
analysis on all of them and that kind of
thing so this is just kind of an intro
just to show you kind of the workers
dashboard how to put your code in there
how to run it uh and how to then set it
up in bubble I think you know it's
probably a lot easier than you may have
thought at the beginning hopefully um
but this is a really really really
useful thing uh to have in your tool
belt uh and it's again super cost
effective so I hope you found this
episode uh useful drop me uh a reply
with any questions or feedback or
anything or anything else you'd like us
to cover we're going to cover lots more
stuff like this uh over the next few
weeks uh particularly with doing AI
stuff related to Bubble so that's it for
this week thank you very much bye-bye
浏览更多相关视频
ИЗУЧИТЕ ГЛАВНУЮ НЕЙРОСЕТЬ МИРА от Б до Ю
ЭКОНОМИЯ ВРЕМЕНИ И ДЕНЕГ ПРИ ВЫБОРЕ НЕЙРОСЕТИ (МОДЕЛИ ТИПА LLM)
Трейдинг по Смарт Мани+Голдбах: MMxM
Старт в программировании за 15 секунд. Как и с чего начать свой путь
Обновленный Selenium и работа с прокси | Python, Selenium и proxy | Подмена IP адреса
Глава 1 Базовый Синтаксис ; День 36 ; 36.2
5.0 / 5 (0 votes)