How can I import and display event registration data from Airtable into a custom dashboard on Webflow, while ensuring that only registrations specific to each company's event are shown?

You want to import and display event registration data from Airtable into Webflow, filtered by event and company. Here's how to do that securely and efficiently.

1. Structure Your Airtable Data

• Each registration record in Airtable should include:
• Company ID or Name
• Event ID or Name
• Registrant Info (Name, Email, etc.)
• Ensure your Airtable base has a clean structure, like "Companies" → "Events" → "Registrations" linked via relationships.

2. Use Airtable API or Middleware

• You’ll need to connect Webflow to Airtable, either directly via the Airtable API or by using a middleware tool like:
• Whalesync (two-way sync from Airtable to Webflow CMS)
• Make (Integromat) or Zapier (trigger-push data when new records are created)
• For high control and filtering, using Make or a custom API call via JS or a serverless function is preferable.

3. Set Up Webflow CMS & Dashboard

• In Webflow CMS, create a Dashboard Page structure.
• Optionally use Webflow CMS Collections to hold:
• Companies
• Events
• Registrations (or just pull dynamically)

4. Secure Data Access Per Company

• Authenticate users in Webflow using a tool like:
• Memberstack
• Outseta
• Firebase via custom code
• In Memberstack, assign a Company ID as a user attribute, so you can filter data based on the logged-in user.

5. Display Filtered Airtable Data on Dashboard

You have two main approaches:

Option A: Embed Using JavaScript + Airtable API

• Create a company-specific dashboard page.
• Use JavaScript to call Airtable API and fetch registrations.
• Filter records client-side using the Company ID stored in a Webflow attribute (e.g., data-company).
• Display the results using custom components or by modifying the DOM dynamically.

Option B: Sync Data to Webflow CMS

• Use Whalesync or Make to sync filtered data from Airtable into Webflow CMS.
• Set CMS permissions using Memberstack to show only entries where Company ID matches the logged-in user’s tag.
• Use Webflow CMS Collections to bind and display data.

6. Ensure Data Privacy and Access Control

• Do not expose API keys or unfiltered data in public pages.
• If using JavaScript and Airtable API, consider using a proxy (like Webflow Functions or Cloudflare Workers) to securely fetch and serve filtered data.

Summary

To import and display company-specific registration data from Airtable into Webflow, you can either dynamically fetch it using the Airtable API with frontend filtering based on logged-in user data, or sync filtered data into Webflow CMS using tools like Make. For both methods, ensure proper user authentication and filtering based on Company ID to protect sensitive data.