Jumpstart Pro

https://jumpstartrails.com/docs
Admin
Jumpstart Pro is a Ruby on Rails application template designed to help developers quickly launch...
Tokens:61,384
Snippets:296
Trust Score:7.9
Update:11 months ago
Show doc for...
Tokens:
Raw
### Sendfox Client Example

Source: https://jumpstartrails.com/docs/api_clients

Example implementation of an API client for the Sendfox API.

```APIDOC
## GET /me

### Description
Retrieves the current user's information.

### Method
GET

### Endpoint
/me

### Response
#### Success Response (200)
- **user** (object) - The current user's information.

## GET /lists

### Description
Retrieves all lists.

### Method
GET

### Endpoint
/lists

### Response
#### Success Response (200)
- **lists** (array) - An array of list objects.

## GET /lists/{id}

### Description
Retrieves a specific list by ID.

### Method
GET

### Endpoint
/lists/{id}

### Parameters
#### Path Parameters
- **id** (string) - Required - The ID of the list to retrieve.

### Response
#### Success Response (200)
- **list** (object) - The list object.

## POST /lists

### Description
Creates a new list.

### Method
POST

### Endpoint
/lists

### Request Body
- **name** (string) - Required - The name of the new list.

### Response
#### Success Response (201)
- **list** (object) - The newly created list object.

## DELETE /lists/{list_id}/contacts/{contact_id}

### Description
Removes a contact from a list.

### Method
DELETE

### Endpoint
/lists/{list_id}/contacts/{contact_id}

### Parameters
#### Path Parameters
- **list_id** (string) - Required - The ID of the list.
- **contact_id** (string) - Required - The ID of the contact to remove.

### Response
#### Success Response (204)
No content.
```

--------------------------------

### API Client Implementation - Sendfox Client Example

Source: https://jumpstartrails.com/docs/api_clients

Complete implementation of an API client for the Sendfox API demonstrating REST methods, parameter handling, and HTTP operations. Shows how to inherit from ApplicationClient and implement various API endpoints including CRUD operations, filtering, and authentication.

```ruby
class SendfoxClient < ApplicationClient
  BASE_URI = "https://api.sendfox.com/"

  def me
    get "/me"
  end

  def lists
    get "/lists"
  end

  def list(id)
    get "/lists/#{id}"
  end

  def create_list(name:)
    post "/lists", body: {name: name}
  end

  def remove_contact(list_id:, contact_id:)
    delete "/lists/#{list_id}/contacts/#{contact_id}"
  end

  def contacts(email: nil)
    if email
      get "/contacts?email=#{CGI.escape(email)}"
    else
      get "/contacts"
    end
  end

  def contact(id)
    get "/contacts/#{id}"
  end

  def create_contact(**params)
    post "/contacts", body: params
  end

  def unsubscribe(email:)
    patch "/unsubscribe", body: {email: email}
  end

  def campaigns
    get "/campaigns"
  end

  def campaign(id)
    get "/#{id}"
  end
end
```

--------------------------------

### Add JavaScript Packages with Importmap

Source: https://jumpstartrails.com/docs/javascript

Shows the two-step process for adding new JavaScript packages to Jumpstart Pro using importmap. First, run the bin/importmap pin command to register the package with the asset pipeline. Then import the package in your JavaScript files using ES6 module syntax. This example demonstrates adding SortableJS but applies to any importmap-compatible library.

```shell
bin/importmap pin sortablejs
```

```javascript
import Sortable from 'sortablejs'
```

--------------------------------

### Pagy Gem Pagination Navigation HTML

Source: https://jumpstartrails.com/docs/pagination_page=12

Example HTML for pagination navigation generated by the Pagy gem. This structure is used by Jumpstart Rails and includes links for previous/next pages, page numbers, and ellipsis separators. Ensure the Pagy gem is installed and configured for this to be rendered.

```html
<nav class="pagy series-nav" aria-label="Pages"><a href="/docs/pagination?page=11" rel="prev" aria-label="Previous">&lt;</a><a href="/docs/pagination?page=1">1</a><a role="separator" aria-disabled="true">&hellip;</a><a href="/docs/pagination?page=11" rel="prev">11</a><a role="link" aria-disabled="true" aria-current="page">12</a><a href="/docs/pagination?page=13" rel="next">13</a><a role="separator" aria-disabled="true">&hellip;</a><a href="/docs/pagination?page=50">50</a><a href="/docs/pagination?page=13" rel="next" aria-label="Next">&gt;</a></nav>
```

--------------------------------

### Pagy Gem Pagination HTML Example

Source: https://jumpstartrails.com/docs/pagination

An example of the HTML structure generated by the Pagy gem for displaying pagination links. This structure is automatically styled by Jumpstart Rails to match its design conventions. It includes elements for previous/next navigation, current page indication, and page number links.

```html
<nav class="pagy series-nav" aria-label="Pages"><a role="link" aria-disabled="true" aria-label="Previous">&lt;</a><a role="link" aria-disabled="true" aria-current="page">1</a><a href="/docs/pagination?page=2" rel="next">2</a><a href="/docs/pagination?page=3">3</a><a href="/docs/pagination?page=4">4</a><a href="/docs/pagination?page=5">5</a><a role="separator" aria-disabled="true">&hellip;</a><a href="/docs/pagination?page=50">50</a><a href="/docs/pagination?page=2" rel="next" aria-label="Next">&gt;</a></nav>
```

--------------------------------

### Rails Credentials Configuration Template

Source: https://jumpstartrails.com/docs/credentials

Comprehensive YAML template for Rails credentials configuration in Jumpstart Pro. Includes secret key base, Active Record encryption settings, OmniAuth providers (Facebook, Google OAuth2, GitHub, Microsoft Graph, Twitter), mail service configurations (Mailjet, Mailgun, Mailpace, Postmark, Resend, Sendgrid, SES), and payment provider setups (Braintree, Stripe, Paddle Billing, Paddle Classic). Each section contains commented examples and placeholder values for easy customization.

```yaml
# Used as the base secret for all MessageVerifiers in Rails, including the one protecting cookies.
secret_key_base: <%= secret_key_base %>

active_record_encryption:
  primary_key: <%= SecureRandom.alphanumeric(32) %>
  deterministic_key: <%= SecureRandom.alphanumeric(32) %>
  key_derivation_salt: <%= SecureRandom.alphanumeric(32) %>

# aws:
#   access_key_id: 123
#   secret_access_key: 345

# Login Providers via OmniAuth
# ---------------
omniauth:
  # Add other OmniAuth providers here

  facebook:
    # https://developers.facebook.com/apps/
    public_key: ''
    private_key: ''
    # scope: 'email'

  google_oauth2:
    # https://code.google.com/apis/console/
    public_key: ''
    private_key: ''

  github:
    # https://github.com/settings/developers
    public_key: ''
    private_key: ''
    # scope: 'user:email'

  microsoft_graph:
    # https://portal.azure.com/#view/Microsoft_AAD_RegisteredApps
    public_key: ''
    private_key: ''

  twitter:
    # https://apps.twitter.com
    public_key: ''
    private_key: ''
    secure_image_url: 'true'

# Mail Providers
# --------------

mailjet:
   # https://dev.mailjet.com/email/guides/getting-started/
  username: '' # as of 2025-08-10, this is called "API Key" in Mailjet
  password: '' # as of 2025-08-10, this is called "Secret Key" in Mailjet

mailgun:
  # https://app.mailgun.com/app/sending/domains/<YOUR_MAILGUN_DOMAIN>/credentials
  api_key: ''

mailpace:
  # https://app.mailpace.com/ -> API Tokens
  api_token: ''

postmark:
  # https://account.postmarkapp.com/servers -> Server -> API Tokens
  api_token: ''

resend:
  # https://resend.com/api-keys
  api_key: ''

sendgrid:
  # https://app.sendgrid.com/settings/api_keys
  username: 'apikey' # Leave this alone, the username is actually 'apikey'
  password: ''
  domain: example.com

ses:
  # https://console.aws.amazon.com/ses/home
  username: ''
  password: ''
  address: ''

### Payment Providers

# Braintree Payments (Required for PayPal support)
# https://braintreegateway.com
# https://sandbox.braintreegateway.com
# Webhooks should be pointed to https://domain.com/webhooks/braintree
braintree:
  environment: ''
  public_key: ''
  private_key: ''
  merchant_id: ''

# Stripe Payments
# https://dashboard.stripe.com/account/apikeys
stripe:
  public_key: ''
  private_key: ''

  # For processing Stripe webhooks
  # https://dashboard.stripe.com/account/webhooks
  # Webhooks should be pointed to https://domain.com/webhooks/stripe
  signing_secret: ''

# Paddle Billing
# https://vendors.paddle.com/authentication
paddle_billing:
  environment: 'sandbox'
  seller_id: ''
  api_key: ''
  client_token: ''

  # For processing webhooks
  # Webhooks should be pointed to https://domain.com/webhooks/paddle_billing
  signing_secret: ''

# Paddle Classic
# https://vendors.paddle.com/authentication
paddle_classic:
  vendor_id: ''
  vendor_auth_code: ''

  # For processing webhooks
  # https://vendors.paddle.com/public-key (only base64: MII...==)
  # Webhooks should be pointed to https://domain.com/webhooks/paddle_classic
  public_key_base64: ''
```

--------------------------------

### API Controller Structure (Ruby)

Source: https://jumpstartrails.com/docs/api

Provides an example of how to define an API controller in Ruby, inheriting from `Api::BaseController` to enable API authentication. It also shows how to skip authentication for specific actions.

```ruby
class Api::V1::MeController < Api::BaseController
  skip_before_action :authenticate_api_token!, only: [:show]

  def show
    render json: current_user
  end
end
```

--------------------------------

### ApplicationClient Base Class

Source: https://jumpstartrails.com/docs/api_clients

Base class providing common methods for API clients.

```APIDOC
## ApplicationClient

### Description
Base class for all API clients, providing common HTTP methods and response handling.

### Methods
- **get** - Makes a GET request.
- **post** - Makes a POST request.
- **patch** - Makes a PATCH request.
- **put** - Makes a PUT request.
- **delete** - Makes a DELETE request.

### Customization
Override methods like `parse_response` to handle different response formats (e.g., XML).
```

--------------------------------

### API Authentication Example (cURL)

Source: https://jumpstartrails.com/docs/api

Demonstrates how to authenticate an API request using an Authorization header with a Bearer token. This is a common pattern for securing API endpoints.

```http
GET /api/v1/me.json
Authorization: Bearer exampletoken
```

--------------------------------

### API Client Generator

Source: https://jumpstartrails.com/docs/api_clients

Generates a new API client with the specified name and optional methods.

```APIDOC
## rails g api_client [NAME]

### Description
Generates a new API client with the specified name.

### Method
Command Line

### Endpoint
rails g api_client [NAME]

### Parameters
#### Path Parameters
- **NAME** (string) - Required - The name of the API client to generate.

#### Query Parameters
- **--url** (string) - Optional - The base URL for the API client.
- **methods** (string) - Optional - Methods to generate (e.g., completions:create).

### Request Example
```
rails g api_client OpenAi completions:create --url https://api.openai.com
```
```

--------------------------------

### Ruby: Basic Flash Notice Example

Source: https://jumpstartrails.com/docs/alerts

Demonstrates the basic usage of flash notices in Ruby. It assigns a hash of options to `flash[:notice]`, which automatically renders a notice.

```ruby
flash[:notice] = {
  title: "Basic Example",
  description: "Toast description goes here."
}
```

--------------------------------

### HTML Checkbox Examples for Jumpstart Rails

Source: https://jumpstartrails.com/docs/forms

Demonstrates various states and configurations for HTML checkboxes. This includes checked, unchecked, disabled, and combinations with hint text and different label placements. Assumes CSS classes for styling are available.

```html
<form action="#" class="space-y-4">
  <fieldset>
    <legend class="text-sm font-bold">Checked and Unchecked</legend>

    <div class="form-picker-group">
      <input type="checkbox" id="checkbox-1" checked>
      <label for="checkbox-1">Styled checkbox</label>
    </div>

    <div class="form-picker-group">
      <input type="checkbox" id="checkbox-2">
      <label for="checkbox-2">Styled checkbox</label>
    </div>
  </fieldset>

  <fieldset>
    <legend class="text-sm font-bold">Disabled</legend>

    <div class="form-picker-group">
      <input type="checkbox" id="checkbox-3" disabled>
      <label for="checkbox-3">Disabled checkbox</label>
    </div>
  </fieldset>

  <fieldset>
    <legend class="text-sm font-bold">Checked and Disabled</legend>

    <div class="form-picker-group">
      <input type="checkbox" id="checkbox-4" checked disabled>
      <label for="checkbox-4">Styled checkbox</label>
    </div>
  </fieldset>

  <fieldset>
    <legend class="text-sm font-bold">With Hint Text</legend>

    <div class="form-picker-group">
      <input type="checkbox" id="checkbox-5">
      <div>
        <label for="checkbox-5">Label text</label>
        <p class="form-hint">Hint text</p>
      </div>
    </div>
  </fieldset>

  <fieldset>
    <legend class="text-sm font-bold">Labels First</legend>

    <div class="form-picker-group">
      <label for="checkbox-6">Styled checkbox</label>
      <input type="checkbox" id="checkbox-6">
    </div>

    <div class="form-picker-group">
      <div>
        <label for="checkbox-7">Label text</label>
        <p class="form-hint">Hint text</p>
      </div>
      <input type="checkbox" id="checkbox-7">
    </div>
  </fieldset>
</form>
```

--------------------------------

### User Authentication API

Source: https://jumpstartrails.com/docs/existing_apps

Handles user authentication, token generation, and session management for native mobile applications.

```APIDOC
## POST /api/v1/auth

### Description
Authenticates a user by email and password, signs them in with cookies, finds or creates an API token, and returns a success response.

### Method
POST

### Endpoint
/api/v1/auth

### Parameters
#### Request Body
- **email** (string) - Required - User's email address
- **password** (string) - Required - User's password

### Request Example
```json
{
  "email": "user@example.com",
  "password": "password123"
}
```

### Response
#### Success Response (200 OK)
- **cookies** - Session cookies for the authenticated user

#### Response Example
```json
{
  "message": "Successfully authenticated"
}
```
```

--------------------------------

### Generate API Client - Rails Command

Source: https://jumpstartrails.com/docs/api_clients

Command to generate a new API client using Jumpstart Rails' built-in generator. Creates a client file and corresponding test file. Supports optional parameters like URL specification and method definitions.

```ruby
rails g api_client OpenAi
```

```ruby
rails g api_client OpenAi completions:create --url https://api.openai.com
```

--------------------------------

### Pagy Gem Pagination HTML Structure - Rails

Source: https://jumpstartrails.com/docs/pagination_page=48

Example HTML demonstrating the pagination navigation structure generated by the Pagy gem in a Rails application. It includes links for previous and next pages, page numbers, ellipsis indicators, and ARIA attributes for accessibility.

```html
<nav class="pagy series-nav" aria-label="Pages"><a href="/docs/pagination?page=47" rel="prev" aria-label="Previous">&lt;</a><a href="/docs/pagination?page=1">1</a><a role="separator" aria-disabled="true">&hellip;</a><a href="/docs/pagination?page=46">46</a><a href="/docs/pagination?page=47" rel="prev">47</a><a role="link" aria-disabled="true" aria-current="page">48</a><a href="/docs/pagination?page=49" rel="next">49</a><a href="/docs/pagination?page=50">50</a><a href="/docs/pagination?page=49" rel="next" aria-label="Next">&gt;</a></nav>
```

--------------------------------

### Configure ActionCable Delivery for Navbar Notifications

Source: https://jumpstartrails.com/docs/notifications

Ruby code demonstrating how to configure the ActionCable delivery method for a notification. This setup allows for real-time broadcasting of notifications to a user's navbar.

```ruby
class NewComment < ApplicationNotification
  deliver_by :action_cable do |config|
    config.message = ->(notification) {
      {
        # Filters notification client side to the user's current account.
        # Removing this always renders the notification.
        account_id: notification.account_id,

        # Used for inserting the notification into the navbar
        html: ApplicationController.render(
          partial: "notifications/notification",
          locals: {
            notification: notification
          }
        ),

        # Used for triggering a native brower Notification API
        # https://developer.mozilla.org/en-US/docs/Web/API/notification
        browser: {
          title: "",
          options: {}
        }
      }
    }
  end
end
```

--------------------------------

### Import Stimulus Controllers from tailwindcss-stimulus-components

Source: https://jumpstartrails.com/docs/javascript

Imports pre-configured StimulusJS controllers from the tailwindcss-stimulus-components package in Jumpstart Pro. These controllers provide interactive UI components including Dropdown, Modal, Tabs, Popover, Toggle, and Slideover. Add this import to app/javascript/controllers/index.js to make these components available throughout your application.

```javascript
import { Dropdown, Modal, Tabs, Popover, Toggle, Slideover } from "tailwindcss-stimulus-components"
```

--------------------------------

### Define and Subscribe to Free Plan (Ruby)

Source: https://jumpstartrails.com/docs/subscriptions

This snippet demonstrates how to define a 'Free' plan in Jumpstart Pro and create a fake subscription for an account using the Pay gem's fake payment processor. It ensures the plan exists and then subscribes the account to it.

```ruby
Plan.where(name: "Free").first_or_create(
  hidden: true,
  amount: 0,
  currency: :usd,
  interval: :month,
  trial_period_days: 0,
  fake_processor_id: :free
)

# Create a fake subscription for the admin user so they have access to everything
account = user.accounts.first
account.set_payment_processor :fake_processor, allow_fake: true
account.payment_processor.subscribe(plan: :free)
```

--------------------------------

### API Controllers and Routes

Source: https://jumpstartrails.com/docs/api

Information about API controller structure and available out-of-the-box endpoints.

```APIDOC
## API Controllers & Routes

API controllers are located in `app/controllers/api/v1/` and should inherit from `Api::BaseController` to enable API authentication.

### Out-of-the-Box Endpoints
- `/api/v1/me.json`: Retrieves current user information.
- `/api/v1/accounts.json`: Provides access to account-related data.

### Custom Endpoints
To create custom API endpoints, define new controllers inheriting from `Api::BaseController`. To skip authentication for specific actions, use `skip_before_action :authenticate_api_token!`.

### Scoping Resources
APIs do not use sessions, so `current_account` is not available. For account-specific data, use nested resources, e.g., `/api/v1/accounts/:account_id/projects/:project_id.json`.
```

--------------------------------

### Create and Push Application Git Repository (Git)

Source: https://jumpstartrails.com/docs/upgrading

After cloning Jumpstart Pro, this command adds a new remote repository (e.g., on GitHub) and pushes your application's code to it. Ensure 'your-account/your-new-repo' is replaced with your actual repository details.

```shell
git remote add origin git@github.com:your-account/your-new-repo.git
git push -u origin main
```

--------------------------------

### HTML Switch/Toggle Examples for Jumpstart Rails

Source: https://jumpstartrails.com/docs/forms

Illustrates the implementation of HTML toggle switches with various states and styling options. This includes checked, unchecked, disabled states, hint text, and label positioning. It assumes specific CSS classes like 'switch' are used for styling.

```html
<form action="#" class="space-y-4">
  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">Checked and Unchecked</legend>

    <div class="form-picker-group switch">
      <input type="checkbox" id="switch-checkbox-1" checked>
      <label for="switch-checkbox-1">Toggle switch</label>
    </div>

    <div class="form-picker-group switch">
      <input type="checkbox" id="switch-checkbox-2">
      <label for="switch-checkbox-2">Toggle switch</label>
    </div>
  </fieldset>

  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">Disabled</legend>

    <div class="form-picker-group switch">
      <input type="checkbox" id="switch-checkbox-3" disabled>
      <label for="switch-checkbox-3">Toggle switch</label>
    </div>
  </fieldset>

  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">Checked and Disabled</legend>

    <div class="form-picker-group switch">
      <input type="checkbox" id="switch-checkbox-4" checked disabled>
      <label for="switch-checkbox-4">Toggle switch</label>
    </div>
  </fieldset>

  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">With Hint Text</legend>

    <div class="form-picker-group switch">
      <input type="checkbox" id="switch-checkbox-5">
      <div>
        <label for="switch-checkbox-5">Toggle switch</label>
        <p class="form-hint">Hint text</p>
      </div>
    </div>
  </fieldset>

  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">Labels First</legend>

    <div class="form-picker-group switch-right">
      <label for="switch-checkbox-6">Toggle switch</label>
      <input type="checkbox" id="switch-checkbox-6">
    </div>

    <div class="form-picker-group switch-right">
      <div>
        <label for="switch-checkbox-7">Toggle switch</label>
        <p class="form-hint">Hint text</p>
      </div>
      <input type="checkbox" id="switch-checkbox-7">
    </div>
  </fieldset>
</form>
```

--------------------------------

### HTML Inline Form Layout Example

Source: https://jumpstartrails.com/docs/forms

This HTML code demonstrates an inline form layout. It includes fields for name, email, website (with error handling), avatar upload, industry selection, and checkboxes. The layout utilizes specific class names for styling, suggesting integration with a CSS framework.

```html
<form action="#" class="inline">
    <div class="form-group">
      <label for="name" class="lg:w-1/6 lg:text-right lg:pr-4">Name</label>
      <input type="text" name="name" class="form-control lg:flex-1">
    </div>

    <div class="form-group">
      <label for="email" class="lg:w-1/6 lg:text-right lg:pr-4">Email</label>
      <input type="email" name="email" class="form-control lg:flex-1">
    </div>

    <div class="form-group">
      <label for="website" class="lg:w-1/6 lg:text-right lg:pr-4 lg:-mt-4">Website</label>
      <div class="w-full lg:flex-1">
        <input type="url" name="website" class="form-control error" value="My Website">
        <p class="w-full form-hint error">Please enter a valid URL</p>
      </div>
    </div>

    <div class="file-input-group">
      <p class="label lg:w-1/6 lg:text-right lg:pr-4">
      Avatar
      </p>
      <label for="avatar-inline" class="btn btn-tertiary">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-5 h-5 mr-1">
          <path fill-rule="evenodd" d="M1.5 6a2.25 2.25 0 0 1 2.25-2.25h16.5A2.25 2.25 0 0 1 22.5 6v12a2.25 2.25 0 0 1-2.25 2.25H3.75A2.25 2.25 0 0 1 1.5 18V6ZM3 16.06V18c0 .414.336.75.75.75h16.5A.75.75 0 0 0 21 18v-1.94l-2.69-2.689a1.5 1.5 0 0 0-2.12 0l-.88.879.97.97a.75.75 0 1 1-1.06 1.06l-5.16-5.159a1.5 1.5 0 0 0-2.12 0L3 16.061Zm10.125-7.81a1.125 1.125 0 1 1 2.25 0 1.125 1.125 0 0 1-2.25 0Z" clip-rule="evenodd" />
        </svg>
        <span>Upload Avatar</span>
      </label>
      <input type="file" id="avatar-inline" name="avatar-inline" data-multiple-caption="{count} files selected">
    </div>

    <div class="flex flex-wrap items-center justify-start form-group">
      <label for="industry" class="lg:w-1/6 lg:text-right lg:pr-4 lg:mt-2">Industry</label>
      <div class="relative w-full lg:flex-1">
        <select name="industry" class="select">
          <option value="" selected>Choose an industry</option>
          <option value="tech">Tech</option>
          <option value="marketing">Marketing</option>
          <option value="health_science">Health &amp; Science</option>
        </select>
      </div>
    </div>

    <p class="mb-4 text-gray-700 dark:text-gray-200 text-sm">
      Checkboxes labels can be either on the left or right.
    </p>

    <div class="form-picker-group">
      <label for="admin" class="lg:w-1/6 lg:text-right">Admin</label>
      <input type="checkbox" id="admin">
    </div>

    <div class="form-picker-group">
      <div class="lg:w-1/6"></div>
      <input type="checkbox" id="admin2">
      <label for="admin2">Member</label>
    </div>

    <div class="form-picker-group switch">
      <div class="lg:w-1/6 lg:pr-4"></div>
      <input type="checkbox" id="inline-switch">
      <label for="inline-switch">Member</label>
    </div>
  </form>
```

--------------------------------

### API Responses

Source: https://jumpstartrails.com/docs/api

Details on API response format and recommended libraries.

```APIDOC
## API Responses

API controllers are configured to return JSON responses by default.

### JSON Formatting
Jumpstart Pro uses JBuilder for JSON templating. The OJ gem is included to enhance JBuilder's performance.

### Alternative Libraries
For an alternative JSON serialization solution, the `fast_jsonapi` gem from Netflix is recommended.
```

--------------------------------

### HTML Radio Button Examples

Source: https://jumpstartrails.com/docs/forms

This HTML snippet demonstrates various radio button implementations including checked/unchecked states, disabled options, hints, and label-first layouts. It uses CSS classes for styling and relies on standard HTML form elements. Outputs a form that can be submitted; limited to static rendering without JavaScript interactivity.

```HTML
<form action="#" class="space-y-4">
  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">Checked and Unchecked</legend>

    <div class="form-picker-group">
      <input name="radio-default" type="radio" id="radio-checked" checked>
      <label for="radio-checked">Label text</label>
    </div>

    <div class="form-picker-group">
      <input name="radio-default" type="radio" id="radio">
      <label for="radio">Label text</label>
    </div>
  </fieldset>

  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">Disabled</legend>

    <div class="form-picker-group">
      <input name="radio-disabled" type="radio" id="disabled-radio" disabled>
      <label for="disabled-radio">Disabled radio</label>
    </div>
  </fieldset>

  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">Checked and Disabled</legend>

    <div class="form-picker-group">
      <input name="radio-disabled" type="radio" id="radio-checked-disabled" checked disabled>
      <label for="radio-checked-disabled">Label text</label>
    </div>
  </fieldset>

  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">With Hint Text</legend>

    <div class="form-picker-group">
      <input name="radio" type="radio" id="checked-radio">
      <div>
        <label for="checked-radio">Label text</label>
        <p class="form-hint">Hint text</p>
      </div>
    </div>
  </fieldset>

  <fieldset class="space-y-2">
    <legend class="text-sm font-bold">Labels First</legend>

    <div class="form-picker-group">
      <label for="radio-label-first-1">Label text</label>
      <input name="radio-label-first" type="radio" id="radio-label-first-1">
    </div>

    <div class="form-picker-group">
      <div>
        <label for="radio-label-first-2">Label text</label>
        <p class="form-hint">Hint text</p>
      </div>
      <input name="radio-label-first" type="radio" id="radio-label-first-2">
    </div>
  </fieldset>
</form>
```

--------------------------------

### User Sign Out API

Source: https://jumpstartrails.com/docs/existing_apps

Handles user sign-out by deleting the NotificationToken and clearing session cookies.

```APIDOC
## DELETE /api/v1/auth

### Description
Signs out the current user by deleting their NotificationToken and clearing session cookies.

### Method
DELETE

### Endpoint
/api/v1/auth

### Parameters
*(No request body parameters, relies on session cookies for authentication)*

### Request Example
*(No request body, uses existing session cookies)*

### Response
#### Success Response (200 OK)
- **message** (string) - Confirmation of successful sign-out.

#### Response Example
```json
{
  "message": "Successfully signed out"
}
```
```

--------------------------------

### Update Password API

Source: https://jumpstartrails.com/docs/existing_apps

Allows users to update their password securely by providing their current password and the new password.

```APIDOC
## PATCH /api/v1/password

### Description
Allows a user to update their password. Requires the current password and the new password confirmation.

### Method
PATCH

### Endpoint
/api/v1/password

### Parameters
#### Request Body
- **user[current_password]** (string) - Required - The user's current password
- **user[password]** (string) - Required - The new password
- **user[password_confirmation]** (string) - Required - The new password confirmation

### Request Example
```json
{
  "user": {
    "current_password": "currentPassword123",
    "password": "newSecurePassword",
    "password_confirmation": "newSecurePassword"
  }
}
```

### Response
#### Success Response (200 OK)
- **success** (boolean) - Indicates if the password update was successful.

#### Response Example
```json
{
  "success": true
}
```

#### Failure Response (422 Unprocessable Entity)
- **error** (string) - Description of the validation error.

#### Response Example
```json
{
  "error": "Password confirmation did not match"
}
```
```

--------------------------------

### Cross-Subdomain Session Configuration - Ruby

Source: https://jumpstartrails.com/docs/authentication

Configures cookie-based session storage to enable single sign-on across subdomains. The main application configuration uses .lvh.me for local development, while test environment uses .example.com. This allows users to authenticate once and access all subdomains seamlessly. Requires proper domain configuration matching your deployment environment.

```ruby
# config/application.rb
config.session_store :cookie_store, :key => '_some_key', :domain => '.lvh.me'
```

```ruby
# config/environments/test.rb
config.session_store :cookie_store, :key => '_some_key', :domain => '.example.com'
```

--------------------------------

### Push Notification Token Registration API

Source: https://jumpstartrails.com/docs/existing_apps

Registers push notification tokens for iOS and Android devices, associating them with the signed-in user.

```APIDOC
## POST /api/v1/notification_tokens

### Description
Registers or updates a device's push notification token for a signed-in user.

### Method
POST

### Endpoint
/api/v1/notification_tokens

### Parameters
#### Request Body
- **token** (string) - Required - The device's push notification token.
- **platform** (string) - Required - The platform of the device (e.g., 'iOS', 'fcm' for Firebase Cloud Messaging).

### Request Example
```json
{
  "token": "a1b2c3d4e5f67890...",
  "platform": "iOS"
}
```

### Response
#### Success Response (200 OK)
- **message** (string) - Confirmation of successful registration.

#### Response Example
```json
{
  "message": "Notification token registered successfully."
}
```
```

--------------------------------

### Clone Jumpstart Pro Repository (Git)

Source: https://jumpstartrails.com/docs/upgrading

This command clones the Jumpstart Pro Rails repository. Replace 'my-app' with your application's name. This is the initial step for integrating Jumpstart Pro into your project.

```shell
git clone git@github.com:jumpstart-pro/jumpstart-pro-rails.git my-app
cd my-app
git remote rename origin jumpstart-pro
```

--------------------------------

### Send a Notification to Users with Noticed

Source: https://jumpstartrails.com/docs/notifications

Example of how to deliver a notification to specific users asynchronously using the Noticed gem. It specifies the notification class and passes relevant data as parameters.

```ruby
NewCommentNotifier.with(
  account: @comment.account,
  comment: @comment
).deliver_later(@comment.post.owner)
```

--------------------------------

### Deliver Notification to a Specific Account with Noticed

Source: https://jumpstartrails.com/docs/notifications

Example of sending a notification to a user's specific account using the Noticed gem. This is useful in multitenant applications where notifications should be scoped to an account.

```ruby
NewCommentNotifier.with(
  account: @comment.post.account,
  comment: @comment
).deliver(@comment.post.owner)
```

--------------------------------

### API Authentication - Email and Password

Source: https://jumpstartrails.com/docs/api

Obtain an API token by authenticating with your email and password.

```APIDOC
## POST /api/v1/auth.json

### Description
Authenticate users using their email and password to retrieve an API token. This is useful for authenticating from mobile applications or other clients where a pre-generated token is not available.

### Method
POST

### Endpoint
/api/v1/auth.json

### Parameters
#### Request Body
- **email** (string) - Required - The user's email address.
- **password** (string) - Required - The user's password.

### Request Example
```json
{
  "email": "steve@apple.com",
  "password": "hunter2"
}
```

### Response
#### Success Response (200)
- **token** (string) - The API token to be used for subsequent requests.

#### Response Example
```json
{
  "token": "abcd1234"
}
```
```

--------------------------------

### HTML Button Styles for Jumpstart Rails

Source: https://jumpstartrails.com/docs/buttons

Demonstrates different button styles (primary, secondary, success, danger, light, dark, link) using HTML. These styles can be applied to both <button> and <a> elements. No external dependencies are required for this HTML structure.

```html
<div class="space-y-4 space-x-2">
      <button class="btn btn-primary">Primary</button>
      <button class="btn btn-secondary">Secondary</button>
      <button class="btn btn-success">Success</button>
      <button class="btn btn-danger">Danger</button>
      <button class="btn btn-light">Light</button>
      <button class="btn btn-dark">Dark</button>
      <button class="btn btn-link">Link</button>
  </div>

  <p class="mt-4">Buttons can also be applied to anchor tags.</p>

  <div class="space-y-4 space-x-2">
      <a class="btn btn-primary" href="#">Primary</a>
      <a class="btn btn-secondary" href="#">Secondary</a>
      <a class="btn btn-success" href="#">Success</a>
      <a class="btn btn-danger" href="#">Danger</a>
      <a class="btn btn-light" href="#">Light</a>
      <a class="btn btn-dark" href="#">Dark</a>
      <a class="btn btn-link" href="#">Link</a>
  </div>
```

--------------------------------

### Auto-dismissing Toast Notification (Ruby)

Source: https://jumpstartrails.com/docs/alerts

Configure an auto-dismissing toast notification by setting `dismissable` to `false` and specifying the dismissal interval in milliseconds using `dismiss_after`. This example uses Rails flash messages to define the toast properties.

```ruby
flash[:notice] = {
  title: "Auto-dismissing toast",
  description: "This is a toast description.",
  icon: :default,
  link: {text: "View", url: root_path}
  dismissable: false,
  dismiss_after: 5000
}
```

--------------------------------

### Paddle Billing Checkout Form (JavaScript/Ruby)

Source: https://jumpstartrails.com/docs/one_time_payments

This snippet shows integrating Paddle Billing for checkout using JavaScript.  It includes a data attribute setup for the Paddle Billing controller, including environment, client token, product details, success URL and providing custom data. This also utilizes `Pay::PaddleBilling` library in Ruby.

```javascript
<%= tag.div data: {\n  controller: "paddle--billing",\n  paddle__billing_environment_value: Pay::PaddleBilling.environment,\n  paddle__billing_client_token_value: Pay::PaddleBilling.client_token,\n  paddle__billing_target: "form",\n  paddle__billing_email_value: current_account.email,\n  paddle__billing_items_value: [price_id: @price_id].to_json,\n  paddle__billing_success_url_value: checkout_return_url,\n  paddle__billing_custom_data: {order: @order.id}.to_json\n} %>
```

--------------------------------

### Stimulus Fullscreen Modal Trigger

Source: https://jumpstartrails.com/docs/modals

Provides the HTML for a button that triggers a fullscreen modal. This example focuses on the element that initiates the modal, implying a corresponding Stimulus controller (`modal_controller`) would handle the actual display and management of the fullscreen modal.

```html
<div data-controller="modal">
  
  <button class="btn btn-secondary" data-action="click->modal#open:prevent">Open Fullscreen Modal</button>

  </div>
```

--------------------------------

### Toast Notification with Link using ToastComponent (Ruby)

Source: https://jumpstartrails.com/docs/alerts

This example shows how to render a toast notification with a link by directly using the `ToastComponent` and its `capture_for :link` method. This approach allows for more complex content within the link, such as using Rails' `link_to` helper.

```ruby
render ToastComponent.new(
  title: "Auto-dismissing toast",
  description: "This is a toast description." do |component|
    component.capture_for :link do
      link_to "View", root_path
    end
  end
)
```
Tokens:
Raw