Utiliser le même langage de templating en frontend et en backend

Si vous utilisez un framework JavaScript frontend tel AngularJS, peut-être avez-vous déjà souhaité pouvoir gérer les templates partiels utilisés par celui-ci de manière uniforme avec vos layouts (qui, à n'en pas douter, seront quant à eux générés en backend). Une astuce simple et efficace consiste à rendre ceux-ci disponibles via une route de votre application backend, dont l'unique rôle sera d'en effectuer le rendu afin que le frontend puisse prendre le relais. Au final, le résultat sera le même que la solution basique consistant à entreposer des fichiers HTML dans un dossier public de votre application, la flexibilité et l'uniformité en plus !

Voyons donc un exemple rapide avec la stack MEAN. Côté Express :

app.get('/partials/:name.html', function (req, res) {

    res.render(path.join('partials', req.params.name));

});

Le chemin sera bien évidemment à adapter selon votre cas : je suppose ici que les templates concernés se trouvent dans un dossier partials, lui-même enfant direct de votre répertoire de vues principal.

Pour récupérer le tout sur Angular, il suffira donc tout simplement de faire quelque chose de ce genre :

var app = angular.module('myApp', ['ngRoute']);



app.config(['$routeProvider', function ($locationProvider, $httpProvider, $routeProvider)

{

    $routeProvider

        .when('/some-route', {

            templateUrl: '/partials/some-template.html',

            controller: 'SomeCtrl'

        })



        .when('/some-other-route', {

            templateUrl: '/partials/some-other-template.html',

            controller: 'SomeOtherCtrl'

        });

}]);

Ceci vous donne l'avantage non négligeable de pouvoir traiter certains aspects de vos partials depuis le backend, si vous en avez le besoin.

J'oubliais : bonne année à tous !