| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 1 | <div align="center"> |
| 2 | |
| 3 | <img src="https://storage.googleapis.com/sketch-assets/sketch-logo.png" alt="Sketch Logo" width="300"/> |
| 4 | |
| Earl Lee | 2e463fb | 2025-04-17 11:22:22 -0700 | [diff] [blame] | 5 | # Sketch |
| 6 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 7 | [](https://pkg.go.dev/sketch.dev) |
| Pokey Rule | 124c942 | 2025-05-15 19:07:50 +0100 | [diff] [blame] | 8 | [](https://discord.gg/6w9qNRUDzS) |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 9 | [](https://github.com/boldsoftware/sketch/actions/workflows/go_test.yml) |
| 10 | [](https://github.com/boldsoftware/sketch/blob/main/LICENSE) |
| 11 | |
| 12 | **Sketch is an agentic coding tool. It draws the 🦉** |
| 13 | |
| 14 | </div> |
| 15 | |
| 16 | ## 🚀 Overview |
| Philip Zeyliger | 3b279a5 | 2025-05-07 21:02:03 -0700 | [diff] [blame] | 17 | |
| 18 | Sketch runs in your terminal, has a web UI, understands your code, and helps |
| 19 | you get work done. To keep your environment pristine, sketch starts a docker |
| 20 | container and outputs its work onto a branch in your host git repository. |
| 21 | |
| Josh Bleecher Snyder | 39ed5a5 | 2025-05-12 17:34:45 -0700 | [diff] [blame] | 22 | Sketch helps with most programming environments, but Sketch has extra goodies for Go. |
| Earl Lee | 2e463fb | 2025-04-17 11:22:22 -0700 | [diff] [blame] | 23 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 24 | <img src="https://storage.googleapis.com/sketch-assets/screenshot.jpg" alt="Sketch Screenshot" width="800"/> |
| 25 | |
| 26 | ## 📋 Quick Start |
| Earl Lee | 2e463fb | 2025-04-17 11:22:22 -0700 | [diff] [blame] | 27 | |
| 28 | ```sh |
| 29 | go install sketch.dev/cmd/sketch@latest |
| 30 | sketch |
| 31 | ``` |
| David Crawshaw | 64d3299 | 2025-04-21 09:14:36 -0700 | [diff] [blame] | 32 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 33 | ## 🔧 Requirements |
| David Crawshaw | 64d3299 | 2025-04-21 09:14:36 -0700 | [diff] [blame] | 34 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 35 | Currently, Sketch runs on macOS and Linux. It uses Docker for containers. |
| Josh Bleecher Snyder | 5cef9db | 2025-04-22 16:44:13 -0700 | [diff] [blame] | 36 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 37 | | Platform | Installation | |
| 38 | | -------- | -------------------------------------------------------------------------- | |
| 39 | | macOS | `brew install colima` (or Docker Desktop/Orbstack) | |
| 40 | | Linux | `apt install docker.io` (or equivalent for your distro) | |
| 41 | | WSL2 | Install Docker Desktop for Windows (docker entirely inside WSL2 is tricky) | |
| David Crawshaw | 64d3299 | 2025-04-21 09:14:36 -0700 | [diff] [blame] | 42 | |
| 43 | The [sketch.dev](https://sketch.dev) service is used to provide access |
| 44 | to an LLM service and give you a way to access the web UI from anywhere. |
| 45 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 46 | ## 🤝 Community & Feedback |
| David Crawshaw | 64d3299 | 2025-04-21 09:14:36 -0700 | [diff] [blame] | 47 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 48 | - **Discord**: Join our community at [https://discord.gg/6w9qNRUDzS](https://discord.gg/6w9qNRUDzS) |
| 49 | - **GitHub Issues**: Submit feedback at [https://github.com/boldsoftware/sketch/issues](https://github.com/boldsoftware/sketch/issues) |
| David Crawshaw | 64d3299 | 2025-04-21 09:14:36 -0700 | [diff] [blame] | 50 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 51 | ## 📖 User Guide |
| David Crawshaw | 64d3299 | 2025-04-21 09:14:36 -0700 | [diff] [blame] | 52 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 53 | ### Getting Started |
| Josh Bleecher Snyder | 39ed5a5 | 2025-05-12 17:34:45 -0700 | [diff] [blame] | 54 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 55 | Start Sketch by running `sketch` in a Git repository. It will open your browser to the Sketch chat interface, but you can also use the CLI interface. Use `-open=false` if you want to use just the CLI interface. |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 56 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 57 | Ask Sketch about your codebase or ask it to implement a feature. It may take a little while for Sketch to do its work, so hit the bell (🔔) icon to enable browser notifications. We won't spam you or anything; it will notify you |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 58 | when the Sketch agent's turn is done, and there's something to look at. |
| 59 | |
| 60 | ### How Sketch Works |
| 61 | |
| 62 | <!-- TODO: innie/outtie picture --> |
| 63 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 64 | When you start Sketch, it: |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 65 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 66 | 1. Creates a Dockerfile |
| 67 | 2. Builds it |
| 68 | 3. Copies your repository into it |
| 69 | 4. Starts a Docker container with the "inside" Sketch running |
| 70 | |
| 71 | This design lets you **run multiple sketches in parallel** since they each have their own sandbox. It also lets Sketch work without worry: it can trash its own container, but it can't trash your machine. |
| 72 | |
| 73 | Sketch's agentic loop uses tool calls (mostly shell commands, but also a handful of other important tools) to allow the LLM to interact with your codebase. |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 74 | |
| 75 | ### Getting Your Git Changes Out |
| 76 | |
| 77 | <!-- TODO: git picture --> |
| 78 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 79 | Sketch is trained to make Git commits. When those happen, they are |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 80 | automatically pushed to the git repository where you started sketch with branch |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 81 | names `sketch/*`. |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 82 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 83 | **Finding Sketch branches:** |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 84 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 85 | ```sh |
| 86 | git branch -a --sort=creatordate | grep sketch/ | tail |
| 87 | ``` |
| 88 | |
| 89 | The UI keeps track of the latest branch it pushed and displays it prominently. You can use standard Git workflows to pull those branches into your workspace: |
| 90 | |
| 91 | ```sh |
| 92 | git cherry-pick $(git merge-base origin/main sketch/foo) |
| 93 | ``` |
| 94 | |
| 95 | or merge the branch |
| 96 | |
| 97 | ```sh |
| 98 | git merge sketch/foo |
| 99 | ``` |
| 100 | |
| 101 | or reset to the branch |
| 102 | |
| 103 | ```sh |
| 104 | git reset --hard sketch/foo |
| 105 | ``` |
| 106 | |
| 107 | Ie use the same workflows you would if you were pulling in a friend's Pull Request. |
| 108 | |
| 109 | **Advanced:** You can ask Sketch to `git fetch sketch-host` and rebase onto another commit. This will also fetch where you started Sketch, and we do a bit of "git fetch refspec configuration" to make `origin/main` work as a git reference. |
| 110 | |
| 111 | Don't be afraid of asking Sketch to help you rebase, merge/squash commits, rewrite commit messages, and so forth; it's good at it! |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 112 | |
| 113 | ### Reviewing Diffs |
| 114 | |
| 115 | The diff view shows you changes since Sketch started. Leaving comments on lines |
| Josh Bleecher Snyder | 39ed5a5 | 2025-05-12 17:34:45 -0700 | [diff] [blame] | 116 | adds them to the chat box, and, when you hit Send (at the bottom of the page), Sketch goes to work addressing your |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 117 | comments. |
| 118 | |
| Philip Zeyliger | 6458e7c | 2025-05-10 18:07:54 -0700 | [diff] [blame] | 119 | ### Connecting to Sketch's Container |
| 120 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 121 | You can interact directly with the container in three ways: |
| Philip Zeyliger | 6458e7c | 2025-05-10 18:07:54 -0700 | [diff] [blame] | 122 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 123 | 1. **Web UI Terminal**: Use the "Terminal" tab in the UI |
| 124 | 2. **SSH**: Look at the startup logs or click the information icon to see a command like `ssh sketch-ilik-eske-tcha-lott`. |
| 125 | We have automatically configured your SSH configuration to make these special hostnames work. |
| 126 | 3. **Visual Studio Code**: Look for a command line or magic link behind the information icon, or when Sketch starts up. This starts a new VSCode session "remoted into" the container. You |
| 127 | can edit the code, use the terminal, review diffs, and so forth. |
| Philip Zeyliger | 6458e7c | 2025-05-10 18:07:54 -0700 | [diff] [blame] | 128 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 129 | Using SSH (and/or VSCode) allows you to forward ports from the container to your machine. For example, if you want to start your development webserver, you can do something like this: |
| Philip Zeyliger | 6458e7c | 2025-05-10 18:07:54 -0700 | [diff] [blame] | 130 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 131 | ```sh |
| 132 | # Forward container port 8888 to local port 8000 |
| 133 | ssh -L8000:localhost:8888 sketch-ilik-epor-tfor-ward go run ./cmd/server |
| 134 | ``` |
| Philip Zeyliger | 6458e7c | 2025-05-10 18:07:54 -0700 | [diff] [blame] | 135 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 136 | This makes `http://localhost:8000/` on your machine point to `localhost:8888` inside the container. |
| 137 | |
| 138 | ### Using Browser Tools |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 139 | |
| 140 | You can ask Sketch to browse a web page and take screenshots. There are tools |
| Josh Bleecher Snyder | 39ed5a5 | 2025-05-12 17:34:45 -0700 | [diff] [blame] | 141 | both for taking screenshots and "reading images", the latter of which sends the |
| Philip Zeyliger | 5ebdbb8 | 2025-05-10 17:20:29 -0700 | [diff] [blame] | 142 | image to the LLM. This functionality is handy if you're working on a web page and |
| 143 | want to see what the in-progress change looks like. |
| 144 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 145 | ## ❓ FAQ |
| Philip Zeyliger | 39bcf01 | 2025-05-12 10:07:40 -0700 | [diff] [blame] | 146 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 147 | ### "No space left on device" |
| Philip Zeyliger | 39bcf01 | 2025-05-12 10:07:40 -0700 | [diff] [blame] | 148 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 149 | Docker images, containers, and so forth tend to pile up. Ask Docker to prune unused images and containers: |
| Philip Zeyliger | 39bcf01 | 2025-05-12 10:07:40 -0700 | [diff] [blame] | 150 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 151 | ```sh |
| 152 | docker system prune -a |
| 153 | ``` |
| 154 | |
| 155 | ## 🛠️ Development |
| Philip Zeyliger | d43e572 | 2025-04-23 19:21:26 -0700 | [diff] [blame] | 156 | |
| M-A | b5cb954 | 2025-05-02 11:32:34 -0400 | [diff] [blame] | 157 | [](https://pkg.go.dev/sketch.dev) |
| 158 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 159 | See [CONTRIBUTING.md](CONTRIBUTING.md) for development guidelines. |
| Philip Zeyliger | d43e572 | 2025-04-23 19:21:26 -0700 | [diff] [blame] | 160 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 161 | ## 📄 Open Source |
| David Crawshaw | 64d3299 | 2025-04-21 09:14:36 -0700 | [diff] [blame] | 162 | |
| 163 | Sketch is open source. |
| 164 | It is right here in this repository! |
| 165 | Have a look around and mod away. |
| 166 | |
| Pokey Rule | 9007dd9 | 2025-05-15 14:38:55 +0100 | [diff] [blame] | 167 | If you want to run Sketch entirely without the sketch.dev service, you can set the flag `-skaband-addr=""` and then provide an `ANTHROPIC_API_KEY` environment variable. (More LLM services coming soon!) |