Angular2 – UI : repensez vos modals pour des fenêtres dynamiques

Notre besoin était d’avoir une modal comme d’habitude, puis une modal dans une modal, comme d’habitude.. Mais comment afficher deux modales à la fois sur une page.

C’est en regardant Tag Manager de Google que nous nous sommes grandement inspiré de leur implémentation pour créer notre propre SheetComponent pour Angular2.

Le principe est d’ouvrir une fenêtre venant de la droite de l’écran et se déplaçant vers la gauche jusqu’à une certaine distance sans coller au bord de l’écran, puis d’insérer dans la fenêtre le composant désiré. Pour ouvrir une seconde fenêtre, on va décaler la première jusqu’au bord de l’écran, et afficher la nouvelle depuis la droite de l’écran jusqu’à une certaine distance…etc..on peut faire ça à l’infini.

Notifications via websocket avec Symfony2 et Node.js

La réactivité des applications web est un critère essentiel de l’expérience utilisateur. Fini le temps des requêtes AJAX exécutées toutes les X secondes, ou pire des rechargements de page pour actualiser le contenu ! Les notifications en direct se font aujourd’hui très simplement grâce aux websockets.

Les solutions serveur ne manquent pas, de l’incontournable socket.io (node.js) au plus récent ratchet (php). Et coté client, HTML5 fournit une API WebSocket… encore peu répandue malheureusement !

La stack retenue

Pour cet exemple, nous allons utiliser la version node.js de Faye server, qui a l’avantage d’être très simple à mettre en place et de d’intégrer directement un client JavaScript.

Stack Symfony2 Faye

  • Une application backend Symfony2
  • Une application client HTML / JS
  • Une passerelle Faye server (node.js) pour l’envoi de notifications au client

LexikJWTAuthenticationBundle – Symfony2 REST API Authentification

Lexik vous présente aujourd’hui LexikJWTAuthenticationBundle, destiné à vous aider à mettre en place rapidement un système d’authentification entre votre API REST Symfony2 et d’éventuels clients Javascript (AngularJS, Ember.js, Backbone.js) ou mobiles.

Contexte

Les bonnes ressources concernant la mise en place d’une API REST Symfony2 ne manquent pas :

Mais peu d’informations claires sont disponibles sur l’authentification auprès d’une telle API. Et les stratégies dans ce domaine ne manquant pas, il va falloir faire un choix… Et chez Lexik on a  choisit le petit standard qui monte : le Json Web Token (JWT).