> ## Documentation Index
> Fetch the complete documentation index at: https://docs.xano.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Building with the VS Code Extension
> A guide to setting up VS Code for Xano development, editing endpoints in XanoScript, and syncing changes.
**Using Claude Code?** You don't need VS Code at all. Install the [Developer MCP](/developer-mcp/get-started) and use the [Xano CLI](/xano-cli/get-started) to pull, edit, and push — no extension required.
This guide walks you through setting up VS Code for Xano development — connecting your workspace, configuring your AI assistant, editing an endpoint, and syncing changes back to Xano.
Install the [XanoScript extension for VS Code](https://marketplace.visualstudio.com/items?itemName=xano.xanoscript). This provides syntax highlighting, real-time validation, code completion, and a built-in connection manager for syncing with your Xano workspace.
**Using Cursor, Windsurf, or another .vsix-compatible IDE?** Download the extension from the [Open VSX Registry](https://open-vsx.org/extension/xano/xanoscript) and follow your IDE's instructions for installing .vsix files.
**Using the Developer MCP?** Install the [XanoScript Language Server](https://marketplace.visualstudio.com/items?itemName=xano.xanoscript-language-server) instead. It provides syntax highlighting and validation without conflicting with the MCP. The full extension above should not be installed alongside the Developer MCP.
The XanoScript extension works with multiple AI coding tools. Choose the setup that matches your workflow.
Make sure you have **GitHub Copilot Pro or higher** enabled in VS Code. For the best results generating XanoScript, use:
* GPT 5 or higher
* Sonnet 4.5, or Opus
No additional installation is needed — you'll generate AI Agent Instructions when you connect to Xano in the next step. These files help Copilot understand your workspace structure and XanoScript conventions.
Install the [Developer MCP](/developer-mcp/get-started) to give your AI coding tools direct access to XanoScript documentation and real-time code validation. This significantly improves the quality of AI-generated XanoScript.
Quick install for Claude Code:
```bash theme={null}
claude mcp add xano -- npx -y @xano/developer-mcp
```
The Developer MCP replaces the need for AI Agent Instructions — it provides XanoScript context to your AI tools directly.
*Make sure you have the folder you want to work in open before continuing.*
**Using the XanoScript Language Server + CLI?** Run `xano auth` to authenticate, then `xano workspace pull -d ./my-workspace` to pull your workspace. See the [CLI Get Started](/xano-cli/get-started) guide for details, and skip ahead to the next step.
Click *Login to Xano* to authenticate with your Xano account and follow the instructions.
Select your instance from the dropdown that appears, and then select your workspace and your live branch.
After selection, click *Pull Changes* to get everything that's currently present in your Xano workspace.
**If you're using GitHub Copilot**, select *Setup AI Agent Instructions* to generate context files for your workspace. These help Copilot understand your workspace structure and XanoScript conventions. It is highly recommended to generate these for the best possible experience.
**Using the Developer MCP?** Skip this step — the MCP provides XanoScript context to your AI tools directly.
Xano repos follow a very simple structure. Each primitive lives in its folder, with logic stored inside `.xs` files.
**Repository Layout**
```bash theme={null}
api/
authentication/
api_group.xs
000_auth_signup_post.xs
000_auth_login_post.xs
000_auth_me_get.xs
table/
000_user.xs
```
You'll see other folders for things like functions, AI Agents, and more -- for this quick start, we're just looking at APIs and tables.
Navigate to `api/authentication/000_auth_signup_post.xs`
Add a new function below `security.create_auth_token`. Order matters — this ensures the email is sent only after signup succeeds. This is our `send_email` function; just copy and paste the code below.
```
util.send_email {
service_provider = "xano"
subject = "Welcome!"
message = "Thanks for checking out Xano. We're so glad you're here."
} as $x1
```
This is what you should be seeing now:
Save your changes, and then click the option in the XanoScript extension to stage your changes.
Push your changes to Xano. Progress is shown in a notification in the bottom-right corner.
Prefer the terminal? You can also use `xano workspace push` and `xano workspace pull` via the [Xano CLI](/xano-cli/get-started) instead of the extension's UI.
**Git works like it always has** — your workspace is plain files on disk. Commit your changes to Git before or after pushing to Xano for full version history, branching, and collaboration.
Send a POST request to your auth/signup endpoint and review the results.
```bash theme={null}
curl -X POST "https://your-xano-instance.xano.io/api:abcD123/auth/signup" \
-H "Content-Type: application/json" \
-d '{
"name": "John Doe",
"email": "john.doe@example.com",
"password": "super_secure_password"
}'
```
You should receive a welcome email shortly after the request completes.
*This step is optional, but you can quickly see the parity between your code and the visual representation.*
Head into Xano, and navigate to your `auth/signup` API by clicking API in the sidebar, choose the **Authentication** group, and click `auth/signup`.
You should see the *Send Email* step at the end of the logic, right after the *Create Authentication Token* step.
