Create a custom screen attached to a custom template

To create a custom app screen that is rendered using a custom template:

//In functions.js:
App.addCustomRoute( 'my-custom-screen-fragment', 'my-custom-screen-template' ); 
//Note: no final .html for the template name here!

This creates a new screen in the app that can be reached at #my-custom-screen-fragment and is rendered using the my-custom-screen-template.html template.

Then to pass custom data (my_custom_data) to your custom template:

App.filter( 'template-args', function( template_args, view_type, view_template ) {
	if ( view_template === 'my-custom-template') { //Don't need .html here

		//Add our custom data:
		template_args.my_custom_data = { key: 'value' };

		//Now "my_custom_data" variable is available in the my-custom-template.html template :)
	}
	return template_args;
} );

To go further:

• see this tutorial about creating a custom “home” screen associated to a custom “home.html” template
• more info about passing custom data to templates
• the tutorial about how routes are created and handled in WP-AppKit
• documentation for App.addCustomRoute() and “template-args” filter