Skip to content

Project APIs Docs #390

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 5 commits into
base: main
Choose a base branch
from
Draft

Project APIs Docs #390

wants to merge 5 commits into from

Conversation

pinkeshmars
Copy link
Collaborator

Description

Project APIs Docs

Linear ticket and magic word Fixes DEVR-XXX

Type of change

  • Typo fix
  • New feature
  • Enhancement to current docs
  • Removed outdated references
  • Update assets

Copy link

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

Copy link
Contributor

@michael-mcroskey michael-mcroskey left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Lgtm with some minor comments!

Just thinking for the future, it would be great to build out our API documentation more heavily (since there are like 10+ endpoints actually available!). Will follow up later with thoughts!


FlutterFlow provides different API endpoints for various environments. Use the appropriate base URL below depending on your needs:

#### Production:
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: possible to put these (including enterprise) in tabs?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, done!

- **Paid Plan**: You need a paid [**FlutterFlow subscription plan**](https://www.flutterflow.io/pricing).

:::

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It might make sense to do a brief overview of what the YAML represents. Feel free to add/remove/tweak portions, but basically a "what/why" before getting into the "how"

## Background

### What are FlutterFlow Project YAMLs?

YAML (YAML Ain't Markup Language) is a human-readable data serialization format commonly used for configuration files. In FlutterFlow, **Project YAMLs represent the complete structural definition of your app** — essentially exposing the full project schema that powers your FlutterFlow application.

### What's Included in the Project Schema?

FlutterFlow's YAML files contain a comprehensive representation of your entire project, including:

- **UI Components & Pages**: Widget trees, page layouts, component hierarchies, and styling configurations
- **App Configuration**: Settings like app details, authentication methods, integrations (AdMob, Firebase, etc.)
- **Data Structures**: Database collections, API schemas, app state variables, and custom data types
- **Business Logic**: Actions, functions, conditional logic, and workflow definitions
- **Assets & Resources**: Custom code files, images references, fonts, and other project assets
- **Project Organization**: Folder structures, component libraries, and project metadata

### YAML vs. FlutterFlow UI

Every change you make in the FlutterFlow visual editor — from dragging a widget onto a page to configuring a database collection — is ultimately stored as structured data in these YAML files. The FlutterFlow UI provides an intuitive visual interface for editing this underlying schema, while the Project API gives you direct programmatic access to the same data.

### File Structure

FlutterFlow automatically partitions your project into logical YAML files for optimal performance and organization. Each file represents a specific aspect of your project (e.g., `app-state`, `ad-mob`, individual pages, collections, etc.), making it easy to target specific updates without affecting the entire project.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, just changed the title 'Background' to 'YAML Overview'


### Validate Project YAML

You must validate the YAML content before applying changes to ensure it's properly formatted and contains valid values.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@victoriahuang1 if a user does not validate the YAML content before attempting a change, will it always fail?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No. But validating will ensure that your YAML can be accepted

:::info

- In the `fileContent` object, you must provide the **entire content** of the file.
- The YAML content must be passed as a **single-line string** with correct formatting and appropriate escaping for new lines and indentation. For example, in the `fileContent` object, you see the actual multiline YAML content, which is not allowed ❌.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: "For example, in the following fileContent object..."

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done!


Let’s walk through a practical example of updating an app state variable using the Project APIs.

First, we use the `/listPartitionedFileNames` endpoint to check if the `app-state` file exists in the project. Once confirmed, we call the `/projectYamls` endpoint to download the YAML file. The API returns a base64-encoded string representing a zip file, which we decode and download using tools like [Base64 to ZIP](https://b64encode.com/tools/base64-to-zip/).
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Our of curiosity, if it doesn't exist, does making the same call create it?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can create new files when uploading file contents via the update endpoint


## Rate Limits

Please be mindful of API rate limits. If you're making many requests, implement appropriate delays between calls to avoid being rate-limited.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@victoriahuang1 can you confirm if there are rate limits? If so, it would be great to document them explicitly.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@michael-mcroskey they will be forwarded to our default API rate limits. Lmk if you want us to set custom rate limits for these specific endpoints

rule {
    action  = "throttle"
    preview = false
    # Should have lower priority than the other API methods.
    priority    = 999
    description = "other API methods"

    match {
      expr {
        expression = "!request.path.contains(\"/cf/\")"
      }
    }

    rate_limit_options {
      ban_duration_sec = 0
      conform_action   = "allow"
      enforce_on_key   = "HTTP_HEADER"
      # Header name with auth token
      enforce_on_key_name = "authorization"
      exceed_action       = "deny(429)"

      rate_limit_threshold {
        count        = 30
        interval_sec = 300
      }
    }
  }

Comment on lines +127 to +130
"versionInfo": {
"partitionerVersion": 6,
"projectSchemaFingerprint": "abc123"
},

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

explain that this should be used for api versioning

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@victoriahuang1 I didn't get this! Could you please elaborate on this? How can it be used for api versioning?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is how our APIs are versioned -- this is the version info.
If any part of this changes, that means that our API has been updated and the format of our responses has changed

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done! added.


### Validate Project YAML

You must validate the YAML content before applying changes to ensure it's properly formatted and contains valid values.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No. But validating will ensure that your YAML can be accepted


Let’s walk through a practical example of updating an app state variable using the Project APIs.

First, we use the `/listPartitionedFileNames` endpoint to check if the `app-state` file exists in the project. Once confirmed, we call the `/projectYamls` endpoint to download the YAML file. The API returns a base64-encoded string representing a zip file, which we decode and download using tools like [Base64 to ZIP](https://b64encode.com/tools/base64-to-zip/).

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can create new files when uploading file contents via the update endpoint


## Rate Limits

Please be mindful of API rate limits. If you're making many requests, implement appropriate delays between calls to avoid being rate-limited.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@michael-mcroskey they will be forwarded to our default API rate limits. Lmk if you want us to set custom rate limits for these specific endpoints

rule {
    action  = "throttle"
    preview = false
    # Should have lower priority than the other API methods.
    priority    = 999
    description = "other API methods"

    match {
      expr {
        expression = "!request.path.contains(\"/cf/\")"
      }
    }

    rate_limit_options {
      ban_duration_sec = 0
      conform_action   = "allow"
      enforce_on_key   = "HTTP_HEADER"
      # Header name with auth token
      enforce_on_key_name = "authorization"
      exceed_action       = "deny(429)"

      rate_limit_threshold {
        count        = 30
        interval_sec = 300
      }
    }
  }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants