This is a set of code examples for Customer's Canvas SDK and a system which automates generation of code examples.
If you just want to take a look at code examples, open the output folder. All code examples are grouped to subfolders for each API. Just copy this folder to a webserver, modify the URLs to Customer's Canvas and other APIs if necessary and open them in a browser.
If you want to modify these examples, batch replace the URL to Customer's Canvas or even add more samples, you need to build them. Also, you may find that exploring .pug templates instead of output HTML files is easier to understand, as you can see only Customer's Canvas related code without distracting to HTML markup and helper scripts.
Use the following steps to build the project:
- Run
npm install - Then run
npm start - It will launch a built-in webserver. By default, it is available at http://localhost:3456. You can change it in index.ts.
- The .pug templates of code examples are located in samples folder. You can edit them in your favorite code editor and save the result. The system detects file system changes and automatically rebuilds all templates.
- If you want to set your own URL to Customer's Canvas or other settings, modify data/settings.json.
All changes automatically force the system to rebuild code examples and publish them to the output folder.
The code example generator is based on Pug template engine. The code in the index.ts uses iterates the data/code.examples.json file, for each entry generates a HTML in the output folder. Each sample (from the samples folder ) refer a template from the layouts folder. All layouts are based on a master-page.pug file. This way all code examples have a consistent look-and-feel.
If for any reasons you would like to modify templates, use Pug documentation as a syntax reference.
For better understanding how our code examples work, we recommend to check out Customer's Canvas APIs documentation.