HomeVideos

Agent Canvas Windows Install Guide (NPM, No Docker) + First AI Agent Chat

Now Playing

Agent Canvas Windows Install Guide (NPM, No Docker) + First AI Agent Chat

Transcript

201 segments

0:00

Agent Canvas is the latest way to use

0:02

open hands. Let's learn how to set it up

0:05

on Windows using NPM and then set up

0:08

GitHub and Slack integrations. Windows

0:10

installation with auto sandbox. You'll

0:12

need Node and UV installed. Please note

0:15

that if you run the agent server

0:17

directly on your machine without a

0:18

sandbox, the agent will have full access

0:21

to your file system. These are the

0:24

commands that you'll execute. Once you

0:25

have your terminal open, go ahead and

0:28

run NPM install {dash} G for global at

0:33

open hands {forward slash} agent {dash}

0:36

canvas.

0:36

>> [music]

0:36

>> Once agent canvas is fully installed,

0:40

then you can run agent {dash} canvas.

0:42

When you see localhost, you know you're

0:44

ready to get started. Getting started.

0:47

Setting up agent canvas and starting

0:49

your first chat. Navigate to

0:51

localhost:8000.

0:53

[music]

0:55

You'll then go ahead and go through the

0:56

prompts using your agents. I'm going to

0:59

choose open hands.

1:01

You'll check your back end. This time it

1:02

will be local. Just click next.

1:06

Then you'll pick your LLM provider. In

1:09

this case, we'll use Anthropic with the

1:11

Claude Opus 4.7. I'm going to input my

1:15

API key and click next.

1:18

From here, you can see our proven

1:20

workflows that you can try out with

1:23

linear, Slack, Notion,

1:26

or you can enter your own prompt. We're

1:28

going to create a basic web page

1:30

explaining what open hands can do. We're

1:33

going to click send and that will open

1:34

up a new conversation.

1:37

The agent [music] is going to start

1:38

working on the prompt given, in this

1:40

case creating a web page. It will reply

1:43

back in the chat, and you can preview

1:45

the web page on the right-hand side.

1:49

Getting started. Adding open hands cloud

1:52

back end. Let's go ahead and hover down

1:54

to the local area and click add back

1:57

[music] end.

1:59

We're then going to log in to Open Hands

2:02

Cloud. You'll see a new tab pop open

2:06

with some letters. That's the name of

2:08

this connection. You don't need to save

2:10

that. We're going to click authorize and

2:13

then we'll return back to our agent

2:16

canvas. Then you'll be able to see that

2:20

we are now connected to Open Hands

2:22

Cloud. Create an LLM profile.

2:26

First you'll want to navigate to your

2:27

settings and click LLM.

2:31

From there you'll click add LLM profile.

2:34

You can give that profile a nickname.

2:38

In this case we are going to call it

2:40

MiniMax.

2:42

From there you'll pick an LLM provider.

2:44

I'm going to pick Open Hands.

2:46

>> [music]

2:46

>> I'm going to pick the model MiniMax M.3

2:50

and I'm going to put my API key in

2:54

>> [music]

2:54

>> and click save.

2:56

Once you've saved, now you have a couple

2:59

of different LLM profiles and when you

3:01

create a new chat, you can pick which

3:04

profile you want to start with.

3:06

Creating an automation from [music]

3:08

scratch.

3:09

You can create an automation just by

3:11

starting a new chat. In this case

3:13

[music]

3:13

I'm going to create a new automation

3:15

where every day at

3:18

10:00 a.m. Eastern, I'm going to have

3:21

all my GitHub notifications [music]

3:24

summarized and presented to me in a

3:26

chat.

3:28

From there you can use any LLM model

3:32

that you want. I'm using GPT. If it's a

3:35

simpler request, you can also use

3:37

something like MiniMax.

3:39

And then the agent will go ahead and get

3:40

started on that task. Once it's done,

3:44

I'm going to return to the automate tab

3:46

and I'm going to go ahead and trigger it

3:48

to run now only for [music]

3:50

demonstration purposes.

3:52

Then a chat get kicked off. We're going

3:54

to open it to follow along and once it's

3:57

done, it'll return that summary of my

3:59

GitHub notifications.

4:01

In the future, you could even set it up

4:03

with Slack so that it would send you a

4:05

message. Adding an agent canvas to your

4:08

Slack server. You'll want to navigate to

4:11

api.slack.com/apps. You'll want to click

4:13

create an app

4:18

and then from scratch. You'll then need

4:20

to give this app a name. Whatever you

4:22

want is fine. And then you'll need to

4:25

pick a workspace. You'll need to be

4:27

admin of that workspace in order to

4:30

create an add an application.

4:33

Then click create app.

4:35

It'll have you return back to this page.

4:37

You'll want to scroll down and go to

4:39

OAuth and permissions.

4:42

Then you'll need to scroll down

4:45

and you're going [music] to want to add

4:46

an OAuth scope.

4:49

You'll see here that these are the

4:52

scopes that you need to add for this to

4:56

work.

4:57

Once you have all of them, scroll up to

5:00

install to dummy hands or whatever your

5:03

workspace is called and click allow.

5:06

Afterwards, you'll scroll down and

5:09

[music]

5:10

there will be a bot user OAuth token.

5:14

Please save that for later. [music]

5:16

Return to your workspace and click the

5:19

person icon.

5:21

From there, you'll want to go to the

5:23

integrations tab

5:25

and you're going to click add an app.

5:28

Once the new page opens up, you're going

5:32

to click add for the app which we named

5:36

agent hands. You'll want to return back

5:38

to agent canvas and click automate in

5:41

the left hand. You'll then click Slack

5:44

channel monitor. You're going to put in

5:46

your team [music] workspace ID, which

5:48

you can find in your URL, and you'll

5:51

also need to add that OAuth bot token we

5:54

saved earlier.

5:56

Once you click install, it'll open up a

5:58

new chat with a prompt. [music] If you'd

6:00

like, you can go ahead and change the

6:02

default name and then submit it to start

6:06

the chat.

6:13

The agent is going to come back and ask

6:16

you a few questions like what channel,

6:19

in this case we want general, and also

6:23

what name to monitor for, and we are

6:25

going to use Joe-Bot.

6:34

When it's done, you'll see something

6:36

similar to this be returned in your

6:38

chat. You can then navigate back to

6:41

Automate and click on that Slack channel

6:43

monitor to see that it is active.

6:47

>> [snorts]

6:47

>> Now we'll return back to our workspace

6:50

and go ahead and send a message [music]

6:52

for our bot.

6:57

Once the bot has seen this, it'll react

7:00

with some eyes and start a thread.

7:03

You can either go to the localhost URL

7:06

or wait for the agent [music]

7:08

to reply back with your answer in Slack.

7:10

Adding GitHub to your agent canvas.

7:13

First, navigate to the Automate tab side

7:17

and then go ahead and pick a GitHub

7:20

workflow that you want to implement. I'm

7:23

going to pick [music] the GitHub code

7:25

review and I'm going to input my

7:28

personal access token

7:30

>> [music]

7:30

>> and click install.

7:33

A new chat is going to open with a skill

7:35

and I'm going to enter

7:37

and then I will need to answer a few

7:39

questions like how often do I want this

7:44

automation to poll? I'm going to pick

7:46

every 5 minutes. I'm also going to have

7:49

the agent comment on PRs that are ready

7:51

for review, but not drafted.

7:54

And also put the agent's review as a

7:58

comment to that PR. [music] And then I'm

8:01

going to pick a repository for this

8:04

automation to monitor.

8:07

Now that the automation is done, just

8:09

for demonstration, I'm going to go ahead

8:11

and go back to the automate tab, and I'm

8:13

going to go ahead and click run now so

8:16

that I can get a review for my PR.

8:19

Once the job is done, I can go to GitHub

8:22

and I can check out the comment that was

8:23

left.

8:24

Join our Slack if you have any questions

8:26

or comments. Thanks so much for

8:28

watching.

Interactive Summary

This video provides a comprehensive guide on installing and utilizing Agent Canvas. It covers local Windows installation using NPM, setting up various LLM profiles, and creating custom automations. The tutorial also includes detailed walkthroughs for integrating external platforms like Slack for channel monitoring and GitHub for automated code reviews.

Suggested questions

4 ready-made prompts