Add Templates to your Toolbelt

Todd WackerTodd Wacker

Syncano is excited to announce our newest Socket, Templates! Templates allow you to choose how you want to render your data.

What are Templates?

Templates are scripts that hold static code. You can use them to render data in the way that makes the most sense for your application. Templates use Jinja, a common Python templating engine.

Jinja allows you to write logic into your Template. That way, you can have it display differently depending on what data is offered.

Performance Benefits

Using Templates is a great way to keep your app performing quickly. By rendering Templates using Syncano instead of rendering them in your front-end application, you can save valuable client-side resources to make your app faster.

This is especially useful for mobile developers. With more limited memory and processor speed on phones, building the right Templates with Syncano will really make your app excel.

What You Can Do

Templates are set up similar to our current Scripts. You'll have an editor where you can write your code. You can save any changes you've made and even get an instant preview of the result of your code with the blue "Render" button. You can also "Render in Tab" by entering your Data Source URL such as a Data Endpoint to get a preview of what your Template will render in the browser.

Templates screen

Templates are great for running logic in the cloud and rendering a view accordingly. For instance, what if you wanted to populate a table with data based on a particular class?

Let's say I have a book class with fields for title, author, and cover.

With Templates, you can set up a table in the editor to look something like this:

{% set objects = response.objects %}
{% if objects %}
  <div class="container">
    <table class="table">
      <tr>
        {% for key in ['title', 'author', 'cover'] %}
          <th>{{ key }}</th>
        {% endfor %}
      </tr>
        {% for object in objects %}
      <tr>
        <td>{{ object['title'] }}</td> 
        <td>{{ object['author'] }}</td> 
        <td>
          <img src="{{ object['cover'] }}">
        </td>              
      </tr>
    {% endfor %}
    </table>
  </div>
{% endif %}

You make a call to your Class's endpoint and pass in the template name and api key like this:
https://api.syncano.io/v1.1/instances/INSTANCE_NAME/classes/CLASS_NAME/objects/?template_response=TEMPLATE_NAME&api_key=API_KEY, or you can also access your Template with the newest versions of our Python and JavaScript libraries.

It will return your Data Objects rendered as a table in the format you chose.

  <div class="container">
    <table class="table">
      <tr>
          <th>title</th>
          <th>author</th>
          <th>cover</th>
      </tr>
      <tr>
        <td>The Fellowship of the Ring</td> 
        <td>J.R.R. Tolkien</td> 
        <td>
          <img src="http://www.something.com/fellowship-of-the-ring.jpg">
        </td>              
      </tr>
      <tr>
        <td>A Game of Thrones</td> 
        <td>George R.R. Martin</td> 
        <td>
          <img src="http://something.com/a-game-of-thrones.jpg">
        </td>              
      </tr>
      <tr>
        <td>Foundation</td> 
        <td>Isaac Asimov</td> 
        <td>
          <img src="http://something.com/foundation.jpg">
        </td>              
      </tr>
    </table>
  </div>

You can insert your ready-made table directly into your application.

title author cover
The Fellowship of the Ring J.R.R. Tolkien
A Game of Thrones George R.R. Martin
Foundation Isaac Asimov

Moving Forward

Templates are a great new Socket you can use to add additional functionality to your application. Check out the docs for more information about Syncano's Templates, or join our Slack Channel to discuss with other developers around the world.

Build powerful apps in half the time

Use our serverless platform to set up your backend in minutes.

Learn more
Todd Wacker
Author

Todd Wacker

Dev Evangelist, Developer