AMA Custom Blocks Contest Edition #1 - Getting Started with the Airtable Product Team (Live on Wednesday 6/10)

Hello Airtable team!

As more of a back-end developer, my lack of experience with React has proven my biggest hurdle to overcome, despite Airtable’s excellent documentation and React’s Getting Started guide. I’ve had some success with writing individual components and perfoming single “demo” tasks/actions, but I’ve hit a bit of a roadblock with trying to combine several of the pieces together.

Besides the examples you provide (Name Quiz and Flashcard have been helpful to dig through), do you have any recommendations on how best to structure a project? Is it better to start with a bunch of individual blocks, each performing a single task? Or do you find it is easier to get a project skeleton in place that can be expanded upon?

I know with the Scripting Blocks, I’ve taken a more “bunch of individual blocks” approach, but I’d be curious to hear any recommendations/tips you have for working with Custom Blocks.

Thanks in advance. Looking forward to reading the full AMA on Wednesday!

Can you explain if OAuth is available for custom blocks?

I’m aware that OAuth is not possible within iframes as a security measure. But I noticed there are other blocks such as the Miro block which looks like it is achieving OAuth within an iframe.

If its not officially supported is there a safe work around? I was thinking maybe a localhost server could perform the OAuth and then I think there is the ability to whitelist addresses so maybe the Airtable project could be whitelisted?

Thanks for the AMA!

Ah ya, I’m happy for this opportunity.

I am an Android and IoT developer. Mostly I use Java with Android Studio as IDE. Usually my workflow is to get an example online and do a development loop (modifying to meet my needs, compiling the codes, and fixing bugs).

So far, I haven’t found instructions, examples or free one-stop services for creating or generating native Android code using Airtable or third parties that support it. Maybe there is any and I haven’t searched far enough.

Are there any recommended sites where I can start studying?

Sorry if I ask too much but one should try it, right? :slightly_smiling_face:

Thank you in advance. Hoping to observe the full AMA session tomorrow!

Hi Airtables team,

I’m new in developing with React and although the awesome examples are helpful, they are not quite the same caliber as the available blocks in an Airtables base. Can you please add more of those blocks to the examples page? (Such as the 3D space block and batch update block :grinning_face_with_big_eyes: ) It would help tremendously in developing innovative and creative blocks because it helps us see how we can create complex blocks.

Thank you so much for this opportunity and I’m looking forward to seeing what amazing blocks others have created!

If I create a custom block that gets installed into multiple bases across multiple Airtable accounts, and I update the source-code for that block and push the updates to the GitHub repo, will all installed instances of the block automatically pick up the source-code updates (perhaps on the next page refresh or something)?

Asked another way…
Do installed custom blocks automatically pull the latest code from the master branch of their source repo when they load?

Thanks @Michelle_Valentine,

I’d want to add that the community forum has been quite helpful in the journey on bringing my block idea to life. A lot of questions I had have been already answered by many people building/working on blocks. Most of it all felt just a community search away. :raised_hands:t6:

I have a question and a comment :100: :

1. I’m using a 3rd party API Key in my block that is intended to remain same for all users using the block. What is the best place to store the API Key? What are the guidelines for storing a common API key in general.

2. Thank you for having some examples out there. They’ve helped in general especially covering some caveats/exceptions of how rendering happens while using the Cursor component. Once the block is in a more matured state (which I would be in say a week or so), I would love to have a quick review or a show and tell with the team to understand areas the block can improve on.

@Jeremy_Oglesby Short answer : you’ll have to add multiple remotes and then carry out a block release. Here’s a documentation I’ve found:

Also, I am not an Airtable spokesperson, so do wait for a confirmation from the team.

Thank you, @Harshit_Juneja. So it looks like then, if somebody releases my block to their base by using my block as a template and copying it into their own repo, the connection is entirely severed.

I can’t help but wonder how Airtable is going to manage visibility of existing custom blocks for users, and if they will in any way facilitate the communication/relationship between a block creator and public users of their custom blocks.

The way it’s set up now, with multiple remotes hosting the same source code, seems fine for use of a custom block within a single organization. But I can’t quite see how it extends gracefully to sharing of blocks outside an organization.

Perhaps it’s just my inexperience preventing me from understanding the model here.

I may be missing both: a) you’re current/intended workflow; and b) features/limitations of how custom blocks work, but from my understanding, there isn’t really a “connection” with code in GitHub to begin with. Unless there is a CI/CD pipeline in play that executes block release on a code push, you/the user would need to pull changes locally and do block run or block release.

The way I see it, both of these scenarios are the same/similar. As long as the user outside the “organization” has access to the GitHub repo, they can git pull the latest changes and do the block run/block release dance on their local machines the same way you would within the organization.

The thinking would be like this (very rough) sketch

where both you and the outside organization can deploy the latest code, given both have access to the GitHub repo. And, if you had access to the block IDs, you could add them to the list of remotes and deploy from your end as well!

This gets at what I was wondering about – supposing Airtable wants to encourage non-technical users to install Custom Blocks built by the community (clearly I’m making an assumption there), will Airtable facilitate the communication of this kind of thing, so that non-technical users can receive updates for a Custom Block they’ve install without having to provision that themselves, and without Block creators having to manage a flood of email requesting that a Block ID be added to the remote list?

Again, I’m not terribly experienced, so perhaps I’m missing something there… or perhaps my assumption about the degree to which non-technical users will be encouraged to use Custom Blocks is off.

Hello Airtable Team,

Thank you for doing the AMA. It’s been a very pleasant dev experience to work with Blocks API and being able to make interesting ideas to come to life.

On of the main thing my Blocks app does is constantly interacting with globalconfig to keep track of records changes. However, I’ve only been using setAsync for simplicity. Can you give an overview of how setPathsAsync function works behind the scene and how much more performant it is for nested objects?

Also, one of the other thing my Blocks app does is aggregating _changeCount values across records. I noticed that it doesn’t actually increment by 1 as it should. What’s happening here? Also, is there a way to get data about specific record history? It seems the data itself is available via “expand record” for the users, but there’s isn’t an API for getting the data.

In this thread you hinted at a developer pricing plan. Can you give any more info? Would pricing be per developer per workspace (versus per user per workspace)? Is this strictly for developing custom blocks (vs. scripting block or using the Standard REST API)?

Right now, Airtable pro features are affordable for individual developers who do not have other users in their workspaces. I hope that you keep custom block development affordable for new and emerging developers.

Kasra and I are now live from our respective home offices. Let’s go!!

I’m aware that OAuth is not possible within iframes as a security measure. But I noticed there are other blocks such as the Miro block which looks like it is achieving OAuth within an iframe.

Hi! OAuth isn’t available in custom blocks right now. The Miro block uses the Miro boards picker (https://developers.miro.com/docs/boards-picker) which doesn’t include OAuth inside the block. To initially authenticate the block, they pop up a new window on Miro.com which can access the user’s Miro cookies. This sends back some tokens to the block, and the block stores the tokens. The tokens are all you need to render the board (i.e. no OAuth process happens within the block itself)

Hi! Right now blocks only run inside the Airtable web app and desktop app. We’re thinking about mobile support for the future.

Hi @Matthew_Thomas!

Excited to hear that we’ve convinced you to give frontend development a try. Personally I find it easier to choose one example to structure a project skeleton around, and then drawing in aspects of other examples where helpful. Our product philosophy with the examples is to have each block focus on doing one thing well, in hopes to be able to draw on them as building blocks in your own project. I also find searching around for similar React projects to plan the skeleton a good way to begin too.

Without knowing which parts of React exactly that you’re struggling with (is it nesting components? Is it re-render? Is it how to flow data between components? Is it something to do with getting Airtable data?), I’d suggest the “Thinking in React” tutorial if you haven’t seen it already. It really helps take you through a process of building in a React-ey way. It also breaks down the process of building a React app into more manageable steps. It focuses first on getting components nested correctly. Then on putting state in the right components, then on passing data correctly. The example code uses React classes, but the techniques can be adapted to use hooks.

Hi @Eric_Ho

Absolutely. We’re actively building more example blocks and should be releasing a few more in the next week or two. Our product philosophy with the examples is to have each block focus on doing one thing well, in hopes to be able to draw on them as building blocks in your own project.

Are there any types of blocks that you’d be most interested in? Or is it more about demonstrating the SDK components that would be helpful?

The installed blocks get updated when you run block release. Pushing to the master branch won’t automatically update installations.

As @Harshit_Juneja mentioned, if you want the same custom block across multiple bases, the best way to do that is to use the remotes feature for now. We’re exploring ways to make this more seamless in the future.

Hi @Michelle_Valentine - I have a business question that could help hone in on the types of blocks to build.

What types of teams are ‘power users’ of Airtable? (Either in terms of activity on Airtable or have the largest amount of users within a team using Airtable).

For example:

• Do you see generally see many small businesses that use Airtable for one piece of their ‘stack’ (e.g. agencies that use it to track clients and billing).

• Or for larger customers, do they use it to replace other services (e.g. using Airtable to track product dev tasks instead of doing it in JIRA).

• On that note, do ‘power users’ benefit from integrating Airtable with other existing services (e.g. pulling in information from Salesforce to enrich a customer base in Airtable)

Any help in identifying the types of teams that fit your ideal customer could help narrow down the use case and approach.

Thanks!

Thank you, @Kasra. The picture is becoming a little more clear to me how $ block ... --remote handles this, and the questions in my head are kind of morphing as my understanding of it changes.

In particular, are you exploring ways to make keeping Custom Blocks updated a more seamless process for both creators and consumers of those blocks?

Technical question: do blocks allow for real-time updating of records within Airtable? Meaning, within my block, can I hit the Airtable API for the base that the block is installed in? I’m assuming yes since it’s just React within the block, but would I need the base user to put in their Airtable API token in the onboarding process within the block?

For a simple example if I wanted to get weather data every 10 minutes from an API and update a record within the base (and use the Block for another purpose like displaying the weather trends in near-real time), do you see any hiccups there? I’m not sure about the API rate limits.

I haven’t built on the Airtable API before so apologies if these questions are easily answered elsewhere.

I’m having some trouble getting some of the examples to install. Where do you suggest going for troubleshooting info on getting started? It can be hard to tell if my issue is an npm issue, a node issue, a react issue, or what. I haven’t worked in react before.

Thank you, I’m happy to hear it’s been a pleasant experience so far :raised_hands:

Can you give an overview of how setPathsAsync function works behind the scene and how much more performant it is for nested objects?

Both setAsync and setPathsAsync let you update nested values by passing in a path for the key. This is important if you want to avoid clobbering the other parts of the object if multiple users are writing to different parts of that object.

setPathsAsync is useful if you want to update multiple keys/paths in different parts of the tree in one shot. This is more performant than calling setAsync a bunch of times in rapid succession since setPathsAsync will end up making a single network call.

one of the other thing my Blocks app does is aggregating _changeCount values across records. I noticed that it doesn’t actually increment by 1 as it should. What’s happening here?

Any methods or variables that begin with an underscore (_) are private SDK internals and aren’t documented, so you shouldn’t rely on them in your code since their behavior may change at any point.

Is there a way to get data about specific record history?

There isn’t an API for getting this information at the moment, but I’ll note your +1 for it! Out of curiosity, what are you hoping to build with it?

@Ashwin_Kumar – yes; Custom Blocks have a direct API with the base they are installed in; no need to use the REST API from within the Custom Block (unless you are wanting to interact with a completely separate base). You can simply call table.updateRecordAsync() to make updates to records within the base.

Hi @kuovonne!

We don’t have details to share on a developer plan yet, but rest assured that our intention is to make Airtable even more accessible and affordable for developers. We will continue to support developers to build blocks for free (e.g. connect blocks-cli etc.) and are looking to make the full custom blocks functionality - that pro users have - available to developers on a special developer plan. More exciting things to come!