Getting started with Tinybird.js

Tinybird.js is a JavaScript library that helps you build analytics big data analytics applications by using the Tinybird engine. It is part of the Tinybird ecosystem, which also includes a RESTful API and a Console UI to help you manage your tables and Auth tokens.

Among other things, Tinybird.js provides you an easy way to:

  • Import and append data into Tinybird Analytics.

  • Run live queries from your serverless applications. No back-end needed.

  • Build and run ETL pipelines.

  • Render specific visualization components.

  • Perform analytics in a secure environment.

Using the library

To get started, you need to obtain an Auth token. Go to the Console UI and open the Auth token modal under your user settings. Once you have your Auth token, you can use Tinybird.js directly in your html files or using a module bundler.

Using Tinybird CDN

Include the JavaScript library in your HTML file.

Add tinybird.js to your html
<script src='https://cdn.tinybird.co/v1/tinybird.js'></script>

Once you have loaded the library, include the following code to make a simple select * query right from your frontend application.

Query data with javascript
// tinybird.js constructor function requires an Auth token.
let tinyb = tinybird('<token>')
let res = await tinyb.query('select * from <pipe> LIMIT 3')
console.log(res.data[0])
console.log("query time: " + res.statistics.elapsed)

If you don’t have any datasource imported in your account yet, try importing the NYC taxi data or the NYC Tree Atlas to test with your own data.

Using module bundler

You can also install Tinybird.js using npm

Install as a module
//norun
npm install --save tinybird

CSP directives

For Tinybird.js, you can use this connect-src directive:

csp directives
connect-src https://api.tinybird.co

Next steps

Now that you know how to query your data from a frontend application, learn more about how to import data programatically or how to manage your tables.