From 5e93989df60b5e9df289ee1c924608589c6fe1cb Mon Sep 17 00:00:00 2001 From: patrikbraborec Date: Thu, 27 Nov 2025 15:19:45 -0800 Subject: [PATCH 1/2] docs: edit build with AI page to reflect changes in MCP --- .../development/quick-start/build_with_ai.md | 29 +++++++++- src/components/InstallMCPButton.jsx | 26 --------- src/components/InstallMCPButton.module.css | 54 ------------------- 3 files changed, 28 insertions(+), 81 deletions(-) delete mode 100644 src/components/InstallMCPButton.jsx delete mode 100644 src/components/InstallMCPButton.module.css diff --git a/sources/platform/actors/development/quick-start/build_with_ai.md b/sources/platform/actors/development/quick-start/build_with_ai.md index ebd355795..884051c48 100644 --- a/sources/platform/actors/development/quick-start/build_with_ai.md +++ b/sources/platform/actors/development/quick-start/build_with_ai.md @@ -13,7 +13,6 @@ toc_max_heading_level: 4 import { AGENTS_PROMPT } from "@site/src/utils/agents-prompt"; import PromptButton from "@site/src/components/PromptButton"; -import InstallMCPButton from "@site/src/components/InstallMCPButton"; import copyForAI from "./images/copy-for-ai.png"; This guide provides best practices for building new Actors or improving existing ones using AI code generation and vibe coding tools such as Cursor, Claude Code, or Visual Studio Code, by providing the AI agents with the right instructions and context. @@ -61,6 +60,34 @@ We have prepared the [Apify MCP server configuration](https://mcp.apify.com/), w ::: +### Claude + +1. Go to *Settings* > *Connectors* in Claude. +2. Click *Add custom connector*. +3. Set the name to `Apify` and the URL to `https://mcp.apify.com/?tools=docs`. +4. When chatting, click the *+* button and select the *Apify* connector to add documentation context. + +### Cursor + +1. Open the command palette with `Cmd+Shift+P` (or `Ctrl+Shift+P` on Windows). +2. Search for and select *Open MCP settings*. +3. Add the following configuration to `mcp.json`: + +```json +{ + "mcpServers": { + "apify": { + "url": "https://mcp.apify.com/?tools=docs" + } + } +} +``` + +### VS Code + +1. Install an MCP-compatible extension. +2. Add the Apify server URL: `https://mcp.apify.com/?tools=docs` + ## Provide context to assistants Every page in the Apify documentation has a **Copy for LLM** button. You can use it to add additional context to your AI assistant, or even open the page in ChatGPT, Claude, or Perplexity and ask additional questions. diff --git a/src/components/InstallMCPButton.jsx b/src/components/InstallMCPButton.jsx deleted file mode 100644 index bd3aeb7db..000000000 --- a/src/components/InstallMCPButton.jsx +++ /dev/null @@ -1,26 +0,0 @@ -import React from 'react'; - -import { ExternalLinkIcon } from '@apify/ui-icons'; -import { Text } from '@apify/ui-library'; - -import styles from './InstallMCPButton.module.css'; - -export default function InstallMCPButton({ link, label = 'Install MCP', children }) { - if (!link) return null; - - return ( - -
-
- -
- - {children || label} - -
- - ); -} diff --git a/src/components/InstallMCPButton.module.css b/src/components/InstallMCPButton.module.css deleted file mode 100644 index 632113a36..000000000 --- a/src/components/InstallMCPButton.module.css +++ /dev/null @@ -1,54 +0,0 @@ -.wrapper { - display: flex; - justify-content: center; - align-items: center; - color: var(--ifm-color-content); -} - -.button { - width: fit-content; - display: inline-flex; - align-items: center; - height: 3rem; - - display: flex; - align-items: center; - border-radius: 8px; - border: 1px solid var(--color-Neutral_SeparatorSubtle); - background-color: var(--color-Neutral_BackgroundMuted); - - cursor: pointer; - transition: background-color 0.2s ease-in-out; - - &:hover { - background-color: var(--color-Neutral_BackgroundMuted); - } -} - -.label { - height: 100%; - display: flex; - align-items: center; - padding-right: 0.8rem; - min-width: 9.3rem; - - /* prevents font size glitch when loading the page */ - margin: 0px; - font-size: 1.4rem; - font-weight: 400; - font-family: Inter, sans-serif; -} - -.button:hover { - background-color: var(--color-Neutral_BackgroundMuted); - color: var(--ifm-color-content); -} - -.iconWrapper { - display: flex; - align-items: center; - justify-content: center; - padding-left: 0.8rem; - padding-right: 0.4rem; - height: 100%; -} From 5867d5f56f96d0743b7e299130e240ead0282016 Mon Sep 17 00:00:00 2001 From: patrikbraborec Date: Thu, 27 Nov 2025 15:28:32 -0800 Subject: [PATCH 2/2] docs: fix lint errors --- .../actors/development/quick-start/build_with_ai.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/sources/platform/actors/development/quick-start/build_with_ai.md b/sources/platform/actors/development/quick-start/build_with_ai.md index 884051c48..082eb736f 100644 --- a/sources/platform/actors/development/quick-start/build_with_ai.md +++ b/sources/platform/actors/development/quick-start/build_with_ai.md @@ -62,15 +62,15 @@ We have prepared the [Apify MCP server configuration](https://mcp.apify.com/), w ### Claude -1. Go to *Settings* > *Connectors* in Claude. -2. Click *Add custom connector*. +1. Go to _Settings_ > _Connectors_ in Claude. +2. Click _Add custom connector_. 3. Set the name to `Apify` and the URL to `https://mcp.apify.com/?tools=docs`. -4. When chatting, click the *+* button and select the *Apify* connector to add documentation context. +4. When chatting, click the _+_ button and select the _Apify_ connector to add documentation context. ### Cursor 1. Open the command palette with `Cmd+Shift+P` (or `Ctrl+Shift+P` on Windows). -2. Search for and select *Open MCP settings*. +2. Search for and select _Open MCP settings_. 3. Add the following configuration to `mcp.json`: ```json