<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Anis Berejeb &#187; WEB</title>
	<atom:link href="http://www.berejeb.com/category/web/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.berejeb.com</link>
	<description>Actualites et nouveautes du developpement web, PHP, MySQL, HTTP, JavaScript, Performance</description>
	<lastBuildDate>Thu, 24 Jan 2013 11:44:04 +0000</lastBuildDate>
	<language>fr-FR</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.5.1</generator>
		<item>
		<title>Les iterateurs en PHP, Comment ca marche!</title>
		<link>http://www.berejeb.com/2013/01/les-iterateurs-en-php-comment-ca-marche/</link>
		<comments>http://www.berejeb.com/2013/01/les-iterateurs-en-php-comment-ca-marche/#comments</comments>
		<pubDate>Thu, 24 Jan 2013 11:44:04 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[PHP]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[iterators]]></category>
		<category><![CDATA[programming with anthony]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=2330</guid>
		<description><![CDATA[Cet article est une traduction de la vidéo &#171;&#160;Iterators&#160;&#187; de la série &#171;&#160;Programming With Anthnoy&#160;&#187; de Anthony Ferrara. Le lien de la vidéo est en bas de l&#8217;article. En Général, un itérateur n&#8217;est rien d&#8217;autre qu&#8217;un générateur de séquence. A la base, une séquence est une liste ordonnée de valeurs. Ces valeurs peuvent être répétées [...]]]></description>
				<content:encoded><![CDATA[<p><a href="http://www.berejeb.com/wp-content/uploads/2013/01/Capture-d’écran-2013-01-21-à-08.08.36.png"><img class="aligncenter size-full wp-image-2331" title="Capture d’écran 2013-01-21 à 08.08.36" src="http://www.berejeb.com/wp-content/uploads/2013/01/Capture-d’écran-2013-01-21-à-08.08.36.png" alt="" width="678" height="443" /></a><br />
<em>Cet article est une traduction de la vidéo &laquo;&nbsp;Iterators&nbsp;&raquo; de la série &laquo;&nbsp;Programming With Anthnoy&nbsp;&raquo; de Anthony Ferrara. Le lien de la vidéo est en bas de l&rsquo;article.</em></p>
<p>En Général, un itérateur n&rsquo;est rien d&rsquo;autre qu&rsquo;un générateur de séquence.</p>
<p>A la base, une séquence est une liste ordonnée de valeurs. Ces valeurs peuvent être répétées dans la liste plusieurs fois, et il n&rsquo;est pas nécessaire qu&rsquo;elle soient ordonnées.</p>
<p>Le type le plus basique de séquence en programmation est le tableau. Les éléments d&rsquo;un tableau peuvent avoir de n&rsquo;importe quelle valeur, et peuvent etre positionnees arbitrairement. Toutefois, une fois ils sont placées, le tableau a un ordre défini.</p>
<p>Si on parcoure ce tableau, chaque boucle aura l&rsquo;élément prochain dans la séquence, jusqu&rsquo;à ce que l&rsquo;on arrive à la fin de ces éléments.</p>
<pre>    foreach ($array as $key =&gt; $value) {
        echo $value;
    }</pre>
<p>Si nous aurions parcouru ce tableau manuellement, nous aurions écrit une boucle for :</p>
<pre>    for ($i = 0; $i &lt; count($array); $i++) {
        echo $array[$i];
    }</pre>
<p>A la première itération, la valeur de $i est 0,<br />
On teste ensuite si $i est inferieure à la taille du tableau.<br />
On execute par la suite le corps de la boucle.<br />
Finalement, on incremente $i, et on retourne à l&rsquo;itération 2.</p>
<p>Sans le réaliser, chaque fois que vous écrivez une boucle for comme ceci, vous construisez un itérateur.</p>
<p>Un itérateur n&rsquo;est rien que l&rsquo;abstraction de la boucle for.<br />
Nous avons une méthode &laquo;&nbsp;rewind()&nbsp;&raquo;, qui est la même chose qu&rsquo;initiaiser $i a 0<br />
Nous avons une méthode &laquo;&nbsp;valid()&nbsp;&raquo;, qui joue le même rôle que le test si $i est inférieure à la taille du tableau.<br />
Nous avons une méthode &laquo;&nbsp;next()&nbsp;&raquo; qui est la même chose qu&rsquo;incrèmenter $i.<br />
Et finalement, nous avons deux fonctions qui sont utiles dans le corps de la boucle :<br />
la méthode &laquo;&nbsp;key()&nbsp;&raquo;, qui joue le role de recuperer la valeur de $i.<br />
et la méthode &laquo;&nbsp;current()&nbsp;&raquo; qui recupere la valeur de l&rsquo;élément a l&rsquo;index $i.</p>
<p>Donc, si on réécrivait notre boucle avec les itérateurs, ca ressemblerait à quelque chose du genre :</p>
<pre>    for ($it-&gt;rewind(); $it-&gt;valid(); $it-&gt;next()) {
        $current = $it-&gt;current();
        echo $current;
    }</pre>
<p>En réalité, c&rsquo;est tout ce que la boucle &laquo;&nbsp;foreach&nbsp;&raquo; fait à l&rsquo;interne! À l&rsquo;exception que foreach expose $key et $value automatiquement pour nous.<br />
Donc, notre code original de foreach devient :</p>
<pre>    foreach ($it as $key =&gt; $value) {
        echo $value;
    }</pre>
<p>Notez bien qu&rsquo;il est presque identique que le premier foreach!<br />
Lorsqu&rsquo;on utilise foreach, les tableaux et les itérateurs sont interchangeables.</p>
<p>Construisons donc notre premier vrai itérateur. Construisons notre boucle for comme un itérateur :</p>
<pre>    class ForLoopIterator implements Iterator {
        protected $array;
        protected $i = 0;
        public function __construct(array $array) {
            $this-&gt;array = $array;
        }
        public function rewind() {
            $this-&gt;i = 0;
        }
        public function valid() {
            return isset($this-&gt;array[$this-&gt;i]);
        }
        public function next() {
            $this-&gt;i++;
        }
        public function key() {
            return $this-&gt;i;
        }
        public function current() {
            return $this-&gt;array[$this-&gt;i];
        }
    }</pre>
<p>Premièrement, Notre classe doit implémenter l&rsquo;interface Iterator. Cette interface définit les 5 méthodes que nous avons besoin. Mais aussi, elle offre une logique (implémentée dans le langage) qui nous permet d&rsquo;utiliser l&rsquo;itérateur dans les construits foreach.</p>
<p>A part ça, cette classe ressemblerait à une facon plus expressive d&rsquo;une boucle for.</p>
<p>Il est important aussi de noter qu&rsquo;en pratique, nous n&rsquo;allons pas écrire cette classe. Nous allons plutôt utiliser la classe core ArrayIterator qui fait essentiellement la même chose.</p>
<p>Donc, maintenant que nous avons notre concept d&rsquo;itérateur basique, nous pouvons voir comment l&rsquo;utiliser.</p>
<p>L&rsquo;un des bénéfices d&rsquo;utiliser un itérateur est qu&rsquo;on peut optimiser l&rsquo;utilisation de memoire en generant uniquement les valeurs dont on a besoin, lorsqu&rsquo;elles sont necessaires.</p>
<p>Par exemple, essayons de generer une séquence Fibonacci.</p>
<pre>    class Fib implements Iterator {
        protected $a = 0;
        protected $b = 1;
        protected $i = 0;
        public function rewind() {
            $this-&gt;a = 0;
            $this-&gt;b = 1;
            $this-&gt;i = 0;
        }
        public function next() {
            $tmp = $this-&gt;b;
            $this-&gt;b = $this-&gt;a + $this-&gt;b;
            $this-&gt;a = $tmp;
            $this-&gt;i++;
        }
        public function valid() {
            return true;
        }
        public function key() {
            return $this-&gt;i;
        }
        public function current() {
            return $this-&gt;b;
        }
    }</pre>
<p>Vous pouvez construire un itérateur qui va uniquement générer une valeur à chaque fois.<br />
Le gros bénéfice est qu&rsquo;on peut produire un nombre infini de valeurs, sans que la consommation mémoire augmente au fure et a mesure.</p>
<p>Un autre bénéfice d&rsquo;utiliser un itérateur est que nous pouvons décorer ce dernier pour fournir des fonctionnalités additionnels.</p>
<p>Par exemple, si nous voulons itérer sur les valeurs paires sur le tableau precedent. Avec les tableaux, nous devons utiliser array_filter et donc dupliquer le tableau.<br />
Par contre, avec les itérateurs, nous pouvons simplement utiliser la Classe core CallbackFilterIterator.</p>
<pre>    $it = new CallbackFilterIterator($it, function($value) { return $value % 2 == 0; });</pre>
<p>La partie cool ici est que la structure du tableau original n&rsquo;est jamais changée ou dupliquée. L&rsquo;Itérateur va uniquement utiliser la méthode next() sur l&rsquo;itérateur core jusqu&rsquo;à trouver la valeur voulue.</p>
<p>La librairie SPL de PHP contient un nombre interessant de ce type de décorateurs que vous pouvez utiliser pour optimiser le comportement de vos itérateurs.</p>
<p>Maintenant, vous avez peut etre remarqué que les itérateurs ne sont pas typiquement des petites classes, leur implementation est assez verbeuse.</p>
<p>Par ailleurs, vous pouvez donner le comportement &laquo;&nbsp;traversable&nbsp;&raquo; a votre classe dans une boucle foreach en implémentant IteratorAggregate :</p>
<pre>    interface IteratorAggregate extends Traversable {
        public function getIterator();
    }</pre>
<p>L&rsquo;interface IteratorAggregate permet d&rsquo;instancier un itérateur different de votre classe. Supposons que votre classe a un tableau que vous voulez boucler dessus.</p>
<p>Au lieu de construire un nouvel itérateur dans votre classe, il faut simplement implementer IteratorAggregate :</p>
<pre>    class MyClass implements IteratorAggregate {
        protected $myArray = array();
        public function getIterator() {
            return new ArrayIterator($this-&gt;myArray);
        }
    }</pre>
<p>Maintenant, nous pouvons utiliser une instance de notre classe dans un foreach!<br />
Les itérateurs sont un concept tres puissant qui, si utilisé comme il faut, permettre d&rsquo;avoir un code propre et flexible!</p>
<p>La video originale d&rsquo;Anthony Ferrara (Anglais) : <a href="http://www.youtube.com/watch?v=tW6GcZjBc3E&amp;feature=share&amp;list=PLM-218uGSX3DQ3KsB5NJnuOqPqc5CW2kW">http://www.youtube.com/watch?v=tW6GcZjBc3E&amp;feature=share&amp;list=PLM-218uGSX3DQ3KsB5NJnuOqPqc5CW2kW</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2013/01/les-iterateurs-en-php-comment-ca-marche/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Applications Collaboratives et Temps reel avec Derby MVC</title>
		<link>http://www.berejeb.com/2012/12/applications-collaborativs-et-temps-reel-avec-derby-mvc/</link>
		<comments>http://www.berejeb.com/2012/12/applications-collaborativs-et-temps-reel-avec-derby-mvc/#comments</comments>
		<pubDate>Tue, 25 Dec 2012 16:49:24 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[WEB]]></category>
		<category><![CDATA[apps]]></category>
		<category><![CDATA[collaboration]]></category>
		<category><![CDATA[derby]]></category>
		<category><![CDATA[node.js]]></category>
		<category><![CDATA[offline]]></category>
		<category><![CDATA[realtime]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=2302</guid>
		<description><![CDATA[Derby MVC framework permet d&#8217;ecrire des applications collaboratifs en realtime, qui fonctionnent sur node.js ainsi que sur les navigateurs clients. Le framework offre un engin de synchronisation de donnees appelé Racer, qui synchronise automatiquement les donnees entre les navigateurs et les serveurs, ainsi qu&#8217;une base de donnees. Les modeles souscrivent a des objets specifiques, permettant ainsi [...]]]></description>
				<content:encoded><![CDATA[<p><a href="http://www.berejeb.com/wp-content/uploads/2012/12/derby.jpg"><img class="aligncenter size-full wp-image-2303" title="derby" src="http://www.berejeb.com/wp-content/uploads/2012/12/derby.jpg" alt="" width="580" height="357" /></a></p>
<p><a title="Derby" href="http://derbyjs.com/" target="_blank">Derby MVC framework</a> permet d&rsquo;ecrire des applications collaboratifs en realtime, qui fonctionnent sur node.js ainsi que sur les navigateurs clients. Le framework offre un engin de synchronisation de donnees appelé Racer, qui synchronise automatiquement les donnees entre les navigateurs et les serveurs, ainsi qu&rsquo;une base de donnees. Les modeles souscrivent a des objets specifiques, permettant ainsi le controle granulaire sur la propagation de donnees sans definir des canaux de transfert.</p>
<p>Racer permet l&rsquo;utilisation offline et la resolution de conflits, ce qui offre un grand plus. Les applications <a href="http://derbyjs.com/">Derby</a> peuvent etre indexés par les moteurs de recherche puisque les templates s&rsquo;affichent sur le serveur et le client. De plus, les templates definissent les &laquo;&nbsp;bindings&nbsp;&raquo;, ce qui permet de mettre a jour instantanement la vue suite au changement de modele et vice-versa.</p>
<p>Requirements: Node.js Framework<br />
Demo: <a title="demo" href="http://derbyjs.com/" rel="nofollow" target="_blank">http://derbyjs.com/</a><br />
License: MIT License</p>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2012/12/applications-collaborativs-et-temps-reel-avec-derby-mvc/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Deployd : Un serveur pour une api client / serveur unique!</title>
		<link>http://www.berejeb.com/2012/10/deployd-un-serveur-pour-une-api-client-serveur-unique/</link>
		<comments>http://www.berejeb.com/2012/10/deployd-un-serveur-pour-une-api-client-serveur-unique/#comments</comments>
		<pubDate>Sat, 13 Oct 2012 10:00:17 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[JAVASCRIPT]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[deployd]]></category>
		<category><![CDATA[featured]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=2163</guid>
		<description><![CDATA[Deployd est une platforme qui facilite la creation d&#8217;APIs REST. Avec Deployd, vous pouvez creer une API exploitable en quelques minutes! vous n&#8217;avez aucun serveur a installer, aucune configuration a faire.  faites simplement installer Deployd, et vous etes pret pour votre premiere API. A part la creation de ressources via une interface graphique, Deployd expose aussi [...]]]></description>
				<content:encoded><![CDATA[<p><a href="http://www.berejeb.com/wp-content/uploads/2012/10/deployd.jpeg"><img class="aligncenter size-full wp-image-2172" title="deployd" src="http://www.berejeb.com/wp-content/uploads/2012/10/deployd.jpeg" alt="" width="580" height="358" /></a></p>
<p><a title="Deployd" href="http://www.deployd.com/" target="_blank">Deployd</a> est une <strong>platforme qui facilite la creation d&rsquo;APIs REST</strong>. Avec Deployd, vous pouvez creer une API exploitable en quelques minutes! vous n&rsquo;avez aucun serveur a installer, aucune configuration a faire.  faites simplement installer Deployd, et vous etes pret pour votre premiere API.</p>
<p>A part la creation de ressources via une interface graphique, Deployd expose aussi un objet Javascript du coté client, qui facilite l&rsquo;inspection du code. le tout est sous license gratuite apache.</p>
<p>Nécessite : -<br />
Demo: <a title="demo" href="http://www.deployd.com/" rel="nofollow" target="_blank">http://www.deployd.com/</a><br />
License: Apache License</p>
<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2012/10/deployd-un-serveur-pour-une-api-client-serveur-unique/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Recline.js : une application web pour vos données a haut traffic</title>
		<link>http://www.berejeb.com/2012/07/recline-js-une-application-web-pour-vos-donnees-a-haut-traffic/</link>
		<comments>http://www.berejeb.com/2012/07/recline-js-une-application-web-pour-vos-donnees-a-haut-traffic/#comments</comments>
		<pubDate>Tue, 10 Jul 2012 15:51:23 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[JAVASCRIPT]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[Amazon]]></category>
		<category><![CDATA[couchdb]]></category>
		<category><![CDATA[data]]></category>
		<category><![CDATA[elastic search]]></category>
		<category><![CDATA[farmework]]></category>
		<category><![CDATA[recline.js]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=2022</guid>
		<description><![CDATA[Recline.js est une application en Javascript pour concevoir des applications dediees aux donnees. L&#8217;application est dotee d&#8217;un framework qui expose des librairies d&#8217;acces aux donnees (DataSet, Record, Field) ainsi que des vues pour les afficher (Grille, Carte, timeline,  etc.) La librairie offre plusieurs wrappers pour communiquer avec des serveurs de donnees comme : Elastic Search Google [...]]]></description>
				<content:encoded><![CDATA[<p><a href="http://www.berejeb.com/wp-content/uploads/2012/07/recline-js.png"><img class="aligncenter size-full wp-image-2023" title="recline-js" src="http://www.berejeb.com/wp-content/uploads/2012/07/recline-js.png" alt="" width="580" height="218" /></a></p>
<p><a title="Recline.js" href="http://reclinejs.com/" target="_blank">Recline.js</a> est une application en Javascript pour concevoir des applications dediees aux donnees. L&rsquo;application est dotee d&rsquo;un framework qui expose des librairies d&rsquo;acces aux donnees (DataSet, Record, Field) ainsi que des vues pour les afficher (Grille, Carte, timeline,  etc.)</p>
<p>La librairie offre plusieurs wrappers pour communiquer avec des serveurs de donnees comme :</p>
<ul>
<li>Elastic Search</li>
<li>Google docs</li>
<li>Couch DB</li>
<li>Data Proxy</li>
<li>etc.</li>
</ul>
<p>Necessite : Backbone Framework<br />
Demo: <a title="demo" href="http://reclinejs.com/" rel="nofollow" target="_blank">http://reclinejs.com/</a><br />
License: MIT License</p>
<hr />
<p>Article Web Appers original (en anglais) : <a href="http://www.webappers.com/2012/07/10/a-powerful-library-for-data-heavy-applications/">http://www.webappers.com/2012/07/10/a-powerful-library-for-data-heavy-applications/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2012/07/recline-js-une-application-web-pour-vos-donnees-a-haut-traffic/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Balloons.IO : Serveur de Chat Open Source avec Node.js et Redis</title>
		<link>http://www.berejeb.com/2012/06/balloons-io-serveur-de-chat-open-source-avec-node-js-et-redis/</link>
		<comments>http://www.berejeb.com/2012/06/balloons-io-serveur-de-chat-open-source-avec-node-js-et-redis/#comments</comments>
		<pubDate>Thu, 28 Jun 2012 15:49:19 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[DIVERS]]></category>
		<category><![CDATA[JAVASCRIPT]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[Balloons.IO]]></category>
		<category><![CDATA[chat]]></category>
		<category><![CDATA[client]]></category>
		<category><![CDATA[node.js]]></category>
		<category><![CDATA[Redis]]></category>
		<category><![CDATA[server]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=1987</guid>
		<description><![CDATA[&#160; Balloons.IO est un serveur de chat multi-salles, et dispose d&#8217;un client pret a l&#8217;utilisation. la plateforme est conçue sur la base de Node.JS, Express, Socket.IO et Redis. Balloons dispose aussi de plugins d&#8217;authentification OAuth (utilisable avec Twitter par exemple.) L&#8217;interface est tres clean et personnalisable avec CSS. Le tout est sous license MIT, vous pourrez donc l&#8217;installer sur votre [...]]]></description>
				<content:encoded><![CDATA[<p>&nbsp;</p>
<p><a href="http://www.berejeb.com/wp-content/uploads/2012/06/balloons-chat.jpg"><img class="aligncenter size-full wp-image-2009" title="balloons-chat" src="http://www.berejeb.com/wp-content/uploads/2012/06/balloons-chat.jpg" alt="" width="580" height="464" /></a></p>
<p><a title="Balloons.IO" href="https://github.com/gravityonmars/Balloons.IO" target="_blank">Balloons.IO</a> est un <strong>serveur de chat multi-salles,</strong> et dispose d&rsquo;un client pret a l&rsquo;utilisation. la plateforme est conçue sur la base de Node.JS, Express, Socket.IO et Redis. Balloons dispose aussi de plugins d&rsquo;authentification OAuth (utilisable avec Twitter par exemple.) L&rsquo;interface est tres clean et personnalisable avec CSS. Le tout est sous license MIT, vous pourrez donc l&rsquo;installer sur votre serveur gratuitement et facilement.</p>
<p>Nécessite: Node.js, Redis<br />
Demo: <a title="demo" href="https://github.com/gravityonmars/Balloons.IO" rel="nofollow" target="_blank">https://github.com/gravityonmars/Balloons.IO</a><br />
License: MIT License</p>
<hr />
<p>Article Web Appers original (en anglais) : <a href="http://www.webappers.com/2012/06/12/open-source-chat-rooms-web-application-with-node-js/">http://www.webappers.com/2012/06/12/open-source-chat-rooms-web-application-with-node-js/</a></p>
<div></div>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2012/06/balloons-io-serveur-de-chat-open-source-avec-node-js-et-redis/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Sigma.js: Dessiner des Graphes interactives avec les Canvas HTML5</title>
		<link>http://www.berejeb.com/2012/06/sigma-js-dessiner-des-graphes-interactives-avec-les-canvas-html5/</link>
		<comments>http://www.berejeb.com/2012/06/sigma-js-dessiner-des-graphes-interactives-avec-les-canvas-html5/#comments</comments>
		<pubDate>Thu, 28 Jun 2012 15:46:44 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[DIVERS]]></category>
		<category><![CDATA[JAVASCRIPT]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[cartes]]></category>
		<category><![CDATA[interactif]]></category>
		<category><![CDATA[reseaux]]></category>
		<category><![CDATA[sigma.js]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=1984</guid>
		<description><![CDATA[&#160; Sigma.js est une librairie Javascript Open source, qui vous aide a dessiner des graphes en utilisant les canvas HTML5. La librairie a ete concue pour partager des cartes interactives sur vos pages web ainsi que d&#8217;explorer dynamiquement une base de donnees reseau.  La license de la librairie est sous MIT License. Nécessite : Javascript Demo: http://sigmajs.org/ License: [...]]]></description>
				<content:encoded><![CDATA[<p>&nbsp;</p>
<p><a href="http://www.berejeb.com/wp-content/uploads/2012/06/sigma-js.jpg"><img class="aligncenter size-full wp-image-2007" title="sigma-js" src="http://www.berejeb.com/wp-content/uploads/2012/06/sigma-js.jpg" alt="" width="580" height="354" /></a></p>
<p><a title="Sigmajs" href="http://sigmajs.org/" target="_blank">Sigma.js</a> est une librairie Javascript Open source, qui vous aide a dessiner des graphes en utilisant les canvas HTML5. La librairie a ete concue pour partager des cartes interactives sur vos pages web ainsi que d&rsquo;explorer dynamiquement une base de donnees reseau.  La license de la librairie est sous MIT License.</p>
<p>Nécessite : Javascript<br />
Demo: <a title="demo" href="http://sigmajs.org/" rel="nofollow" target="_blank">http://sigmajs.org/</a><br />
License: MIT License</p>
<hr />
<p>Article Web Appers original (en anglais) : <a href="http://www.webappers.com/2012/06/13/sigma-js-draw-graphs-using-html5-canvas-element/">http://www.webappers.com/2012/06/13/sigma-js-draw-graphs-using-html5-canvas-element/</a></p>
<div></div>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2012/06/sigma-js-dessiner-des-graphes-interactives-avec-les-canvas-html5/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Streak : Gestionnaire de taches et bug tracking directement dans votre Gmail</title>
		<link>http://www.berejeb.com/2012/06/streak-gestionnaire-de-taches-et-bug-tracking-directement-dans-votre-gmail/</link>
		<comments>http://www.berejeb.com/2012/06/streak-gestionnaire-de-taches-et-bug-tracking-directement-dans-votre-gmail/#comments</comments>
		<pubDate>Wed, 20 Jun 2012 15:52:07 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[WEB]]></category>
		<category><![CDATA[Gmail]]></category>
		<category><![CDATA[Streak]]></category>
		<category><![CDATA[system]]></category>
		<category><![CDATA[task]]></category>
		<category><![CDATA[tracking]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=1977</guid>
		<description><![CDATA[&#160; Streak est un service qui vous permet de tracker vos bugs, taches etc directement depuis votre gestionnaire de mails (Gmail). L&#8217;application de cet outil va du support a la clientele aux services de ventes en passant par les services d&#8217;IT etc. L&#8217;application offre des fonctionnalités pour envoyer les messages a une date prédéterminée, d&#8217;avoir un tableau [...]]]></description>
				<content:encoded><![CDATA[<p>&nbsp;</p>
<p><a href="http://www.berejeb.com/wp-content/uploads/2012/06/gmail-tools.jpg"><img class="aligncenter size-full wp-image-2002" title="gmail-tools" src="http://www.berejeb.com/wp-content/uploads/2012/06/gmail-tools.jpg" alt="" width="577" height="373" /></a></p>
<p><a title="Streak" href="http://www.streak.com/" target="_blank">Streak</a> est un service qui vous permet de tracker vos bugs, taches etc directement depuis votre gestionnaire de mails (Gmail). L&rsquo;application de cet outil va du support a la clientele aux services de ventes en passant par les services d&rsquo;IT etc. L&rsquo;application offre des fonctionnalités pour envoyer les messages a une date prédéterminée, d&rsquo;avoir un tableau de bord sur les activités reliées a votre projet. Streak ajoute un niveau d&rsquo;organisation dans votre email mais le stockage se fait securitairement dans leur cloud.</p>
<p>Requirements: -<br />
Demo: <a title="demo" href="http://www.streak.com/" rel="nofollow" target="_blank">http://www.streak.com/</a><br />
License: License Free</p>
<hr />
<p>Article Web Appers original (en anglais) : <a href="http://www.webappers.com/2012/06/19/bug-tracking-and-customer-support-inside-gmail/">http://www.webappers.com/2012/06/19/bug-tracking-and-customer-support-inside-gmail/</a></p>
<div></div>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2012/06/streak-gestionnaire-de-taches-et-bug-tracking-directement-dans-votre-gmail/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Graphique à barres dynamique avec CSS3</title>
		<link>http://www.berejeb.com/2012/06/graphique-a-barres-dynamique-avec-css3/</link>
		<comments>http://www.berejeb.com/2012/06/graphique-a-barres-dynamique-avec-css3/#comments</comments>
		<pubDate>Mon, 04 Jun 2012 14:31:59 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[DIVERS]]></category>
		<category><![CDATA[JAVASCRIPT]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[Barchart]]></category>
		<category><![CDATA[CodRops]]></category>
		<category><![CDATA[css3]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=1938</guid>
		<description><![CDATA[&#160; Cet Excellent tutoriel montre comment développer un Graphique a Barre 3D  avec HTML et CSS3. Le graphique est independant du background, Facilement personnalisable, adaptable au nombre de barres choisies. La démo peut etre visualisée ici : http://tympanus.net/Tutorials/CSS3AnnotationOverlayEffect/ Lire La suite sur CodRops : http://tympanus.net/codrops/2012/05/21/animated-3d-bar-chart-with-css3/ &#160;]]></description>
				<content:encoded><![CDATA[<p>&nbsp;</p>
<p><a href="http://www.berejeb.com/wp-content/uploads/2012/06/3dBarChart1.jpg"><img class="aligncenter size-full wp-image-1996" title="3dBarChart" src="http://www.berejeb.com/wp-content/uploads/2012/06/3dBarChart1.jpg" alt="" width="580" height="315" /></a>Cet Excellent tutoriel montre comment développer un Graphique a Barre 3D  avec HTML et CSS3. Le graphique est independant du background, Facilement personnalisable, adaptable au nombre de barres choisies.</p>
<p>La démo peut etre visualisée ici : <a href="http://tympanus.net/Tutorials/CSS3AnnotationOverlayEffect/">http://tympanus.net/Tutorials/CSS3AnnotationOverlayEffect/</a></p>
<hr />
<p class="lire-la-suite">Lire La suite sur CodRops : <a href="http://tympanus.net/codrops/2012/05/21/animated-3d-bar-chart-with-css3/">http://tympanus.net/codrops/2012/05/21/animated-3d-bar-chart-with-css3/</a></p>
<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2012/06/graphique-a-barres-dynamique-avec-css3/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Tutoriel : Effets d&#8217;annotations avec CSS3</title>
		<link>http://www.berejeb.com/2012/06/tutoriel-effets-dannotations-avec-css3/</link>
		<comments>http://www.berejeb.com/2012/06/tutoriel-effets-dannotations-avec-css3/#comments</comments>
		<pubDate>Sun, 03 Jun 2012 14:32:00 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[DIVERS]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[CodRops]]></category>
		<category><![CDATA[css3]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=1942</guid>
		<description><![CDATA[&#160; Apprenez comment effectuer des animations d&#8217;annotations sur une image avec CSS3 en utilisant la propriété :checked pseudo-class.  http://tympanus.net/codrops/2012/05/14/annotation-overlay-effect-with-css3/. &#160;]]></description>
				<content:encoded><![CDATA[<p>&nbsp;</p>
<p><a href="http://www.berejeb.com/wp-content/uploads/2012/06/AnnotationOverlayEffectwithCSS31.jpg"><img class="aligncenter size-full wp-image-1998" title="AnnotationOverlayEffectwithCSS3" src="http://www.berejeb.com/wp-content/uploads/2012/06/AnnotationOverlayEffectwithCSS31.jpg" alt="" width="580" height="315" /></a></p>
<p>Apprenez comment effectuer des animations d&rsquo;annotations sur une image avec CSS3 en utilisant la propriété <strong>:checked pseudo-class.</strong>  <a href="http://tympanus.net/codrops/2012/05/14/annotation-overlay-effect-with-css3/">http://tympanus.net/codrops/2012/05/14/annotation-overlay-effect-with-css3/</a>.</p>
<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2012/06/tutoriel-effets-dannotations-avec-css3/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>PHP-OAuth2 : Un excellent client OAuth2 pour PHP5</title>
		<link>http://www.berejeb.com/2011/09/php-oauth2-un-excellent-client-oauth2-pour-php5/</link>
		<comments>http://www.berejeb.com/2011/09/php-oauth2-un-excellent-client-oauth2-pour-php5/#comments</comments>
		<pubDate>Fri, 09 Sep 2011 14:34:16 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[PHP]]></category>
		<category><![CDATA[WEB]]></category>
		<category><![CDATA[facebook]]></category>
		<category><![CDATA[facebook php]]></category>
		<category><![CDATA[oauth]]></category>
		<category><![CDATA[oauth2]]></category>
		<category><![CDATA[php facebook client]]></category>
		<category><![CDATA[php5]]></category>
		<category><![CDATA[php5 oauth2 client]]></category>

		<guid isPermaLink="false">http://www.berejeb.com/?p=1838</guid>
		<description><![CDATA[Dernièrement, j&#8217;ai contribué a un projet Open source PHP-OAuth2, qui fournit un client OAuth2 pour PHP5. Le projet est initié et développé par Pierrick Charron et est disponible sur GitHub. Le client permet de se connecter et de consommer n&#8217;importe quelle API qui supporte le protocole OAuth2. Dans ce post, nous allons voir comment installer, utiliser et étendre cet outil pour des [...]]]></description>
				<content:encoded><![CDATA[<p><a href="http://www.berejeb.com/wp-content/uploads/2011/09/php-oauth2.png"><img class="alignnone size-full wp-image-1842" title="php-oauth2" src="http://www.berejeb.com/wp-content/uploads/2011/09/php-oauth2.png" alt="" width="250" height="250" /></a></p>
<p>Dernièrement, j&rsquo;ai contribué a un projet Open source <a href="https://github.com/adoy/PHP-OAuth2">PHP-OAuth2</a>, qui fournit un client OAuth2 pour PHP5. Le projet est initié et développé par <a href="https://github.com/adoy">Pierrick Charron</a> et est disponible sur <a href="https://github.com/adoy/PHP-OAuth2">GitHub</a>. Le client permet de se connecter et de consommer n&rsquo;importe quelle API qui supporte <a href="http://oauth.net/2/">le protocole OAuth2</a>. Dans ce post, nous allons voir comment installer, utiliser et étendre cet outil pour des besoins spécifiques.</p>
<h2>Installation</h2>
<p>L&rsquo;installation est simple. Il suffit en fait de récupérer le script via Git :</p>
<pre>git clone git://github.com/adoy/PHP-OAuth2.git</pre>
<h2>Utilisation</h2>
<p>Pour utiliser le client, assurez vous tout d&rsquo;abord que le client est accessible depuis votre code (include, include_path, autoload etc.). Par la suite, vous devez definir 5 constantes :</p>
<ul>
<li>CLIENT_ID : votre identifiant client.</li>
<li>CLIENT_SECRET : votre cle secrete.</li>
</ul>
<p>vous récupérez ces deux valeurs depuis le serveur OAuth2 (Facebook Apps par exemple)</p>
<ul>
<li>REDIRECT_URI : l&rsquo;url de redirection de votre application.</li>
<li>AUTHORIZATION_ENDPOINT : L&rsquo;url du service d&rsquo;autorisation</li>
<li>TOKEN_ENDPOINT : L&rsquo;url du service de recuperation des jetons d&rsquo;acces.</li>
</ul>
<div>Voici un exemple :</div>
<pre>require('client.php');

const CLIENT_ID     = 'your client id';
const CLIENT_SECRET = 'your client secret';

const REDIRECT_URI           = '<a href="http://url/of/this.php">http://url/of/this.php</a>';
const AUTHORIZATION_ENDPOINT = '<a href="https://graph.facebook.com/oauth/authorize">https://graph.facebook.com/oauth/authorize</a>';
const TOKEN_ENDPOINT         = '<a href="https://graph.facebook.com/oauth/access_token">https://graph.facebook.com/oauth/access_token</a>';

$client = new OAuth2\Client(CLIENT_ID, CLIENT_SECRET);
if (!isset($_GET['code']))
{
    $auth_url = $client-&gt;getAuthenticationUrl(AUTHORIZATION_ENDPOINT, REDIRECT_URI);
    header('Location: ' . $auth_url);
    die('Redirect');
}
else
{
    $params = array('code' =&gt; $_GET['code'], 'redirect_uri' =&gt; REDIRECT_URI);
    $response = $client-&gt;getAccessToken(TOKEN_ENDPOINT, 'authorization_code', $params);
    parse_str($response['result'], $info);
    $client-&gt;setAccessToken($info['access_token']);
    $response = $client-&gt;fetch('<a href="https://graph.facebook.com/me">https://graph.facebook.com/me</a>');
    var_dump($response, $response['result']);
}</pre>
<h2>Explication</h2>
<p>On instancie tout d&rsquo;abord le client en lui passant l&rsquo;identification du client ainsi que la cle secrète. Il y a deux cas a gérer par la suite:</p>
<ol>
<li>En accédant au script (sans spécifier de code dans l&rsquo;url), on récupère l&rsquo;url d&rsquo;authentification via la méthode <em><strong>getAuthenticationUrl</strong><strong>()</strong></em>, et on redirige l&rsquo;utilisateur vers cette addresse (Dans notre exemple, c&rsquo;est l&rsquo;adresse d&rsquo;authentification de l&rsquo;utilisateur sur Facebook).</li>
<li>Une fois l&rsquo;utilisateur authentifié, le serveur le redirige vers notre script en lui fournissant un code d’accès. Dans ce cas, en récupérant le code depuis $_GET, nous allons récupérer un jeton d’accès depuis le service de récupération de jetons. Ceci est effectué via la méthode<strong style="font-style: italic;"> getAccessToken()</strong>.</li>
<li>Une fois le jeton d’accès récupéré, il est alors possible de consommer l&rsquo;api via la méthode<strong style="font-style: italic;"> fetch()</strong>.</li>
</ol>
<p>Assez simple non?</p>
<h2>Comment je peux définir des nouveaux types d’accès ?</h2>
<p>Si vous utilisez l&rsquo;API de Facebook, vous n&rsquo;avez probablement pas besoin d&rsquo;utiliser ce genre d’opérations. Dans le cas ou vous connectez a un autre service, il est possible que ce dernier vous offre des modes d’accès personnalisés. Il est alors possible d’étendre le client OAuth2 pour supporter ces appels. Il suffit d’écrire alors une nouvelle classe pour ce faire. Voici un exemple :</p>
<pre>namespace OAuth2\GrantType;

/**
 * MyCustomGrantType Grant Type
 */
class MyCustomGrantType implements IGrantType
{
    /**
     * Defines the Grant Type
     *
     * @var string  Defaults to 'my_custom_grant_type'.
     */
    const GRANT_TYPE = 'my_custom_grant_type';

    /**
     * Adds a specific Handling of the parameters
     *
     * @return array of Specific parameters to be sent.
     * @param  mixed  $parameters the parameters array (passed by reference)
     */
    public function validateParameters(&amp;$parameters)
    {
        if (!isset($parameters['first_mandatory_parameter']))
        {
            throw new \Exception('The \'first_mandatory_parameter\' parameter must be defined for the Password grant type');
        }
        elseif (!isset($parameters['second_mandatory_parameter']))
        {
            throw new \Exception('The \'seconde_mandatory_parameter\' parameter must be defined for the Password grant type');
        }
    }
}</pre>
<p>Vous pouvez alors utiliser la méthode getAccessToken en lui spécifiant le nouveau type d’accès :</p>
<pre>$response = $client-&gt;getAccessToken(TOKEN_ENDPOINT, 'my_custom_grant_type', $params);</pre>
<p>Si vous avez des questions ou des commentaires sur l&rsquo;utilisation du script ou par rapport au protocole OAuth2, n&rsquo;hesitez pas!</p>
<ul>
<li><strong>Téléchargement</strong> : git clone git://github.com/adoy/PHP-OAuth2.git</li>
<li><strong>Documentation</strong> : <a href="https://github.com/adoy/PHP-OAuth2">https://github.com/adoy/PHP-OAuth2</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.berejeb.com/2011/09/php-oauth2-un-excellent-client-oauth2-pour-php5/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
