Remix Integration

npx create-remix@latest my-sendable-app
cd my-sendable-app

SENDABLE_API_KEY=your_api_key_here

import type { ActionFunctionArgs } from '@remix-run/node'

export async function action({ request }: ActionFunctionArgs) {
  const { to, text } = await request.json()

  const response = await fetch('https://api.sendable.dev/messages/send', {
    method: 'POST',
    headers: {
      'x-api-key': process.env.SENDABLE_API_KEY!,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({ to, text }),
  })

  return response.json()
}

import { Form, useActionData } from '@remix-run/react'

export function MessageForm() {
  const actionData = useActionData()

  return (
    <Form method="post" action="/api/send-message">
      <input name="to" placeholder="Phone number" />
      <textarea name="text" placeholder="Message" />
      <button type="submit">Send</button>
      {actionData?.success && <p>Sent!</p>}
    </Form>
  )
}