### Install BaseQL Airtable Connector Source: https://github.com/baseql/baseql-docs/blob/main/pages/install/airtable.mdx Steps to install and configure the Airtable data source in BaseQL. This involves signing up for BaseQL, adding Airtable as a data source, and creating a Personal Access Token with specific scopes for read and write access. ```bash 1. Signup/Login to [BaseQL app](https://app.baseql.com/) 2. Click `+Add New Data Source` > `Airtable` 3. Create a [`Personal Access Token`](https://airtable.com/create/tokens) - Allow `data.records:read` & `schema.bases:read` scopes - If using mutations, allow `data.records:write` scope too 4. Click `Fetch Bases` 5. Select your desired base from the list ``` -------------------------------- ### JavaScript Examples for Webflow Integration Source: https://github.com/baseql/baseql-docs/blob/main/pages/integrations/webflow.mdx This section provides links to more JavaScript examples relevant to Webflow integration. These examples showcase various functionalities and patterns used when connecting Baseql with Webflow. ```javascript console.log('See more JS examples at: /examples/javascript'); ``` -------------------------------- ### Axios Request to BaseQL Source: https://github.com/baseql/baseql-docs/blob/main/pages/examples/javascript.mdx Shows how to send a POST request to the BaseQL API using the Axios library. This example configures the request with the API endpoint, method, authorization header, and a GraphQL query within the data payload. It then logs the received data. ```jsx const axios = require("axios"); axios({ url: 'https://api.baseql.com/airtable/graphql/appuzDcQEvfnkzXjD', method: 'post', headers: { 'Authorization': 'Bearer SECRET_TOKEN' }, data: { query: `{ people { name } }` } }).then((result) => { console.log(result.data) }); ``` -------------------------------- ### Fetch API Request to BaseQL Source: https://github.com/baseql/baseql-docs/blob/main/pages/examples/javascript.mdx Demonstrates how to make a POST request to the BaseQL API using the Javascript Fetch API. It includes setting headers for content type, acceptance, and authorization, along with sending a GraphQL query in the request body. The response is parsed as JSON. ```jsx fetch('https://api.baseql.com/airtable/graphql/appuzDcQEvfnkzXjD', { method: 'POST', headers: { 'Content-Type': 'application/json', 'Accept': 'application/json', 'Authorization': 'Bearer SECRET_TOKEN', }, body: JSON.stringify({query: "{ people: { name } }"}) }) .then(r => r.json()) .then(data => console.log('data returned:', data)); ``` -------------------------------- ### GraphQL Features: Aliases, Fragments, Operation Names, and Variables Source: https://github.com/baseql/baseql-docs/blob/main/pages/usage/querying.mdx Shows how to utilize advanced GraphQL features within BaseQL queries. This example demonstrates using aliases for multiple queries on the same data, fragments for reusable query structures, operation names for identifying queries, and variables for dynamic query parameters. ```graphql query Veganism($country: [String] = ["🇺🇸USA"]) { vegan: people(vegan: true, country: $country) { ...peopleFields }, nonVegan: people(vegan: false, country: $country) { ...peopleFields } } fragment peopleFields on people { name vegan country friends { name vegan country } } ``` -------------------------------- ### Querying with Multiple Parameters and Filtering Source: https://github.com/baseql/baseql-docs/blob/main/pages/usage/view.mdx This example shows how to query records from a specific Airtable view ('Custom Sort') while also applying pagination (`_page_size`) and filtering (`_filter`). It retrieves the 'name' and 'vegan' fields for people who are vegan, with a page size of 2. ```graphql { people( _view: "Custom Sort", _page_size: 2, _filter: {vegan: true} ) { name vegan } } ``` -------------------------------- ### Sort by Multiple Columns Source: https://github.com/baseql/baseql-docs/blob/main/pages/usage/sorting.mdx This example illustrates sorting by multiple columns, with the first column ('vegan') sorted in descending order and the second ('offspring') in ascending order. ```graphql { people(_order_by: [ {vegan: "desc"}, "offspring" ]) { name, vegan, offspring } } ``` -------------------------------- ### Sort by Single Column Source: https://github.com/baseql/baseql-docs/blob/main/pages/usage/sorting.mdx This example demonstrates how to sort query results by a single column in ascending order. ```graphql { people(_order_by: "name") { name } } ``` -------------------------------- ### cURL POST Request to Baseql API Source: https://github.com/baseql/baseql-docs/blob/main/pages/examples/curl.mdx This snippet shows how to send a POST request to the Baseql GraphQL endpoint using cURL. It includes setting the Accept and Content-Type headers to application/json, providing an Authorization token, and sending a JSON payload containing a GraphQL query. ```bash curl \ -X POST \ -H "Accept: application/json" \ -H "Content-Type: application/json" \ -H "Authorization: Bearer SECRET_TOKEN" \ --data '{ "query": "{ people { name } }" }' \ https://api.baseql.com/airtable/graphql/appuzDcQEvfnkzXjD ``` -------------------------------- ### Example Query for Filtering and Sorting Related Records Source: https://github.com/baseql/baseql-docs/blob/main/pages/usage/related-record-arguments.mdx Demonstrates how to filter friends by vegan status, sort them by name, and paginate the results. This query fetches people named 'Rob' and then retrieves their vegan friends, ordered by name, with pagination applied. ```graphql { people(name: "Rob") { name friends( _filter: { vegan: true } _order_by: { name: "asc" } _page_size: 2 _page: 1 ) { name vegan city { name } } } } ``` -------------------------------- ### Update Airtable Personal Access Token Source: https://github.com/baseql/baseql-docs/blob/main/pages/install/airtable.mdx Instructions for updating your Airtable Personal Access Token within BaseQL if it has been changed or revoked. The process mirrors the initial setup. ```bash Follow the exact same process [as described above](#installation) to update your personal access token. ``` -------------------------------- ### Pagination Use Case Source: https://github.com/baseql/baseql-docs/blob/main/pages/usage/aggregation.mdx Utilize aggregations to get total counts for implementing pagination UI. This allows you to display total items and manage page navigation. ```graphql { _aggregates { people { count } } people(_page_size: 3, _page: 1) { name } } ``` -------------------------------- ### Sort by Column Direction (Descending) Source: https://github.com/baseql/baseql-docs/blob/main/pages/usage/sorting.mdx This example shows how to specify the sorting direction for a single column, in this case, descending order. ```graphql { people(_order_by: {name: "desc"}) { name } } ``` -------------------------------- ### GraphiQL Explorer Integration Source: https://github.com/baseql/baseql-docs/blob/main/pages/usage/explorer.mdx This snippet shows the import and usage of the SupportedBy component within the BaseQL Explorer's documentation section. It highlights the integration of external components for enhanced UI features. ```javascript import SupportedBy from '../../components/supported-by'; // ... inside a React component ``` -------------------------------- ### Nextra Theme Docs Bleed Component Source: https://github.com/baseql/baseql-docs/blob/main/pages/playground/gsheets.mdx Demonstrates the usage of the `Bleed` component from `nextra-theme-docs`, likely used for full-width content display. ```javascript import { Bleed } from 'nextra-theme-docs' // ... component usage ...
{/* Content inside Bleed */}
``` -------------------------------- ### Notion.so Integration Status Source: https://github.com/baseql/baseql-docs/blob/main/pages/install/notion.mdx This section provides an update on the Notion.so integration for Baseql. It indicates that the feature is under development and provides a link to a waiting list for launch notifications. ```javascript import { Callout, Steps } from 'nextra/components' # Notion.so We're actively working on adding support for Notion! In the meantime, you can join our waiting list to be notified when the Notion GraphQL integration launches. [Sign up here](https://baseql.com/notion-graphql-integration.html). ``` -------------------------------- ### BaseQL Live Playground Source: https://github.com/baseql/baseql-docs/blob/main/pages/playground/airtable.mdx An interactive iframe embedding the BaseQL live playground. This allows users to directly query a showcase base and experience BaseQL features. It requires no specific dependencies beyond a web browser. ```html