Getting Data Into Your Interactive
Last updated
Last updated
PIB treats all kinds of external data the same once it's downloaded to make your work as a developer easier. This includes data hosted S3, from Kitchen Sink, or even from Google Docs.
The first thing to do is register your data source. This will differ slightly depending on the source.
Before registering, create a new Google Doc in this folder. You should also create a folder for your project and place any docs in there. The docs will automatically be shared with the whole team.
If you're unable to save the doc in our shared folder, make sure to share it with the team's service account the same way you would share a doc with any other Google user (you can read more about Google Service Accounts here):
To register the Google Doc, run the following:
It’ll first ask you for a name. Name it, but refrain from using spaces in the name to make importing it into your JavaScript easier.
Next, choose Archie Doc
or Google Sheet
as the type.
Finally, paste the ID of your Google doc. You can find it in the URL between d/
and /edit
like this:
To register a raw JSON source, run the following:
It'll first ask you for a name. You can name it anything you'd like, but you should probably refrain from using spaces to make importing it into your JavaScript easier.
Next, choose JSON File
as the type.
Finally, paste the URL to your file.
Once you've registered the data source, using it is the same. In your JavaScript file, first import it using the Data
alias and the name you gave your endpoint (see Aliases for more on using aliases):
Then you can use it like any object. If it's array, you might consider mapping its data into HTML elements in your JSX like this:
When data is downloaded, it will remain unchanged until you manually update it. To update all of your endpoints run:
You can also update only one specific endpoint by passing the name you gave that endpoint as a final argument. For example, if the name of your endpoint is data
, you can run: