Claude Desktop Setup

The easiest way to start β€” our recommendation for new developers

Claude Desktop plus Claude Mobile is the gentlest on-ramp to Free For Charity development. You sign in, connect GitHub, and let Claude open pull requests for you β€” with no build tools to install. CI runs the tests automatically.

Beginner-friendlyClaude Pro recommended~20 minutes

1. Why Claude Desktop

For someone new to development, the simplest setup is a desktop app that already knows how to talk to GitHub. Claude Desktop does exactly that. You describe a change in plain English; Claude reads the repository, makes the edit, and opens a pull request through the GitHub MCPconnector. Free For Charity's CI then runs the build and tests automatically β€” so you do not need Node, Git, or a code editor on day one.

Already pay for ChatGPT, Gemini, or Copilot instead? Keep your AI β€” see the hub to set that one up. This guide assumes Claude is your AI of choice.

2. Install Desktop + Mobile

  1. Download Claude Desktop for macOS or Windows from claude.ai/download and run the installer.
  2. Install Claude Mobile on your phone from the Apple App Store or Google Play so you can review and drive work on the go.
  3. Launch Claude Desktop.

3. Sign In (Pro Recommended)

Sign in with your Anthropic account. For real FFC work we recommend the personal Claude Pro plan: it gives you enough usage to complete tasks without constantly hitting limits, and it unlocks custom MCP connectors (the free tier is limited to a single custom connector).

You can start on the free tier to look around, but plan to upgrade to Pro before doing ongoing work β€” the GitHub connector is central to this guide.

4. How the Beginner Flow Works

The key idea: everything happens through GitHub.With the GitHub MCP connector, Claude can read issues, create a branch, commit changes, and open a pull request β€” all on GitHub's servers. Free For Charity's CI pipeline then builds the site and runs the tests for you. You never have to install a toolchain or run commands locally.

No local tooling required. Node.js, pnpm, and Playwright only matter when you graduate to an IDE (see step 9). For now, Claude + GitHub + CI is the whole toolchain.

5. Confirm GitHub Access

Make sure a maintainer has added you to the FreeForCharity GitHub organization, and accept the email invitation. Without org membership the GitHub connector cannot open pull requests on our repositories.

6. Connect GitHub via MCP

Claude Desktop calls MCP servers connectors, and the GitHub connector is already available β€” you do not install anything by hand. The simplest path is to let Claude set it up: paste the prompt below and follow whatever sign-in it walks you through. (If you prefer to click through it yourself, the + button at the bottom of the chat box has a Connectors option, and Settings β†’ Connectors lists what is enabled.)

Copy this prompt into your AI agent

β€œI want to work on Free For Charity's website repositories on GitHub (the organization is FreeForCharity). Set yourself up end to end: enable the GitHub connector so you can read issues and open pull requests for me, and walk me through any sign-in. When you are ready, confirm you can see the FreeForCharity/FFC_Single_Page_Templaterepository and list its open issues.”

When a connector is active, a small hammer / tools icon appears under the chat box showing how many tools are available. If it is missing, fully quit Claude Desktop (Cmd+Q or Quit from the tray) and reopen.

Let Claude handle the details. Connector names, sign-in screens, and setup steps change over time, so we deliberately do not print exact configuration here β€” Claude will use whatever the current version needs. Your job is to approve the sign-in and never paste a token into chat, an issue, or a repository.

7. Use Claude Mobile

Claude Mobile can use the same remote connectors you set up on the web. One catch: you add connectors on claude.ai in a browser (or Claude Desktop), and they sync automatically to your phone β€” you cannot add a new server from the mobile app itself.

  1. On claude.ai, open settings and add the GitHub connector (remote MCP).
  2. Open Claude Mobile β€” the connector is already available.
  3. Now you can triage issues, ask for small fixes, and check on a pull request from your phone.

Remote connectors run from Anthropic's cloud, not your device β€” which is exactly why they work the same on desktop, web, and mobile.

8. Your First Issue to Merge

With the GitHub connector active, you can run the entire Free For Charity contribution loop from chat. Try a small, safe change like fixing a typo.

Step 1 β€” Pick or open an issue

Copy this prompt into your AI agent

β€œUsing the GitHub tools, list the open issues on FreeForCharity/FFC_Single_Page_Template. If there is no issue for the small change I want, open one titled β€˜<short title>’ describing it.”

Step 2 β€” Make the change on a branch

Copy this prompt into your AI agent

β€œCreate a new branch for issue #<number> (never commit to main) and make the change it describes. Our template is FreeForCharity/FFC_Single_Page_Template; for an example of how a finished Free For Charity site is structured, look at FreeForCharity/FFC-IN-ffcadmin.organd match its conventions. Show me exactly what you changed before opening anything.”

Step 3 β€” Open a PR and let CI run

Copy this prompt into your AI agent

β€œOpen a pull request from that branch with a Conventional Commit title, link the issue with β€˜Fixes #<number>’, then watch the CI checks (format, lint, build, tests, Playwright) and tell me if any fail.”

Step 4 β€” Review and merge

Review the diff on GitHub. A maintainer approves, and once every check is green the pull request merges. That is the whole loop β€” no local tools required.

9. When to Move to an IDE

Most charity website work never needs more than this. Consider graduating to a full IDE only when a task genuinely calls for running builds and tests on your own machine, debugging a browser test, or doing a large refactor across many files.

  • β€’Want to keep using Claude? VS Code or Antigravity both let you run Claude as a CLI agent and an in-editor plug-in.
  • β€’There is no rush β€” the beginner path stays valid for the long term.

10. Security and Good Habits

  • βœ•Never paste tokens or keys into chat, issues, commits, or pull requests.
  • βœ“Prefer the managed Connectors sign-in over a hand-entered token.
  • βœ“Review the diff before a pull request merges β€” you are the human in the loop.
  • βœ“Always work on a branch and open a PR β€” never commit straight to main.

See the FFC security rules for the full policy.

11. Troubleshooting

SymptomFix
No tools / hammer icon missingFully quit Claude Desktop (Cmd+Q or Quit from the tray) and reopen β€” a restart is required after adding a connector.
Connector won't add on mobileAdd it on claude.ai in a browser instead; it syncs to mobile automatically.
Can't open a PR on our repoConfirm you accepted the FreeForCharity org invitation and that the GitHub connector is signed in.
Only one custom connector allowedThat is the free-tier limit β€” upgrade to Claude Pro for additional connectors.