Your first task
Take a small guestbook improvement from a local issue to a preview, reviewed diff, and commit you can find again.
Make one visible change in a project you can explore freely. The included hob example project is a tiny guestbook with HTML, CSS, and JavaScript, three starter issues, and a short commit history. No dependencies or build step are needed for the app itself.
You will add a character counter, try it beside the agent's conversation, review the changed files, and keep a record of the result. Before starting, install hob and connect a coding tool.
Create the example
Open the command palette from Search or run a command at the top of hob. Search for Create Demo Project and choose that command. hob opens the example as its own project, keeping the exercise separate from your other work.
The Files Dock shows index.html, style.css, app.js, and the project notes.
Open README.md if you want the project tour. Opening the example again
keeps your existing edits; its README explains how to start fresh.
See the app
Open an agent pane. Before sending its first message, use the backend chip to choose Claude Code, Codex, or OpenCode for this pane. Then ask it to bring the app into view:
Ask your agent
You should see the note form and three fictional starter notes. Keep the preview beside the agent so the result stays visible as you work. The Browser previews guide explains file watching and how to open the HTML yourself.
Hand the agent an issue
Open Issues from the tool rail. In the local list, select the checkbox beside Show a character counter for notes, then choose Send to agent. Read the issue's acceptance criteria: update while typing or pasting, keep the 280-character limit, reset after submission, and check both themes.
The handoff creates an agent for the issue. Depending on your issue start-mode setting, it begins immediately or lets you add context first. This is the same workflow you can use for your own local and connected issues. Follow the assigned agent's pane, and ask it to keep the result uncommitted until you have reviewed it.
Watch, then try the change
The agent can explain its approach, ask a question, or request permission as it works. Answer the decisions that need you. When the change is ready, the preview should show a count beside the note field.
Try typing, pasting, and deleting text. Check that the count matches, the maximum stays at 280, and the form remains readable in light and dark themes. Use the preview's Mobile View for a narrow-layout check.
Also check saving and reset behavior in a regular browser. If submission in the web pane navigates instead of saving, use that browser check to distinguish the app's behavior from the current web-pane form-submission issue. A working counter alone does not verify every acceptance criterion.
Working with your agent shows how an agent can point to the detail to review or offer a walkthrough when you ask.
Review the diff and run a check
Choose Changes in the Dock. Open each modified file to see what the agent changed. The example below touches the HTML, JavaScript, and stylesheet; your agent's implementation may differ.
Use the Diff viewer to inspect the result. Ask about anything unexpected, including unrelated edits or dependencies.
If Node.js is installed, open a terminal and check the JavaScript syntax:
node --check app.jsSuccess normally prints nothing. It checks that JavaScript can be parsed; your preview and browser checks verify the behavior. Follow the Testing recipe for specific inputs and expected results.
Ask for a commit
Once you are satisfied with the diff and checks, ask the agent to commit:
Ask your agent
A useful message names the result, such as “Add a character counter for notes.” The agent can use hob's Git integration to link the commit to its conversation. Do not treat an unverified check as passed simply because the change is committed.
Find the work again
Open Commits in Source Control. Your new commit appears alongside the three starter commits. Select it to inspect the change later.
Open History from the tool rail to return to the conversation and its linked artifacts. Saved lets you bookmark a useful explanation or result. You can leave the task and recover both the change and its context when you return.
For agents
After the person approves the reviewed change, use
hob git commit -m "Add a character counter for notes" with only those changes
staged. The commit links back to your turn; include the checks performed and
anything still unverified in your reply. See
Commits and artifacts.
Next
Try another starter issue, or bring your own project into the same workflow. Use a separate workspace when the next task needs its own context.