Skip to content

Commit

Permalink
[AUTO] Deploy PR #260
Browse files Browse the repository at this point in the history
for commit 6888b01
  • Loading branch information
al2b committed Apr 26, 2021
1 parent f4912a3 commit 132c0b3
Show file tree
Hide file tree
Showing 356 changed files with 1,133 additions and 995 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -603,7 +603,8 @@ <h4 id="les-fonctions-de-decroissance" class="anchor-title"><a href="#les-foncti
<p>Dans l'exemple ci-dessus, la valeur centrale est le 24 avril 2017 et on souhaite qu'à 6 jours (1 jour d'offset + 5 jours de scale) de cette date, soit le 18 et le 30 avril, le score soit réduit de moitié. La réduction du score des autres résultats sera calculée par la fonction de décroissance choisie.</p>
<p>Il existe 3 fonctions de décroissances, <a href="https://fr.wikipedia.org/wiki/Fonction_lin%C3%A9aire" target="_blank">linéaire</a>, <a href="https://fr.wikipedia.org/wiki/Fonction_exponentielle" target="_blank">exponentielle</a> et <a href="https://fr.wikipedia.org/wiki/Fonction_gaussienne" target="_blank">gaussienne</a>.</p>
<p>La fonction linéaire est une droite, la décroissance est proportionelle à la distance. Avec la fonction exponentielle, la décroissance est très forte au début et diminue rapidement avec la distance jusqu'à tendre vers zero. Avec la fonction gaussienne, la décroissance est également très forte au début mais diminue moins rapidement.</p>
<img src="/elao_/pr/260/images/posts/2017/es-decay-graph.png" alt="Decay functions" title="Decay functions" id="decay-functions">
<img src="/elao_/pr/260/resized/images/posts/2017/es-decay-graph.png/2e1a2a84640840406dfb12f6d2615bd6.png" alt="Decay functions" title="Decay functions" srcset="/elao_/pr/260/resized/images/posts/2017/es-decay-graph.png/2e1a2a84640840406dfb12f6d2615bd6.png 1x,
/elao_/pr/260/resized/images/posts/2017/es-decay-graph.png/110a278f395986ce6d606b577a5f047c.png 2x," id="decay-functions">
<p>Les fonctions de décroissance peuvent être appliquées sur des valeurs numériques, des dates (<code class="code-inline" id="7a86c157ee9713c34fbd7a1ee40f0c5a">offset</code> et <code class="code-inline" id="0cb47aeb6e5f9323f0969e628c4e59f5">scale</code> sont alors exprimés en durée : 5h ou 1d par exemple) ou des géopoints (<code class="code-inline" id="7a86c157ee9713c34fbd7a1ee40f0c5a">offset</code> et <code class="code-inline" id="0cb47aeb6e5f9323f0969e628c4e59f5">scale</code> sont alors exprimés en distance : 100m ou 5km par exemple).</p>
<h2 id="conclusion" class="anchor-title"><a href="#conclusion">Conclusion</a></h2>
<p>Avec toutes ces fonctionnalités, vous dévriez être capables de gérer la pertinence de votre moteur de recherche assez finement. Attention néanmoins, cet article n'est pas exhaustif, <strong>ElasticSearch</strong> propose bien d'autres possibilités.</p>
Expand Down
12 changes: 8 additions & 4 deletions pr/260/blog/dev/architecture-hexagonale-symfony/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -295,7 +295,8 @@ <h1>L&#039;architecture hexagonale avec Symfony</h1>
<body><h2 id="introduction" class="anchor-title"><a href="#introduction">Introduction</a></h2>
<p>L'architecture hexagonale, également appelée <em>Ports &amp; Adapters</em>, présente deux caratéristiques lorsqu'on la schématise : une forme <strong>hexagonale</strong> (d'où son nom) et une séparation entre l'<strong>application</strong>, l'<strong>extérieur</strong> et une partie contenant des <strong>adapteurs</strong> permettant aux deux de communiquer.</p>
<p>Elle a été pensé par <a href="http://alistair.cockburn.us/Hexagonal+architecture" target="_blank">Alistair Cockburn</a> dans les années 2000. Son but est de permettre à une application d'être pilotée sans distinction par des utilisateurs, des programmes, des tests automatisés ou des scripts ainsi que d'être développée et testée de façon isolée de son contexte d'exécution et de ses bases de données.</p>
<img src="/elao_/pr/260/images/posts/2017/hexagonal-architecture.png" alt="Architecture hexagonale" title="Architecture hexagonale" id="architecture-hexagonale">
<img src="/elao_/pr/260/resized/images/posts/2017/hexagonal-architecture.png/43bfa3f0a33d77e21e8623719b99b1c0.png" alt="Architecture hexagonale" title="Architecture hexagonale" srcset="/elao_/pr/260/resized/images/posts/2017/hexagonal-architecture.png/43bfa3f0a33d77e21e8623719b99b1c0.png 1x,
/elao_/pr/260/resized/images/posts/2017/hexagonal-architecture.png/68b206c9f89aa9f41395604598fe3db4.png 2x," id="architecture-hexagonale">
<h3 id="une-architecture-hexagonale" class="anchor-title"><a href="#une-architecture-hexagonale">Une architecture hexagonale</a></h3>
<p>Les deux grands principes de base de l'architecture hexagonale sont :</p>
<ul>
Expand All @@ -307,7 +308,8 @@ <h3 id="une-architecture-hexagonale" class="anchor-title"><a href="#une-architec
<p>Le <strong>code métier</strong> c'est tout le code qui traduit le métier de votre client. Il s'agit des règles métier, de la logique métier, du code purement applicatif, ... Ce code est irremplaçable et constitue le coeur de votre application.</p>
<h3 id="une-architecture-en-couches-ou-en-oignon" class="anchor-title"><a href="#une-architecture-en-couches-ou-en-oignon">Une architecture en couches (ou en oignon)</a></h3>
<figure>
<img src="/elao_/pr/260/images/posts/2017/onionman.jpg" alt="Onion man" id="onion-man">
<img src="/elao_/pr/260/resized/images/posts/2017/onionman.jpg/5c9639f9fa8697789ada58faf8a76d92.jpg" alt="Onion man" srcset="/elao_/pr/260/resized/images/posts/2017/onionman.jpg/5c9639f9fa8697789ada58faf8a76d92.jpg 1x,
/elao_/pr/260/resized/images/posts/2017/onionman.jpg/3a6d4033147c8dc2cf7af50eeb5390e6.jpg 2x," id="onion-man">
<figcaption>
<span class="figure__legend">Onion man</span>
</figcaption>
Expand All @@ -327,7 +329,8 @@ <h3 id="une-architecture-en-couches-ou-en-oignon" class="anchor-title"><a href="
</ul>
<p>L'idée est que chaque couche peut utiliser une couche inférieure mais jamais une couche supérieure, ou en tout cas pas directement.</p>
<figure>
<img src="/elao_/pr/260/images/posts/2017/clean-architecture.png" alt="Clean architecture" id="clean-architecture">
<img src="/elao_/pr/260/resized/images/posts/2017/clean-architecture.png/4356e25f1c5ca9086bd916b8bc3c5025.png" alt="Clean architecture" srcset="/elao_/pr/260/resized/images/posts/2017/clean-architecture.png/4356e25f1c5ca9086bd916b8bc3c5025.png 1x,
/elao_/pr/260/resized/images/posts/2017/clean-architecture.png/8f58126f85a4b94015074d6a8fe64e3d.png 2x," id="clean-architecture">
<figcaption>
<span class="figure__legend">Clean architecture</span>
</figcaption>
Expand Down Expand Up @@ -378,7 +381,8 @@ <h3 id="pourquoi" class="anchor-title"><a href="#pourquoi">Pourquoi ?</a></h3>
</ol>
<p>Au final, l'investissement de départ est un peu plus grand, quoiqu'avec l'habitude pas tant, mais est largement amorti sur la durée de vie du projet tant les évolutions et la testabilité sont simplifiées.</p>
<figure>
<img src="/elao_/pr/260/images/posts/2017/good-work-chuck-norris.jpg" alt="Good work" id="good-work">
<img src="/elao_/pr/260/resized/images/posts/2017/good-work-chuck-norris.jpg/e6eca100170b261bc935eb6cfd2287dc.jpg" alt="Good work" srcset="/elao_/pr/260/resized/images/posts/2017/good-work-chuck-norris.jpg/e6eca100170b261bc935eb6cfd2287dc.jpg 1x,
/elao_/pr/260/resized/images/posts/2017/good-work-chuck-norris.jpg/d6ba52af76d63d0b5869cce73eff0164.jpg 2x," id="good-work">
<figcaption>
<span class="figure__legend">Good work</span>
</figcaption>
Expand Down
9 changes: 6 additions & 3 deletions pr/260/blog/dev/authentification-par-lien-magique/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -262,15 +262,18 @@ <h1>Authentification par lien magique</h1>
<body><h1 id="lien-magique" class="anchor-title"><a href="#lien-magique">Lien magique</a></h1>
<p>Nous avons récemment pris le parti pour l'un de nos dernier projet de proposer une authentification par "lien magique". Voici ce qui nous a poussé à faire cette expérience ainsi que nos retours.</p>
<p>L'authentification par "lien magique" est notamment utilisée par Slack qui propose cette fonctionnalité dans son client et qui nous a grandement inspiré.</p>
<img src="/elao_/pr/260/images/posts/2018/magic-link-slack.png" alt="" title="" id="magic-link-slack-png">
<img src="/elao_/pr/260/resized/images/posts/2018/magic-link-slack.png/fd48391fdde288e57dfa6797553ed280.png" alt="" title="" srcset="/elao_/pr/260/resized/images/posts/2018/magic-link-slack.png/fd48391fdde288e57dfa6797553ed280.png 1x,
/elao_/pr/260/resized/images/posts/2018/magic-link-slack.png/647ff4d4995fb95f6835f7628b2e7ead.png 2x," id="fd48391fdde288e57dfa6797553ed280-png">
<p>Pour ce projet, avons utilisé cette méthode d'authentification sur deux app mobile ainsi que sur une app backend.</p>
<h2 id="fonctionnement" class="anchor-title"><a href="#fonctionnement">Fonctionnement</a></h2>
<p>L'authentification par lien magique déporte toute la gestion des mots de passe sur la boîte mail de l'utilisateur. Celui-ci fournit son adresse email à l'application lorsqu'il souhaite s'y connecter, un lien d'authentification contenant un token lui est envoyé. L'utilisateur se connecte ensuite à sa boite mail puis clique sur le lien et est ensuite connecté sur l'application.</p>
<img src="/elao_/pr/260/images/posts/2018/magic-link.png" alt="" title="" id="magic-link-png">
<img src="/elao_/pr/260/resized/images/posts/2018/magic-link.png/c69ddb8ae2d269a425628f83c1ab62b8.png" alt="" title="" srcset="/elao_/pr/260/resized/images/posts/2018/magic-link.png/c69ddb8ae2d269a425628f83c1ab62b8.png 1x,
/elao_/pr/260/resized/images/posts/2018/magic-link.png/6b8503bbe56da3e0f31ff96779130e99.png 2x," id="c69ddb8ae2d269a425628f83c1ab62b8-png">
<h2 id="un-constat" class="anchor-title"><a href="#un-constat">Un constat</a></h2>
<p>Qu'est ce qui nous a poussé à mettre en place ce système ? C'est d'abord une idée qui a germé face à un constat.</p>
<p>En tant que développeurs et utilisateurs d'internet, nous sommes plusieurs à avoir fait le constat que beaucoup d'utilisateurs oublient très fréquemment leur mot de passe. En effet, une fois connecté à une application, grâce à des mécanismes comme le "Remember Me" ou les sessions longues, il peut se passer plusieurs semaines voir mois avant de devoir resaisir son mot de passe. Un grand nombre de connexions passent alors par une procédure d'oubli de mot de passe et donc par la boite email de l'utilisateur.</p>
<img src="/elao_/pr/260/images/posts/2018/you-cant-leak-passwords-meme.png" alt="You can't leak passwords if you don't store passwords." title="You can't leak passwords if you don't store passwords." id="you-can-t-leak-passwords-if-you-don-t-store-passwords">
<img src="/elao_/pr/260/resized/images/posts/2018/you-cant-leak-passwords-meme.png/dc19db34a70ae3b35adb7e43e9f21174.png" alt="You can't leak passwords if you don't store passwords." title="You can't leak passwords if you don't store passwords." srcset="/elao_/pr/260/resized/images/posts/2018/you-cant-leak-passwords-meme.png/dc19db34a70ae3b35adb7e43e9f21174.png 1x,
/elao_/pr/260/resized/images/posts/2018/you-cant-leak-passwords-meme.png/612c6035e56e6bb6a2c622c47f96d603.png 2x," id="you-can-t-leak-passwords-if-you-don-t-store-passwords">
<p>Ensuite nous y avons vu quelques avantages :</p>
<ul>
<li>Sans mots de passe à gérer, nous n'aurions pas à développer les fonctionnalités de l'oubli et de changement de mots de passes, donc un gain de temps.</li>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -289,7 +289,8 @@ <h1>Commander au clavier une application Symfony grâce au Routing</h1>
<p>Nous allons voir comment on peut ajouter à une application Symfony une UI différente,
une interface de commande par texte avec autocompletion.</p>
<h2 id="le-contexte" class="anchor-title"><a href="#le-contexte">Le contexte</a></h2>
<img src="/elao_/pr/260/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/backoffice.png" alt="Interface d'administration" id="interface-d-administration">
<img src="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/backoffice.png/624f3ef82942413ae306e2f80fa300d0.png" alt="Interface d'administration" srcset="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/backoffice.png/624f3ef82942413ae306e2f80fa300d0.png 1x,
/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/backoffice.png/5bcd57bff8c75a2c9e83b5cf1be7ea6c.png 2x," id="interface-d-administration">
<p>Ceci est une capture d'écran d'interface d'administration d'une application classique.
Il y a des listes, des boutons, des menus...
Pour accéder à une ressource ou à une fonctionnalité, plusieurs clics sont nécessaires.</p>
Expand All @@ -299,7 +300,8 @@ <h2 id="le-contexte" class="anchor-title"><a href="#le-contexte">Le contexte</a>
<p>S'inspirer des <strong>suggestions de résultats</strong> comme sur Google, Spotlight ou Alfred sous Mac ?</p>
<p>Exemple lorsqu'on tape "Modifier document" sur Google :</p>
<p class="text-center">
<img src="/elao_/pr/260/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/search.png" alt="Recherche avec suggestion de résultats" id="recherche-avec-suggestion-de-resultats">
<img src="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/search.png/275fcc5822aa256ca3d899e60b364c9e.png" alt="Recherche avec suggestion de résultats" srcset="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/search.png/275fcc5822aa256ca3d899e60b364c9e.png 1x,
/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/search.png/02f203dfb1442b94d6cd00d4609e332d.png 2x," id="recherche-avec-suggestion-de-resultats">
</p>
<p>Cela serait pas mal d'avoir la même chose dans notre application, n'est-ce pas ?</p>
<h2 id="exploiter-le-routing-de-symfony" class="anchor-title"><a href="#exploiter-le-routing-de-symfony">Exploiter le routing de Symfony ?</a></h2>
Expand Down Expand Up @@ -333,7 +335,8 @@ <h3 id="recuperer-toutes-les-routes-de-l-application" class="anchor-title"><a hr
<span class="token punctuation">}</span></span></code></pre>
<p>Cela donne comme résultat :</p>
<p class="text-center">
<img src="/elao_/pr/260/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/all-routes-dump.png" alt="Dump de *routes* les *routes* de l'application" style="width: 50%" id="dump-de-routes-les-routes-de-l-application">
<img src="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/all-routes-dump.png/f9a750bec0b0bd08482b30aa96db6b48.png" alt="Dump de *routes* les *routes* de l'application" style="width: 50%" srcset="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/all-routes-dump.png/f9a750bec0b0bd08482b30aa96db6b48.png 1x,
/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/all-routes-dump.png/1a4b42ceeac221be5ebe813f12a871a0.png 2x," id="dump-de-routes-les-routes-de-l-application">
</p>
<p>Filtrons maintenant les <em>routes</em> en ne gardant que les <em>routes</em> avec méthode GET :</p>
<pre class="code-multiline language-php"><code class="language-php" id="e942fcea16b842aa3c26305edd48de61"><span class="token php language-php"><span class="token delimiter important">&lt;?php</span>
Expand Down Expand Up @@ -372,7 +375,8 @@ <h3 id="demo" class="anchor-title"><a href="#demo">Démo</a></h3>
<a href="https://github.com/Pixabay/JavaScript-autoComplete" target="_blank">Pixabay/JavaScript-autoComplete</a>.</p>
<p>Et cela donne comme résultat :</p>
<p class="text-center">
<img src="/elao_/pr/260/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/demo1.gif" alt="Démo" id="demo">
<img src="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/demo1.gif/4ba8745575fcfc114ae0405c006cc388.gif" alt="Démo" srcset="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/demo1.gif/4ba8745575fcfc114ae0405c006cc388.gif 1x,
/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/demo1.gif/a82dc14d8d8fabdfc394a4a91fa251dd.gif 2x," id="demo">
</p>
<h2 id="deviner-des-parametres-de-route" class="anchor-title"><a href="#deviner-des-parametres-de-route">Deviner des paramètres de route</a></h2>
<p>Que faire maintenant si nos <em>routes</em> attendent des paramètres ? En terme d'expérience utilisateur, on souhaite que
Expand Down Expand Up @@ -668,7 +672,8 @@ <h3 id="traduction-des-noms-de-route" class="anchor-title"><a href="#traduction-
<span class="token punctuation">-</span> <span class="token string">'@translator'</span></code></pre>
<h3 id="demo" class="anchor-title"><a href="#demo">Démo</a></h3>
<p class="text-center">
<img src="/elao_/pr/260/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/demo2.gif" alt="Démo avec paramètre" id="demo-avec-parametre">
<img src="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/demo2.gif/6c2d436323f921e1c76664bacd2a6d4f.gif" alt="Démo avec paramètre" srcset="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/demo2.gif/6c2d436323f921e1c76664bacd2a6d4f.gif 1x,
/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/demo2.gif/4ab85d7bb44ccfdf08ec015b815169c0.gif 2x," id="demo-avec-parametre">
</p>
<h2 id="bilan" class="anchor-title"><a href="#bilan">Bilan</a></h2>
<h3 id="resultat" class="anchor-title"><a href="#resultat">Résultat</a></h3>
Expand Down Expand Up @@ -713,7 +718,8 @@ <h2 id="commander-par-la-voix" class="anchor-title"><a href="#commander-par-la-v
recognition<span class="token punctuation">.</span><span class="token method function property-access">start</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre>
<p>Le support de l'API SpeechRecognition est très limité pour l'instant :</p>
<p class="text-center">
<img src="/elao_/pr/260/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/caniuse-speech-recognition.png" alt="Can I Use SpeechRecognition" id="can-i-use-speechrecognition">
<img src="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/caniuse-speech-recognition.png/7de7d5b6cd308772af56d997ae2f99ca.png" alt="Can I Use SpeechRecognition" srcset="/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/caniuse-speech-recognition.png/7de7d5b6cd308772af56d997ae2f99ca.png 1x,
/elao_/pr/260/resized/images/posts/2018/commander-au-clavier-app-symfony-grace-au-routing/caniuse-speech-recognition.png/dc45442e5268ecf6927f30baddfd5e37.png 2x," id="can-i-use-speechrecognition">
</p>
<p><a href="https://www.google.com/intl/en/chrome/demos/speech.html" target="_blank">Démo ici</a> (à tester avec Chrome seulement au jour où cet article a été écrit).</p>
<p>C'est une technologie assez promoteuse. À suivre donc !</p>
Expand Down
Loading

0 comments on commit 132c0b3

Please sign in to comment.