---
sidebar_position: 1
---
import continue_ask from './assets/jan-ai-continue-ask.png';
import continue_comment from './assets/jan-ai-continue-comment.gif';
import vscode from './assets/vscode.png';
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';

# Continue Integration for Visual Studio Code

A step-by-step guide on how to integrate Jan with Continue and VS Code.

---

## Overview

This guide showcases integrating Continue with Jan and VS Code to boost your coding using the local AI language model's features. [Continue](https://continue.dev/docs/intro) is an open-source autopilot compatible with Visual Studio Code and JetBrains, offering the simplest method to code with any LLM (Local Language Model).

## How to Integrate with Continue VS Code

### Step 1: Installing Continue on Visal Studio Code

Follow this [guide to install the Continue extension on Visual Studio Code](https://continue.dev/docs/quickstart)

### Step 2: Enable the Jan API Server

To set up Continue for use with Jan's Local Server, you must activate the Jan API Server with your chosen model.

1. Press the `<>` button. Jan will take you to the **Local API Server** section.

2. Setup the server, which includes the **IP Port**, **Cross-Origin-Resource-Sharing (CORS)** and **Verbose Server Logs**.

3. Press the **Start Server** button

### Step 3: Configure Continue to Use Jan's Local Server
1. Go to the `~/.continue` directory.

<Tabs>
    <TabItem value="mac" label="Mac" default>
    ```sh
    cd ~/.continue
    ```
    </TabItem>
    <TabItem value="windows" label="Windows">
    ```sh
    C:/Users/<your_user_name>/.continue
    ```
    </TabItem>
    <TabItem value="linux" label="Linux">
    ```sh
    cd ~/.continue
    ```
    </TabItem>
</Tabs>

```json title="~/.continue/config.json"
{
  "models": [
    {
      "title": "Jan",
      "provider": "openai",
      "model": "mistral-ins-7b-q4",
      "apiKey": "EMPTY",
      "apiBase": "http://localhost:1337/v1"
    }
  ]
}
```
2. Ensure the file has the following configurations:
    - Ensure `openai` is selected as the `provider`.
    - Match the `model` with the one enabled in the Jan API Server.
    - Set `apiBase` to `http://localhost:1337/v1`.
    - Leave the `apiKey` field to `EMPTY`.

### Step 4: Ensure the Using Model Is Activated in Jan

1. Navigate to `Settings` > `Models`.
2. Activate the model you want to use in Jan by clicking the **three dots (⋮)** and select **Start Model**.

## Use cases for Jan integration with Visual Studio Code
Below are examples of the integration:

### 1. Asking questions about the code

1. Highlight a code snippet and press `Command + Shift + M` to open the Left Panel.
2. Select Jan at the bottom and ask a question about the code, for example, `Explain this code`.

<div class="text--center"> 
    <img src={continue_ask} width={800} alt="jan-ai-continue-ask" />
</div>

 ### 2. Editing the code with the help of a large language model

1. Select a code snippet and use `Command + Shift + L`.
2. Enter your editing request, such as `Add comments to this code`.
 
<div class="text--center"> 
    <img src={continue_comment} width={800} alt="jan-ai-continue-comment" />
</div>