mirror of
https://github.com/aljazceru/opencode.git
synced 2025-12-23 02:34:21 +01:00
wip: zen
This commit is contained in:
20
cloud/app/src/routes/docs/[...path].ts
Normal file
20
cloud/app/src/routes/docs/[...path].ts
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
import type { APIEvent } from "@solidjs/start/server"
|
||||||
|
|
||||||
|
async function handler(evt: APIEvent) {
|
||||||
|
const req = evt.request.clone()
|
||||||
|
const url = new URL(req.url)
|
||||||
|
const targetUrl = `https://dev.opencode.ai${url.pathname}${url.search}`
|
||||||
|
const response = await fetch(targetUrl, {
|
||||||
|
method: req.method,
|
||||||
|
headers: req.headers,
|
||||||
|
body: req.body,
|
||||||
|
})
|
||||||
|
return response
|
||||||
|
}
|
||||||
|
|
||||||
|
export const GET = handler
|
||||||
|
export const POST = handler
|
||||||
|
export const PUT = handler
|
||||||
|
export const DELETE = handler
|
||||||
|
export const OPTIONS = handler
|
||||||
|
export const PATCH = handler
|
||||||
20
cloud/app/src/routes/docs/index.ts
Normal file
20
cloud/app/src/routes/docs/index.ts
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
import type { APIEvent } from "@solidjs/start/server"
|
||||||
|
|
||||||
|
async function handler(evt: APIEvent) {
|
||||||
|
const req = evt.request.clone()
|
||||||
|
const url = new URL(req.url)
|
||||||
|
const targetUrl = `https://dev.opencode.ai${url.pathname}${url.search}`
|
||||||
|
const response = await fetch(targetUrl, {
|
||||||
|
method: req.method,
|
||||||
|
headers: req.headers,
|
||||||
|
body: req.body,
|
||||||
|
})
|
||||||
|
return response
|
||||||
|
}
|
||||||
|
|
||||||
|
export const GET = handler
|
||||||
|
export const POST = handler
|
||||||
|
export const PUT = handler
|
||||||
|
export const DELETE = handler
|
||||||
|
export const OPTIONS = handler
|
||||||
|
export const PATCH = handler
|
||||||
20
cloud/app/src/routes/s/[id].ts
Normal file
20
cloud/app/src/routes/s/[id].ts
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
import type { APIEvent } from "@solidjs/start/server"
|
||||||
|
|
||||||
|
async function handler(evt: APIEvent) {
|
||||||
|
const req = evt.request.clone()
|
||||||
|
const url = new URL(req.url)
|
||||||
|
const targetUrl = `http://dev.opencode.ai/docs${url.pathname}${url.search}`
|
||||||
|
const response = await fetch(targetUrl, {
|
||||||
|
method: req.method,
|
||||||
|
headers: req.headers,
|
||||||
|
body: req.body,
|
||||||
|
})
|
||||||
|
return response
|
||||||
|
}
|
||||||
|
|
||||||
|
export const GET = handler
|
||||||
|
export const POST = handler
|
||||||
|
export const PUT = handler
|
||||||
|
export const DELETE = handler
|
||||||
|
export const OPTIONS = handler
|
||||||
|
export const PATCH = handler
|
||||||
@@ -1,11 +1,10 @@
|
|||||||
|
import "./[id].css"
|
||||||
import { Billing } from "@opencode/cloud-core/billing.js"
|
import { Billing } from "@opencode/cloud-core/billing.js"
|
||||||
import { Key } from "@opencode/cloud-core/key.js"
|
import { Key } from "@opencode/cloud-core/key.js"
|
||||||
import { action, createAsync, query, useAction, useSubmission, json } from "@solidjs/router"
|
import { action, createAsync, query, useAction, useSubmission, json } from "@solidjs/router"
|
||||||
import { createSignal, For, onMount, Show } from "solid-js"
|
import { createSignal, For, Show } from "solid-js"
|
||||||
import { getActor } from "~/context/auth"
|
|
||||||
import { withActor } from "~/context/auth.withActor"
|
import { withActor } from "~/context/auth.withActor"
|
||||||
import { IconCopy, IconCheck } from "~/component/icon"
|
import { IconCopy, IconCheck } from "~/component/icon"
|
||||||
import "./[id].css"
|
|
||||||
import { User } from "@opencode/cloud-core/user.js"
|
import { User } from "@opencode/cloud-core/user.js"
|
||||||
import { Actor } from "@opencode/cloud-core/actor.js"
|
import { Actor } from "@opencode/cloud-core/actor.js"
|
||||||
|
|
||||||
@@ -63,7 +62,7 @@ const createPortalUrl = action(async (returnUrl: string) => {
|
|||||||
return withActor(() => Billing.generatePortalUrl({ returnUrl }))
|
return withActor(() => Billing.generatePortalUrl({ returnUrl }))
|
||||||
}, "portalUrl")
|
}, "portalUrl")
|
||||||
|
|
||||||
export default function() {
|
export default function () {
|
||||||
|
|
||||||
/////////////////
|
/////////////////
|
||||||
// Keys section
|
// Keys section
|
||||||
|
|||||||
@@ -34,7 +34,7 @@ export const api = new sst.cloudflare.Worker("Api", {
|
|||||||
})
|
})
|
||||||
|
|
||||||
export const web = new sst.cloudflare.x.Astro("Web", {
|
export const web = new sst.cloudflare.x.Astro("Web", {
|
||||||
domain,
|
domain: "docs." + domain,
|
||||||
path: "packages/web",
|
path: "packages/web",
|
||||||
environment: {
|
environment: {
|
||||||
// For astro config
|
// For astro config
|
||||||
|
|||||||
@@ -12,6 +12,7 @@ import { spawnSync } from "child_process"
|
|||||||
// https://astro.build/config
|
// https://astro.build/config
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
site: config.url,
|
site: config.url,
|
||||||
|
base: "/docs",
|
||||||
output: "server",
|
output: "server",
|
||||||
adapter: cloudflare({
|
adapter: cloudflare({
|
||||||
imageService: "passthrough",
|
imageService: "passthrough",
|
||||||
@@ -59,44 +60,36 @@ export default defineConfig({
|
|||||||
replacesTitle: true,
|
replacesTitle: true,
|
||||||
},
|
},
|
||||||
sidebar: [
|
sidebar: [
|
||||||
"docs",
|
"",
|
||||||
"docs/config",
|
"config",
|
||||||
"docs/providers",
|
"providers",
|
||||||
"docs/enterprise",
|
"enterprise",
|
||||||
"docs/troubleshooting",
|
"troubleshooting",
|
||||||
|
|
||||||
{
|
{
|
||||||
label: "Usage",
|
label: "Usage",
|
||||||
items: [
|
items: ["tui", "cli", "ide", "zen", "share", "github", "gitlab"],
|
||||||
"docs/tui",
|
|
||||||
"docs/cli",
|
|
||||||
"docs/ide",
|
|
||||||
"docs/zen",
|
|
||||||
"docs/share",
|
|
||||||
"docs/github",
|
|
||||||
"docs/gitlab"
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
label: "Configure",
|
label: "Configure",
|
||||||
items: [
|
items: [
|
||||||
"docs/rules",
|
"rules",
|
||||||
"docs/agents",
|
"agents",
|
||||||
"docs/models",
|
"models",
|
||||||
"docs/themes",
|
"themes",
|
||||||
"docs/keybinds",
|
"keybinds",
|
||||||
"docs/commands",
|
"commands",
|
||||||
"docs/formatters",
|
"formatters",
|
||||||
"docs/permissions",
|
"permissions",
|
||||||
"docs/lsp",
|
"lsp",
|
||||||
"docs/mcp-servers",
|
"mcp-servers",
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
label: "Develop",
|
label: "Develop",
|
||||||
items: ["docs/sdk", "docs/server", "docs/plugins"],
|
items: ["sdk", "server", "plugins"],
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
components: {
|
components: {
|
||||||
|
|||||||
@@ -1,311 +0,0 @@
|
|||||||
---
|
|
||||||
title: Intro
|
|
||||||
description: Get started with opencode.
|
|
||||||
---
|
|
||||||
|
|
||||||
import { Tabs, TabItem } from "@astrojs/starlight/components"
|
|
||||||
|
|
||||||
[**opencode**](/) is an AI coding agent built for the terminal.
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
Let's get started.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
#### Prerequisites
|
|
||||||
|
|
||||||
To use opencode, you'll need:
|
|
||||||
|
|
||||||
1. A modern terminal emulator like:
|
|
||||||
|
|
||||||
- [WezTerm](https://wezterm.org), cross-platform
|
|
||||||
- [Alacritty](https://alacritty.org), cross-platform
|
|
||||||
- [Ghostty](https://ghostty.org), Linux and macOS
|
|
||||||
- [Kitty](https://sw.kovidgoyal.net/kitty/), Linux and macOS
|
|
||||||
|
|
||||||
2. API keys for the LLM providers you want to use.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Install
|
|
||||||
|
|
||||||
The easiest way to install opencode is through the install script.
|
|
||||||
|
|
||||||
```bash
|
|
||||||
curl -fsSL https://opencode.ai/install | bash
|
|
||||||
```
|
|
||||||
|
|
||||||
You can also install it with the following:
|
|
||||||
|
|
||||||
- **Using Node.js**
|
|
||||||
|
|
||||||
<Tabs>
|
|
||||||
<TabItem label="npm">
|
|
||||||
```bash
|
|
||||||
npm install -g opencode-ai
|
|
||||||
```
|
|
||||||
</TabItem>
|
|
||||||
<TabItem label="Bun">
|
|
||||||
```bash
|
|
||||||
bun install -g opencode-ai
|
|
||||||
```
|
|
||||||
</TabItem>
|
|
||||||
<TabItem label="pnpm">
|
|
||||||
```bash
|
|
||||||
pnpm install -g opencode-ai
|
|
||||||
```
|
|
||||||
</TabItem>
|
|
||||||
<TabItem label="Yarn">
|
|
||||||
```bash
|
|
||||||
yarn global add opencode-ai
|
|
||||||
```
|
|
||||||
</TabItem>
|
|
||||||
</Tabs>
|
|
||||||
|
|
||||||
- **Using Homebrew on macOS and Linux**
|
|
||||||
|
|
||||||
```bash
|
|
||||||
brew install sst/tap/opencode
|
|
||||||
```
|
|
||||||
|
|
||||||
- **Using Paru on Arch Linux**
|
|
||||||
|
|
||||||
```bash
|
|
||||||
paru -S opencode-bin
|
|
||||||
```
|
|
||||||
|
|
||||||
#### Windows
|
|
||||||
|
|
||||||
Right now the automatic installation methods do not work properly on Windows. However you can grab the binary from the [Releases](https://github.com/sst/opencode/releases).
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Configure
|
|
||||||
|
|
||||||
With opencode you can use any LLM provider by configuring their API keys.
|
|
||||||
|
|
||||||
We recommend signing up for [Claude Pro](https://www.anthropic.com/news/claude-pro) or [Max](https://www.anthropic.com/max), it's the most cost-effective way to use opencode.
|
|
||||||
|
|
||||||
Once you've signed up, run `opencode auth login` and select Anthropic.
|
|
||||||
|
|
||||||
```bash
|
|
||||||
$ opencode auth login
|
|
||||||
|
|
||||||
┌ Add credential
|
|
||||||
│
|
|
||||||
◆ Select provider
|
|
||||||
│ ● Anthropic (recommended)
|
|
||||||
│ ○ OpenAI
|
|
||||||
│ ○ Google
|
|
||||||
│ ○ Amazon Bedrock
|
|
||||||
│ ○ Azure
|
|
||||||
│ ○ DeepSeek
|
|
||||||
│ ○ Groq
|
|
||||||
│ ...
|
|
||||||
└
|
|
||||||
```
|
|
||||||
|
|
||||||
Alternatively, you can select one of the other providers. [Learn more](/docs/providers#directory).
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Initialize
|
|
||||||
|
|
||||||
Now that you've configured a provider, you can navigate to a project that
|
|
||||||
you want to work on.
|
|
||||||
|
|
||||||
```bash
|
|
||||||
cd /path/to/project
|
|
||||||
```
|
|
||||||
|
|
||||||
And run opencode.
|
|
||||||
|
|
||||||
```bash
|
|
||||||
opencode
|
|
||||||
```
|
|
||||||
|
|
||||||
Next, initialize opencode for the project by running the following command.
|
|
||||||
|
|
||||||
```bash frame="none"
|
|
||||||
/init
|
|
||||||
```
|
|
||||||
|
|
||||||
This will get opencode to analyze your project and create an `AGENTS.md` file in
|
|
||||||
the project root.
|
|
||||||
|
|
||||||
:::tip
|
|
||||||
You should commit your project's `AGENTS.md` file to Git.
|
|
||||||
:::
|
|
||||||
|
|
||||||
This helps opencode understand the project structure and the coding patterns
|
|
||||||
used.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Usage
|
|
||||||
|
|
||||||
You are now ready to use opencode to work on your project. Feel free to ask it
|
|
||||||
anything!
|
|
||||||
|
|
||||||
If you are new to using an AI coding agent, here are some examples that might
|
|
||||||
help.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Ask questions
|
|
||||||
|
|
||||||
You can ask opencode to explain the codebase to you.
|
|
||||||
|
|
||||||
:::tip
|
|
||||||
Use the `@` key to fuzzy search for files in the project.
|
|
||||||
:::
|
|
||||||
|
|
||||||
```txt frame="none" "@packages/functions/src/api/index.ts"
|
|
||||||
How is authentication handled in @packages/functions/src/api/index.ts
|
|
||||||
```
|
|
||||||
|
|
||||||
This is helpful if there's a part of the codebase that you didn't work on.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Add features
|
|
||||||
|
|
||||||
You can ask opencode to add new features to your project. Though we first recommend asking it to create a plan.
|
|
||||||
|
|
||||||
1. **Create a plan**
|
|
||||||
|
|
||||||
opencode has a _Plan mode_ that disables its ability to make changes and
|
|
||||||
instead suggest _how_ it'll implement the feature.
|
|
||||||
|
|
||||||
Switch to it using the **Tab** key. You'll see an indicator for this in the lower right corner.
|
|
||||||
|
|
||||||
```bash frame="none" title="Switch to Plan mode"
|
|
||||||
<TAB>
|
|
||||||
```
|
|
||||||
|
|
||||||
Now let's describe what we want it to do.
|
|
||||||
|
|
||||||
```txt frame="none"
|
|
||||||
When a user deletes a note, we'd like to flag it as deleted in the database.
|
|
||||||
Then create a screen that shows all the recently deleted notes.
|
|
||||||
From this screen, the user can undelete a note or permanently delete it.
|
|
||||||
```
|
|
||||||
|
|
||||||
You want to give opencode enough details to understand what you want. It helps
|
|
||||||
to talk to it like you are talking to a junior developer on your team.
|
|
||||||
|
|
||||||
:::tip
|
|
||||||
Give opencode plenty of context and examples to help it understand what you
|
|
||||||
want.
|
|
||||||
:::
|
|
||||||
|
|
||||||
2. **Iterate on the plan**
|
|
||||||
|
|
||||||
Once it gives you a plan, you can give it feedback or add more details.
|
|
||||||
|
|
||||||
```txt frame="none"
|
|
||||||
We'd like to design this new screen using a design I've used before.
|
|
||||||
[Image #1] Take a look at this image and use it as a reference.
|
|
||||||
```
|
|
||||||
|
|
||||||
:::tip
|
|
||||||
Drag and drop images into the terminal to add them to the prompt.
|
|
||||||
:::
|
|
||||||
|
|
||||||
opencode can scan any images you give it and add them to the prompt. You can
|
|
||||||
do this by dragging and dropping an image into the terminal.
|
|
||||||
|
|
||||||
3. **Build the feature**
|
|
||||||
|
|
||||||
Once you feel comfortable with the plan, switch back to _Build mode_ by
|
|
||||||
hitting the **Tab** key again.
|
|
||||||
|
|
||||||
```bash frame="none"
|
|
||||||
<TAB>
|
|
||||||
```
|
|
||||||
|
|
||||||
And asking it to make the changes.
|
|
||||||
|
|
||||||
```bash frame="none"
|
|
||||||
Sounds good! Go ahead and make the changes.
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Make changes
|
|
||||||
|
|
||||||
For more straightforward changes, you can ask opencode to directly build it
|
|
||||||
without having to review the plan first.
|
|
||||||
|
|
||||||
```txt frame="none" "@packages/functions/src/settings.ts" "@packages/functions/src/notes.ts"
|
|
||||||
We need to add authentication to the /settings route. Take a look at how this is
|
|
||||||
handled in the /notes route in @packages/functions/src/notes.ts and implement
|
|
||||||
the same logic in @packages/functions/src/settings.ts
|
|
||||||
```
|
|
||||||
|
|
||||||
You want to make sure you provide a good amount of detail so opencode makes the right
|
|
||||||
changes.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### Undo changes
|
|
||||||
|
|
||||||
Let's say you ask opencode to make some changes.
|
|
||||||
|
|
||||||
```txt frame="none" "@packages/functions/src/api/index.ts"
|
|
||||||
Can you refactor the function in @packages/functions/src/api/index.ts?
|
|
||||||
```
|
|
||||||
|
|
||||||
But you realize that it is not what you wanted. You **can undo** the changes
|
|
||||||
using the `/undo` command.
|
|
||||||
|
|
||||||
```bash frame="none"
|
|
||||||
/undo
|
|
||||||
```
|
|
||||||
|
|
||||||
opencode will now revert the changes you made and show your original message
|
|
||||||
again.
|
|
||||||
|
|
||||||
```txt frame="none" "@packages/functions/src/api/index.ts"
|
|
||||||
Can you refactor the function in @packages/functions/src/api/index.ts?
|
|
||||||
```
|
|
||||||
|
|
||||||
From here you can tweak the prompt and ask opencode to try again.
|
|
||||||
|
|
||||||
:::tip
|
|
||||||
You can run `/undo` multiple times to undo multiple changes.
|
|
||||||
:::
|
|
||||||
|
|
||||||
Or you **can redo** the changes using the `/redo` command.
|
|
||||||
|
|
||||||
```bash frame="none"
|
|
||||||
/redo
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Share
|
|
||||||
|
|
||||||
The conversations that you have with opencode can be [shared with your
|
|
||||||
team](/docs/share).
|
|
||||||
|
|
||||||
```bash frame="none"
|
|
||||||
/share
|
|
||||||
```
|
|
||||||
|
|
||||||
This will create a link to the current conversation and copy it to your clipboard.
|
|
||||||
|
|
||||||
:::note
|
|
||||||
Conversations are not shared by default.
|
|
||||||
:::
|
|
||||||
|
|
||||||
Here's an [example conversation](https://opencode.ai/s/4XP1fce5) with opencode.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Customize
|
|
||||||
|
|
||||||
And that's it! You are now a pro at using opencode.
|
|
||||||
|
|
||||||
To make it your own, we recommend [picking a theme](/docs/themes), [customizing the keybinds](/docs/keybinds), [configuring code formatters](/docs/formatters), [creating custom commands](/docs/commands), or playing around with the [opencode config](/docs/config).
|
|
||||||
@@ -3,7 +3,7 @@ title: Enterprise
|
|||||||
description: Using opencode in your organization.
|
description: Using opencode in your organization.
|
||||||
---
|
---
|
||||||
|
|
||||||
import config from "../../../../config.mjs"
|
import config from "../../../config.mjs"
|
||||||
export const email = `mailto:${config.email}`
|
export const email = `mailto:${config.email}`
|
||||||
|
|
||||||
opencode does not store any of your code or context data. This makes it easy for
|
opencode does not store any of your code or context data. This makes it easy for
|
||||||
@@ -1,12 +1,311 @@
|
|||||||
---
|
---
|
||||||
title: opencode
|
title: Intro
|
||||||
description: The AI coding agent built for the terminal.
|
description: Get started with opencode.
|
||||||
template: splash
|
|
||||||
hero:
|
|
||||||
title: The AI coding agent built for the terminal.
|
|
||||||
tagline: The AI coding agent built for the terminal.
|
|
||||||
image:
|
|
||||||
dark: ../../assets/logo-ornate-dark.svg
|
|
||||||
light: ../../assets/logo-ornate-light.svg
|
|
||||||
alt: opencode logo
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
import { Tabs, TabItem } from "@astrojs/starlight/components"
|
||||||
|
|
||||||
|
[**opencode**](/) is an AI coding agent built for the terminal.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
Let's get started.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
#### Prerequisites
|
||||||
|
|
||||||
|
To use opencode, you'll need:
|
||||||
|
|
||||||
|
1. A modern terminal emulator like:
|
||||||
|
|
||||||
|
- [WezTerm](https://wezterm.org), cross-platform
|
||||||
|
- [Alacritty](https://alacritty.org), cross-platform
|
||||||
|
- [Ghostty](https://ghostty.org), Linux and macOS
|
||||||
|
- [Kitty](https://sw.kovidgoyal.net/kitty/), Linux and macOS
|
||||||
|
|
||||||
|
2. API keys for the LLM providers you want to use.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Install
|
||||||
|
|
||||||
|
The easiest way to install opencode is through the install script.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -fsSL https://opencode.ai/install | bash
|
||||||
|
```
|
||||||
|
|
||||||
|
You can also install it with the following:
|
||||||
|
|
||||||
|
- **Using Node.js**
|
||||||
|
|
||||||
|
<Tabs>
|
||||||
|
<TabItem label="npm">
|
||||||
|
```bash
|
||||||
|
npm install -g opencode-ai
|
||||||
|
```
|
||||||
|
</TabItem>
|
||||||
|
<TabItem label="Bun">
|
||||||
|
```bash
|
||||||
|
bun install -g opencode-ai
|
||||||
|
```
|
||||||
|
</TabItem>
|
||||||
|
<TabItem label="pnpm">
|
||||||
|
```bash
|
||||||
|
pnpm install -g opencode-ai
|
||||||
|
```
|
||||||
|
</TabItem>
|
||||||
|
<TabItem label="Yarn">
|
||||||
|
```bash
|
||||||
|
yarn global add opencode-ai
|
||||||
|
```
|
||||||
|
</TabItem>
|
||||||
|
</Tabs>
|
||||||
|
|
||||||
|
- **Using Homebrew on macOS and Linux**
|
||||||
|
|
||||||
|
```bash
|
||||||
|
brew install sst/tap/opencode
|
||||||
|
```
|
||||||
|
|
||||||
|
- **Using Paru on Arch Linux**
|
||||||
|
|
||||||
|
```bash
|
||||||
|
paru -S opencode-bin
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Windows
|
||||||
|
|
||||||
|
Right now the automatic installation methods do not work properly on Windows. However you can grab the binary from the [Releases](https://github.com/sst/opencode/releases).
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Configure
|
||||||
|
|
||||||
|
With opencode you can use any LLM provider by configuring their API keys.
|
||||||
|
|
||||||
|
We recommend signing up for [Claude Pro](https://www.anthropic.com/news/claude-pro) or [Max](https://www.anthropic.com/max), it's the most cost-effective way to use opencode.
|
||||||
|
|
||||||
|
Once you've signed up, run `opencode auth login` and select Anthropic.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
$ opencode auth login
|
||||||
|
|
||||||
|
┌ Add credential
|
||||||
|
│
|
||||||
|
◆ Select provider
|
||||||
|
│ ● Anthropic (recommended)
|
||||||
|
│ ○ OpenAI
|
||||||
|
│ ○ Google
|
||||||
|
│ ○ Amazon Bedrock
|
||||||
|
│ ○ Azure
|
||||||
|
│ ○ DeepSeek
|
||||||
|
│ ○ Groq
|
||||||
|
│ ...
|
||||||
|
└
|
||||||
|
```
|
||||||
|
|
||||||
|
Alternatively, you can select one of the other providers. [Learn more](/docs/providers#directory).
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Initialize
|
||||||
|
|
||||||
|
Now that you've configured a provider, you can navigate to a project that
|
||||||
|
you want to work on.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
cd /path/to/project
|
||||||
|
```
|
||||||
|
|
||||||
|
And run opencode.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
opencode
|
||||||
|
```
|
||||||
|
|
||||||
|
Next, initialize opencode for the project by running the following command.
|
||||||
|
|
||||||
|
```bash frame="none"
|
||||||
|
/init
|
||||||
|
```
|
||||||
|
|
||||||
|
This will get opencode to analyze your project and create an `AGENTS.md` file in
|
||||||
|
the project root.
|
||||||
|
|
||||||
|
:::tip
|
||||||
|
You should commit your project's `AGENTS.md` file to Git.
|
||||||
|
:::
|
||||||
|
|
||||||
|
This helps opencode understand the project structure and the coding patterns
|
||||||
|
used.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Usage
|
||||||
|
|
||||||
|
You are now ready to use opencode to work on your project. Feel free to ask it
|
||||||
|
anything!
|
||||||
|
|
||||||
|
If you are new to using an AI coding agent, here are some examples that might
|
||||||
|
help.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Ask questions
|
||||||
|
|
||||||
|
You can ask opencode to explain the codebase to you.
|
||||||
|
|
||||||
|
:::tip
|
||||||
|
Use the `@` key to fuzzy search for files in the project.
|
||||||
|
:::
|
||||||
|
|
||||||
|
```txt frame="none" "@packages/functions/src/api/index.ts"
|
||||||
|
How is authentication handled in @packages/functions/src/api/index.ts
|
||||||
|
```
|
||||||
|
|
||||||
|
This is helpful if there's a part of the codebase that you didn't work on.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Add features
|
||||||
|
|
||||||
|
You can ask opencode to add new features to your project. Though we first recommend asking it to create a plan.
|
||||||
|
|
||||||
|
1. **Create a plan**
|
||||||
|
|
||||||
|
opencode has a _Plan mode_ that disables its ability to make changes and
|
||||||
|
instead suggest _how_ it'll implement the feature.
|
||||||
|
|
||||||
|
Switch to it using the **Tab** key. You'll see an indicator for this in the lower right corner.
|
||||||
|
|
||||||
|
```bash frame="none" title="Switch to Plan mode"
|
||||||
|
<TAB>
|
||||||
|
```
|
||||||
|
|
||||||
|
Now let's describe what we want it to do.
|
||||||
|
|
||||||
|
```txt frame="none"
|
||||||
|
When a user deletes a note, we'd like to flag it as deleted in the database.
|
||||||
|
Then create a screen that shows all the recently deleted notes.
|
||||||
|
From this screen, the user can undelete a note or permanently delete it.
|
||||||
|
```
|
||||||
|
|
||||||
|
You want to give opencode enough details to understand what you want. It helps
|
||||||
|
to talk to it like you are talking to a junior developer on your team.
|
||||||
|
|
||||||
|
:::tip
|
||||||
|
Give opencode plenty of context and examples to help it understand what you
|
||||||
|
want.
|
||||||
|
:::
|
||||||
|
|
||||||
|
2. **Iterate on the plan**
|
||||||
|
|
||||||
|
Once it gives you a plan, you can give it feedback or add more details.
|
||||||
|
|
||||||
|
```txt frame="none"
|
||||||
|
We'd like to design this new screen using a design I've used before.
|
||||||
|
[Image #1] Take a look at this image and use it as a reference.
|
||||||
|
```
|
||||||
|
|
||||||
|
:::tip
|
||||||
|
Drag and drop images into the terminal to add them to the prompt.
|
||||||
|
:::
|
||||||
|
|
||||||
|
opencode can scan any images you give it and add them to the prompt. You can
|
||||||
|
do this by dragging and dropping an image into the terminal.
|
||||||
|
|
||||||
|
3. **Build the feature**
|
||||||
|
|
||||||
|
Once you feel comfortable with the plan, switch back to _Build mode_ by
|
||||||
|
hitting the **Tab** key again.
|
||||||
|
|
||||||
|
```bash frame="none"
|
||||||
|
<TAB>
|
||||||
|
```
|
||||||
|
|
||||||
|
And asking it to make the changes.
|
||||||
|
|
||||||
|
```bash frame="none"
|
||||||
|
Sounds good! Go ahead and make the changes.
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Make changes
|
||||||
|
|
||||||
|
For more straightforward changes, you can ask opencode to directly build it
|
||||||
|
without having to review the plan first.
|
||||||
|
|
||||||
|
```txt frame="none" "@packages/functions/src/settings.ts" "@packages/functions/src/notes.ts"
|
||||||
|
We need to add authentication to the /settings route. Take a look at how this is
|
||||||
|
handled in the /notes route in @packages/functions/src/notes.ts and implement
|
||||||
|
the same logic in @packages/functions/src/settings.ts
|
||||||
|
```
|
||||||
|
|
||||||
|
You want to make sure you provide a good amount of detail so opencode makes the right
|
||||||
|
changes.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Undo changes
|
||||||
|
|
||||||
|
Let's say you ask opencode to make some changes.
|
||||||
|
|
||||||
|
```txt frame="none" "@packages/functions/src/api/index.ts"
|
||||||
|
Can you refactor the function in @packages/functions/src/api/index.ts?
|
||||||
|
```
|
||||||
|
|
||||||
|
But you realize that it is not what you wanted. You **can undo** the changes
|
||||||
|
using the `/undo` command.
|
||||||
|
|
||||||
|
```bash frame="none"
|
||||||
|
/undo
|
||||||
|
```
|
||||||
|
|
||||||
|
opencode will now revert the changes you made and show your original message
|
||||||
|
again.
|
||||||
|
|
||||||
|
```txt frame="none" "@packages/functions/src/api/index.ts"
|
||||||
|
Can you refactor the function in @packages/functions/src/api/index.ts?
|
||||||
|
```
|
||||||
|
|
||||||
|
From here you can tweak the prompt and ask opencode to try again.
|
||||||
|
|
||||||
|
:::tip
|
||||||
|
You can run `/undo` multiple times to undo multiple changes.
|
||||||
|
:::
|
||||||
|
|
||||||
|
Or you **can redo** the changes using the `/redo` command.
|
||||||
|
|
||||||
|
```bash frame="none"
|
||||||
|
/redo
|
||||||
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Share
|
||||||
|
|
||||||
|
The conversations that you have with opencode can be [shared with your
|
||||||
|
team](/docs/share).
|
||||||
|
|
||||||
|
```bash frame="none"
|
||||||
|
/share
|
||||||
|
```
|
||||||
|
|
||||||
|
This will create a link to the current conversation and copy it to your clipboard.
|
||||||
|
|
||||||
|
:::note
|
||||||
|
Conversations are not shared by default.
|
||||||
|
:::
|
||||||
|
|
||||||
|
Here's an [example conversation](https://opencode.ai/s/4XP1fce5) with opencode.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Customize
|
||||||
|
|
||||||
|
And that's it! You are now a pro at using opencode.
|
||||||
|
|
||||||
|
To make it your own, we recommend [picking a theme](/docs/themes), [customizing the keybinds](/docs/keybinds), [configuring code formatters](/docs/formatters), [creating custom commands](/docs/commands), or playing around with the [opencode config](/docs/config).
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ title: Providers
|
|||||||
description: Using any LLM provider in opencode.
|
description: Using any LLM provider in opencode.
|
||||||
---
|
---
|
||||||
|
|
||||||
import config from "../../../../config.mjs"
|
import config from "../../../config.mjs"
|
||||||
export const console = config.console
|
export const console = config.console
|
||||||
|
|
||||||
opencode uses the [AI SDK](https://ai-sdk.dev/) and [Models.dev](https://models.dev) to support for **75+ LLM providers** and it supports running local models.
|
opencode uses the [AI SDK](https://ai-sdk.dev/) and [Models.dev](https://models.dev) to support for **75+ LLM providers** and it supports running local models.
|
||||||
@@ -3,7 +3,7 @@ title: SDK
|
|||||||
description: Type-safe JS client for opencode server.
|
description: Type-safe JS client for opencode server.
|
||||||
---
|
---
|
||||||
|
|
||||||
import config from "../../../../config.mjs"
|
import config from "../../../config.mjs"
|
||||||
export const typesUrl = `${config.github}/blob/dev/packages/sdk/js/src/gen/types.gen.ts`
|
export const typesUrl = `${config.github}/blob/dev/packages/sdk/js/src/gen/types.gen.ts`
|
||||||
|
|
||||||
The opencode JS/TS SDK provides a type-safe client for interacting with the server.
|
The opencode JS/TS SDK provides a type-safe client for interacting with the server.
|
||||||
@@ -3,7 +3,7 @@ title: Server
|
|||||||
description: Interact with opencode server over HTTP.
|
description: Interact with opencode server over HTTP.
|
||||||
---
|
---
|
||||||
|
|
||||||
import config from "../../../../config.mjs"
|
import config from "../../../config.mjs"
|
||||||
export const typesUrl = `${config.github}/blob/dev/packages/sdk/js/src/gen/types.gen.ts`
|
export const typesUrl = `${config.github}/blob/dev/packages/sdk/js/src/gen/types.gen.ts`
|
||||||
|
|
||||||
The `opencode serve` command runs a headless HTTP server that exposes an OpenAPI endpoint that an opencode client can use.
|
The `opencode serve` command runs a headless HTTP server that exposes an OpenAPI endpoint that an opencode client can use.
|
||||||
@@ -3,7 +3,7 @@ title: Zen
|
|||||||
description: Curated list of models provided by opencode.
|
description: Curated list of models provided by opencode.
|
||||||
---
|
---
|
||||||
|
|
||||||
import config from "../../../../config.mjs"
|
import config from "../../../config.mjs"
|
||||||
export const console = config.console
|
export const console = config.console
|
||||||
export const email = `mailto:${config.email}`
|
export const email = `mailto:${config.email}`
|
||||||
|
|
||||||
Reference in New Issue
Block a user