Home › Docs › Tutorials

Tutorials

Step-by-step guides for common tasks and workflows in LastBrowser.

Tutorials

  1. Building LastBrowser from Source
  2. Creating Your First AI Agent
  3. Setting Up a Kanban Board
  4. Organizing with Workspaces
  5. Using Split View
  6. Running a Focus Session
  7. Mastering the Command Palette

1. Building LastBrowser from Source

This tutorial walks through the complete process of cloning, building, and running LastBrowser from source on Windows.

Prerequisites

Step-by-Step

  1. Clone the repository
    git clone https://github.com/Loggableim/lastbrowser.git
  2. Navigate to the native directory
    cd lastbrowser/native
  3. Install dependencies
    npm install — This installs Electron v35, electron-builder, sql.js, and all dependencies.
  4. Start in development mode
    npm run dev — Launches Electron with the Python backend. The ELECTRON_DEV=1 environment variable points the server launcher to the parent directory.
  5. Verify it works
    The LastBrowser window should appear with the dark sidebar, and the status footer should show "connected" once the Python server is ready.

Build for Distribution

# Build NSIS installer
npm run build

# Build portable directory (no installer, run from any folder)
npm run build:dir

# Production release build
npm run dist

The output goes to native/dist/. The installer will be LastBrowser-Setup-0.2.0.exe (or your version).

Troubleshooting: If you get native module errors, ensure you have the Windows Build Tools installed. Run npm install --global windows-build-tools as Administrator, then retry npm install.

2. Creating Your First AI Agent

LastBrowser's agent system lets you configure AI agents with different models, providers, and roles. Here's how to set up your first agent.

  1. Open the Agents panel — Click the Agents icon in the sidebar (Ctrl+4).
  2. Click "Add Agent" — Opens the agent configuration form.
  3. Configure your agent:
    • Name: "My Assistant"
    • Model: deepseek-v4-flash (or any model you have access to)
    • Provider: opencode-go (or your preferred provider)
    • Max Tokens: 4000
    • Temperature: 0.7 (balanced between creativity and precision)
    • Role: Worker (general-purpose assistant)
  4. Enable the agent — Toggle the enabled switch to on.
  5. Save — Your agent is now active and ready.

Assign an Agent to a Tab

Once your agent is created, you can assign it to a browser tab:

  1. Open the Browser panel (Ctrl+4).
  2. Navigate to a webpage.
  3. Click the agent icon in the tab toolbar and select your agent.
  4. The agent can now navigate, click, type, scroll, and extract content from that tab.

View Agent Statistics

The Agents dashboard shows real-time stats: total tasks run, tokens used, success rate, and running job count. Click any agent to see detailed history.

3. Setting Up a Kanban Board

Kanban boards help you manage tasks visually. Each workspace has its own boards.

  1. Open the Kanban panel — Click the Kanban icon in the sidebar (Ctrl+2).
  2. Click "New Board" — Give it a title like "My Tasks" or "Project Alpha".
  3. Default columns are created automatically: Inbox, Todo, Planned, In Progress, Waiting, Review, Testing, Done, Archived.
  4. Add cards — Click "Add Card" in any column. Give it a title, description, and optional due date.
  5. Drag cards between columns to update their status.
  6. Set WIP limits — Right-click a column header to set a Work-In-Progress limit (e.g., limit "In Progress" to 3 cards).

Tips

4. Organizing with Workspaces

Workspaces keep different projects or contexts completely separate. Each workspace has its own tabs, cookies, agents, and kanban boards.

  1. Create a new workspace — Click the + icon in the workspace switcher (top of the sidebar).
  2. Name it — e.g., "Work", "Personal", "Project Alpha".
  3. Choose an icon and color — Makes workspaces easy to identify at a glance.
  4. Switch between workspaces — Click a workspace name in the switcher. Each workspace loads independently.
  5. Pause unused workspaces — Right-click a workspace and select "Pause" to free system resources.
Because each workspace uses a separate Electron session partition, you can be logged into different accounts on the same website in different workspaces — they won't interfere.

5. Using Split View

Split view lets you see two web pages side-by-side within the same window.

  1. Open two tabs in your workspace (e.g., a documentation page and a code editor).
  2. Activate split view — Click the split view icon in the toolbar or use the Split View panel.
  3. Select tabs — Choose which two tabs to display. The workspace splits into two panels.
  4. Resize panels — Drag the divider between panels to change their relative sizes.
  5. Swap panels or close the split — Use the toolbar buttons to modify the layout.

Use Cases

6. Running a Focus Session

Focus mode helps you concentrate by muting distractions and tracking your work time.

  1. Open the Command Palette — Press Ctrl+K.
  2. Type "Focus" — Select one of the presets: Pomodoro (25m), Focus 50 (50m), Focus 90 (90m).
  3. Alternatively, use Ctrl+Shift+F to toggle focus mode directly.
  4. During the session:
    • All notifications are muted
    • Badges are hidden
    • Sounds are muted
    • A timer overlay shows remaining time
  5. End early — Press Ctrl+Shift+F again, or use the Command Palette.

Pro Tips

7. Mastering the Command Palette

The Command Palette (Ctrl+K) is the fastest way to navigate and control LastBrowser without touching the mouse.

What You Can Do

Fuzzy Search Tips

The palette searches across ALL data types simultaneously — workspaces, tabs, commands, settings, apps, and tasks. If you know what you want, just start typing.

Browse the FAQ →