Skip to content

Playground examples

These examples show up in the playground at https://syng.dev/playground/#/examples. The idea is to provide a set of queries and respective source files that showcase a common operation, to help users better learn the language.

Adding a new example

  • create a directory with a name that captures the primary selector being showcased, let's call it str-00
  • write your query in str-00/query.syngql
  • write your sample source code in str-00/example.{js,jsx,ts,tsx}
  • create a manifest at str-00/example.json that includes a human-readable title that will be used to display the example, as well as an array of paths pointing to the sample files that should accompany the query. Sample below
  • you can add a version of your query with "commentary" by defining a sibling file at str-00/query+commentary.syngql -- the UI will show a button to load that version when the user chooses to load the example; see existing examples for guidance

Sample example manifest:

json
{
  "title": "Literals starting with the character `c` and ending with a number",
  "sources": ["example.js"]
}

Sourcing examples

See playground/scripts/genexamples.cjs. Once you use it, recompile and deploy the playground.

Copyright © 2022-present Semantic Works, Inc.