Ange Chierchia - Webdesigner & développeur front-end

Déployer Jekyll sur un VPS avec GitHub

Il y a deux mois j’ai totalement abandonné WordPress pour passer à Jekyll, une solution beaucoup moins lourde et plus en phase avec ma façon actuelle de publier sur mon blog. Dans mon précédent billet, j’avais évoqué la possibilité pour moi d’abandonner mon mutualisé OVH en faveur de GitHub Pages. Je me suis donc amusé beaucoup plus qu’à l’accoutumée avec GitHub et GitHub Pages ces derniers mois, pour voir si la plateforme répondrait à mes attentes.

Jekyll

Ça faisait un moment que j’avais envie de quitter WordPress car il ne répondait plus vraiment à mes usages. Je ne blogue pas énormément, encore moins qu’avant en fait. Je voulais garder mon contenu en ligne, mais je voulais quelque chose de plus simple, moins lourd et qui n’aurait pas besoin d’être régulièrement mis à jour à chaque failles de sécurité découvertes.

Impression et en-tête de page : casse-tête

Il y a quelques semaines, je travaillais sur un template de bilan comptable, destiné a être imprimé via notre application IBAKUS®COMPTA, dans lequel l’en-tête de page devait se répéter sur chaque pages du document.

/blog/flexbox-patterns-elements-dinterfaces-flexbox/

Flexbox Patterns – éléments d’interfaces avec flexbox

Utiliser les Flexbox CSS pour le design d’interfaces utilisateurs est devenu de plus en plus courant , d’une part parce que réaliser des mises en pages complexes est beaucoup moins casse-tête en utilisant les Flexbox CSS qu’en utilisant la vieille technique des boîtes flottantes (float: left, float: right) et bénéficie d’un meilleur support des navigateurs Web actuels. Pourquoi s’en privé !

Flexbox Patterns de CJ Cenizal présente à travers différents exemples d’interfaces utilisateurs, les nouvelles propriétés CSS liées à Flexbox et comment les utiliser .

Nettoyer une chaîne de caractères avec PHP

Quoi de plus simple que de nettoyer une chaîne de caractères pour l’utiliser comme URL vers une page, un article ou tout autre contenu publié sur Internet en général ? Et pourtant…

/blog/list-js/

List.js

List.js est une petite libraire Javascript qui permet d’ajouter très rapidement et simplement des fonctionnalités de tri, de filtrage et de recherche à une liste HTML existante, sans en altérer le code.

Voilà comment la librairie fonctionne :

<div id="users">
  <input class="search" placeholder="Search" />
  <button class="sort" data-sort="name">
    Sort by name
  </button>

  <ul class="list">
    <li>
      <h3 class="name">Jonny Stromberg</h3>
      <p class="born">1986</p>
    </li>
    <li>
      <h3 class="name">Jonas Arnklint</h3>
      <p class="born">1985</p>
    </li>
    <li>
      <h3 class="name">Martina Elm</h3>
      <p class="born">1986</p>
    </li>
    <li>
      <h3 class="name">Gustaf Lindqvist</h3>
      <p class="born">1983</p>
    </li>
  </ul>
</div>
<script src="http://listjs.com/no-cdn/list.js"></script>

Ensuite un simple appel à la fonction List() et le tour est joué

var options = {
  valueNames: [ 'name', 'born' ]
};
var userList = new List('users', options);

See the Pen zpuKF by Jonny Strömberg (@javve) on CodePen.

Créer un pixel de suivi

Ces dernières semaines, j’ai essentiellement travaillé sur la conception d’un cookie/pixel de suivi et le traitement des informations récupérées, pour en faire des tableaux statistiques et autres graphiques de fréquentation par la suite. Je vous parlerai peut-être de mon expérience avec la librairie JavaScript C3.js dans un prochain article.

/blog/une-navigation-3d-en-css-et-jquery/

Une navigation 3D en CSS et jQuery

Les éléments de navigation sont essentiels lorsqu’on conçoit un site Internet, que ce soit pour la navigation entre les différentes pages d’un site, ou simplement se déplacer vers différentes sections d’une même page. Claudia Romano propose un concept de navigation responsive simple mais avec beaucoup de caractère. Idéal pour la navigation d’un site type portfolio.

Astuce Sass : imbrication de propriétés composites

Cette semaine je lisais Sass pour les Web designers, de Dan Cederholm et j’ai découvert une petite astuce que je ne connaissait pas : l’imbrication de propriétés composites.

Créer son framework PHP Objet

Pour faire suite à un article que j’avais écrit il y a un peu plus de quatre ans maintenant sur la création d’un framework PHP, je vous propose de créer un framework PHP Objet en utilisant les principes MVC.