CoStar

Before any FlutterFlow or Firebase work, you need CoStar API credentials. Unlike most developer APIs, CoStar does not have a self-serve signup — access is negotiated alongside your data subscription. Here is how to approach the process most effectively. Contact your CoStar account manager (if you have an existing subscription) or reach out to CoStar sales via costar.com/contact. Be specific in your request — CoStar's team approves API access more readily when your use case is clear and well-scoped. Prepare the following before making contact: 1. Your existing CoStar subscription account number and contact name 2. A description of the application you are building (what type of app, who will use it, how data will be displayed) 3. The specific data products you need access to: property search, comparable transactions, market analytics, tenant data — each may be a separate licensed product 4. Your intended data usage and redistribution approach (will data be cached? shown to authenticated users only?) Do NOT expect an instant turnaround. Enterprise API approvals at CoStar typically take several business days to a few weeks depending on your account relationship and the complexity of your use case. During this time, build your FlutterFlow app structure and Firebase Function using a self-serve alternative API (ATTOM, Regrid, or Estated — see Step 6 below). Once approved, CoStar will provide API documentation, a sandbox environment, credentials (API key, OAuth credentials, or Basic Auth — the exact auth mechanism varies by contract), and endpoint documentation specific to your licensed data products.

Before writing a single line of code, you need to understand what CoStar's data contract allows you to do — because these restrictions directly affect your FlutterFlow app's architecture. Key restrictions that affect your build: 1. Authentication requirement: CoStar data must be shown only to authenticated, licensed users. Do not display CoStar data on any public-facing page or to unauthenticated app users. In FlutterFlow, every screen showing CoStar data must be behind an auth gate (Firebase Auth or Supabase Auth). 2. No mass redistribution: You cannot copy CoStar data into a publicly readable Firestore collection, expose it via an unauthenticated API, or export it to a spreadsheet that gets distributed externally. The Firebase Function should return data on-demand — do not build a sync job that copies CoStar records into your database. 3. Endpoint scope is contract-bound: If your license covers property search but not comparable transactions, API calls to the comparables endpoint will return 403 Forbidden. Plan your UI to only show data products included in your contract, and handle 403s gracefully. 4. Display attribution: CoStar typically requires attribution (data attribution labels, source credits) in the UI displaying their data. Check your contract's display requirements before finalizing the UI. These constraints do not make the integration impossible, but they mean your Firebase Function should be designed for on-demand data fetch (not bulk sync), and all CoStar-powered screens should live behind authentication.

Once you receive CoStar API credentials (the exact format depends on your contract — API key, Basic Auth credentials, or OAuth2 client credentials), configure them as Firebase Functions environment variables. Go to Firebase Console → Functions → Configuration and add: COSTAR_BASE_URL (the versioned base URL from your contract documentation, e.g., https://api.costar.com/v2), COSTAR_API_KEY (or COSTAR_USERNAME and COSTAR_PASSWORD for Basic Auth), and COSTAR_SANDBOX=true during testing. CoStar credentials are licensed enterprise secrets — they represent contractual access to proprietary data. They cannot be placed in a FlutterFlow API Call header or an App Values constant. The Firebase Function is not optional here, even for a read-only dashboard. Write the Function to expose the endpoints you have licensed. The example below shows a pattern that handles property search and market analytics. Your exact endpoint paths, query parameter names, and response schemas will come from the API documentation CoStar provides — these vary by contract and are not publicly available. The Function should also enforce that only authenticated requests from your app trigger CoStar API calls — add a simple shared API key check between FlutterFlow and the Function, or use Firebase Auth token verification to ensure only logged-in users can hit the Function.

1// functions/index.js
2const functions = require('firebase-functions');
3const admin = require('firebase-admin');
4const fetch = require('node-fetch');
5admin.initializeApp();
6
7const COSTAR_BASE = process.env.COSTAR_BASE_URL;
8const COSTAR_API_KEY = process.env.COSTAR_API_KEY;
9
10// Add your auth mechanism per CoStar contract:
11// Basic: Buffer.from(`${user}:${pass}`).toString('base64')
12// Bearer: 'Bearer ' + COSTAR_API_KEY
13const authHeader = { Authorization: 'Bearer ' + COSTAR_API_KEY };
14
15exports.costarData = functions.https.onRequest(async (req, res) => {
16  res.set('Access-Control-Allow-Origin', '*');
17  if (req.method === 'OPTIONS') { res.status(204).send(''); return; }
18
19  try {
20    const { action, submarket, propertyType, minSize, maxSize, propertyId } = req.body;
21    let url;
22
23    if (action === 'searchProperties') {
24      // Replace with your actual CoStar endpoint path from contract docs
25      url = `${COSTAR_BASE}/properties/search?submarket=${encodeURIComponent(submarket)}`;
26      if (propertyType) url += `&propertyType=${encodeURIComponent(propertyType)}`;
27      if (minSize) url += `&minRentableArea=${minSize}`;
28      if (maxSize) url += `&maxRentableArea=${maxSize}`;
29    } else if (action === 'marketAnalytics') {
30      url = `${COSTAR_BASE}/analytics/market?submarket=${encodeURIComponent(submarket)}`;
31    } else if (action === 'comparables') {
32      url = `${COSTAR_BASE}/comparables/${propertyId}`;
33    } else {
34      res.status(400).json({ error: 'Unknown action' });
35      return;
36    }
37
38    const costarRes = await fetch(url, {
39      headers: { ...authHeader, Accept: 'application/json' },
40    });
41
42    if (costarRes.status === 403) {
43      res.status(403).json({ error: 'Data not included in your CoStar license' });
44      return;
45    }
46
47    const data = await costarRes.json();
48    res.json(data);
49  } catch (err) {
50    res.status(500).json({ error: err.message });
51  }
52});

In FlutterFlow, open the left nav → API Calls → + Add → Create API Group. Name the group CoStar. Set the Base URL to your Firebase Function HTTPS trigger URL. Add these API Calls inside the group (all POST to empty path): searchProperties: Body {"action": "searchProperties", "submarket": "{{ submarket }}", "propertyType": "{{ propertyType }}", "minSize": "{{ minSize }}", "maxSize": "{{ maxSize }}"}. Variables: submarket (String, required), propertyType (String, optional), minSize/maxSize (String, optional). getMarketAnalytics: Body {"action": "marketAnalytics", "submarket": "{{ submarket }}"}. Variable: submarket (String). getComparables: Body {"action": "comparables", "propertyId": "{{ propertyId }}"}. Variable: propertyId (String). In the Response & Test tab, paste sample CoStar response JSON (from the sandbox) and click Generate JSON Paths to create bindings for property name, address, size, class, vacancy rate, and asking rent. Build the CRE dashboard with these screens: - Search Screen: Filter chips for submarket, property type, size range. A Search button fires searchProperties, results bind to a ListView. Each tile shows property name, address, class, and vacancy. - Property Detail Screen: Receives property ID as parameter. On load, fires getComparables. Shows a DataTable of comparable transactions (date, tenant, rent, size). Shows market analytics in a bar chart (add a Custom Widget with the charts pub.dev package). All screens must be behind authentication — add a conditional redirect on each screen's initState that checks whether the user is logged in (using FlutterFlow's Firebase Auth state) and navigates to a login screen if not.

CoStar approval can take days to weeks. Rather than waiting idle, build your FlutterFlow app structure using a self-serve alternative with the same Firebase Function + API Calls architecture. When CoStar approval arrives, you update only the Function's target URL and credentials — the FlutterFlow UI requires no changes. Best self-serve alternatives for CRE prototyping: ATTOM Data (attomdata.com): Property data for US addresses. Developer portal with instant key signup. Free trial tier. Covers property details, AVM estimates, neighborhood data. API key goes in the Firebase Function's Authorization header. Endpoints differ from CoStar but the concept is identical. Regrid (regrid.com): Parcel data (ownership, land records, zoning) for US properties. Self-serve plan with API key. Good for land-focused use cases. Estated (estated.com): Property details and ownership data. Developer portal, pay-per-query pricing, instant access. To set up ATTOM as a drop-in prototype: In Firebase Console → Functions → Configuration, add ATTOM_API_KEY from developer.attomdata.com. Update your Function to call ATTOM endpoints instead of CoStar endpoints with the same action routing logic. FlutterFlow API Calls remain identical — they still call your Firebase Function's HTTPS URL with the same action parameters. When CoStar approval arrives: add the CoStar credentials to Firebase Functions configuration, update the Function's URL targeting and auth header format to match CoStar's contract documentation, redeploy the Function. Your FlutterFlow screens require zero changes.