Skip to main content

Live Code Examples

REPL​

This documentation contains several live code examples when describing the API. That is, the results are displayed by evaluating the code as the page is loaded. This is provided using a REPL app that is integrated with SQL Frames. Below is an example of the REPL user interface. Type any valid JavaScript in the editor below and see how the resuls are displayed.

Loading...

Data can be shared between different REPL instances using session or page scope. Use S for session scope and P for page scope.

Loading...
note

If you change S.iam in the editable REPL editor, this REPL needs to be manually reexecuted. The Notebook App on the other hand automatically syncs the various Notebook cells by tracking dependencies.

Conventions​

  1. df variable - refers to an instance of a SQL Frames DataFrame.

  2. destructuring assignment - the SQL clauses API are first assigned using destructuring assignment and then used in the rest of the code. This is to improve the readability of the code and is a recommended approach. See an example below.

const { groupBy, where: { and, eq, gte }, agg: { count, sum, avg } } = SQL;
return S.penguins.gdf(groupBy('sex','island'),count(),avg('body_mass_g'))
				.having(gte('Count',4));
  1. Fluent objects - Fluent objects are based on the fluent interface design pattern which allows method chaining. Some parts of the SQL Frames API exposes the API using this design pattern which supports low-code design goal.

Say there is an object a. It's corresponding fluent object can be obtained using a.fo. Then a set of methods can be chained and finally get back to the original object by using of.

In the below code, the chart object has setters for height and title. Using the setter API would require splitting the code into multiple lines. However, by using the fluent object version, the setters become methods that can be chained resulting in terse code. This was done intentionally to support both flavors of the API.

// create chart
df.chart.bar('x','y').fo.height(800).title('Hello SQL Frames Charts').of

// instead of
const c = df.chart.bar('x','y');
c.height = 800;
c.title = 'Hello SQL Frames Charts';