# Demo: Monthly giving by your users

> A sports club gives 5 € a month for each member who turns it on. The member picks the charity once; Charitips gives on the 1st and bills the club; pause or stop at any time.

A made-up site, your-club.example/account/giving, walked through screen by screen with the Charitips API calls the product makes at each step. Rebuild it in your own project to start from a working flow.

The charity choice in this demo is the Charitips [charity selection widget](https://www.charitips.com/docs/widgets/charity_selection.md), a ready-made proposal. Use it whole, use parts of it, or build your own experience from scratch with the API: [List charities](https://www.charitips.com/docs/api-reference/list-charities.md) gives the charities to show, and the calls below carry the chosen `charityId`.

Charitips widget: the charity cards and their profiles. Your own UI, built with the API: the monthly giving page, the button that turns it on and the giving status.

The full guide, with edge cases: https://www.charitips.com/docs/use-cases/recurring-donations.md.

**Once, before the first customer:**

- [`POST /v1/charities-selections`](https://www.charitips.com/docs/api-reference/create-charities-selection.md) Create a charities selection: once: the charities you offer, from the catalog

  ```json
  {
    "name": "Member charities",
    "charityIds": [
      "<charityId>"
    ]
  }
  ```
- [`POST /v1/campaigns`](https://www.charitips.com/docs/api-reference/create-campaign.md) Create a campaign: once: the recurring campaign, every month from its first date

  ```json
  {
    "name": "Monthly giving",
    "charitiesSelectionId": "<charitiesSelectionId>",
    "frequency": "R/2026-11-01/P1M"
  }
  ```
- [`POST /v1/campaigns/{campaignId}/activate`](https://www.charitips.com/docs/api-reference/activate-campaign.md) Activate a campaign: once: the campaign starts taking recurring donations

## Screens and calls

### 1. Give 5 € a month to a charity, on us

The member picks a charity, then turns monthly giving on in one click. Your server creates the member's recurring donation and claims it for that charity straight away: the first 5 € is given at once. Your company pays every donation and gets the fiscal receipt.

- The customer picks a charity from your selection.
- Button: Give 5 € a month

**Your server calls:**

- [`POST /v1/recurring-donations`](https://www.charitips.com/docs/api-reference/create-recurring-donation.md) Create a recurring donation: when the member turns it on, on the recurring campaign; the member's name and email, as Charitips emails them each month; amount in cents; keep the recurringDonationId with the member

  ```json
  {
    "campaignId": "<campaignId>",
    "amount": 500,
    "donorFirstName": "Camille",
    "donorLastName": "Martin",
    "donorEmail": "camille.martin@example.com",
    "externalId": "member_204",
    "uniqueExternalId": "giving_member_204"
  }
  ```
- [`POST /v1/recurring-donations/{recurringDonationId}/claim`](https://www.charitips.com/docs/api-reference/claim-recurring-donation.md) Claim a recurring donation: right after, with the charity the member chose: the recurring donation turns ACTIVE and this month's donation is made at once (recurringdonation_update, donation_create)

  ```json
  {
    "charityId": "<charityId>"
  }
  ```

Charitips then sends the `recurringdonation_create` webhook to your endpoint.

### 2. 1 November

On the 1st of each month, Charitips makes the donation of every active recurring donation, at most one a month, and bills it to your company. Nothing to call; a paused or stopped one is skipped.

- Monthly donation: 5,00 €
- Button: Simulate 1 November

No call: this screen only shows the result.

Charitips then sends the `donation_create` webhook to your endpoint.

### 3. Pause

The member pauses: nothing is given or billed on the 1st while it is paused.

- Button: Pause

**Your server calls:**

- [`POST /v1/recurring-donations/{recurringDonationId}/pause`](https://www.charitips.com/docs/api-reference/pause-recurring-donation.md) Pause a recurring donation: recurringDonationId kept with the member; the charity stays saved

Charitips then sends the `recurringdonation_update` webhook to your endpoint.

### 4. Resume

Giving starts again from the next 1st, to the same charity.

- Button: Resume giving

**Your server calls:**

- [`POST /v1/recurring-donations/{recurringDonationId}/resume`](https://www.charitips.com/docs/api-reference/resume-recurring-donation.md) Resume a recurring donation: only a paused recurring donation can be resumed

Charitips then sends the `recurringdonation_update` webhook to your endpoint.

### 5. Stop monthly giving

The member stops. The donations already made stay with the charity; nothing more is given.

- Button: Stop giving

**Your server calls:**

- [`POST /v1/recurring-donations/{recurringDonationId}/cancel`](https://www.charitips.com/docs/api-reference/cancel-recurring-donation.md) Cancel a recurring donation: final: a stopped recurring donation cannot be claimed again (409); turning giving on again creates a new one

Charitips then sends the `recurringdonation_update` webhook to your endpoint.

## Clone it with a coding agent

```prompt
Clone the Charitips demo "Monthly giving by your users" into this project. Read https://www.charitips.com/docs/demos/recurring.md: it lists each screen and the Charitips API calls behind it. Build the same flow in this codebase, on the sandbox (https://api.sandbox.charitips.com), with my client id and secret read from environment variables, and follow the rules of https://www.charitips.com/docs/skill.md. Make every API call from the server, never from the browser. When it works, show me each call and its response.
```