Ange Chierchia

Développeur Web full-stack

Bookmarks

  • Rappel !

    Likes 10 years ago we were at peak parallax by Rach Smith.

    Most of the agencies I gigged for didn’t even use source control, you deployed by uploading the folder to the server via FTP!

    C’est tellement ça ! Pour ma part, je n’ai commencé à utiliser Git qu’aux alentours de 2017, quand j’étais encore chez Ibakus Europe et que nous avions décidé de réécrire les applications en Symfony. Avant ça c’était Filezilla ou Transmit et on essayait de ne pas travailler sur les mêmes fichiers en même temps 😅. La lecture de ce billet m’a mis un petit coup de vieux, l’auteure ayant sensiblement le même âge que moi, mais c’est un très bon rappel.

  • Garder des URLs pour plus tard

    Likes https://chriscoyier.net/2023/08/20/how-do-i-save-links-for-later/.

    Ce matin je suis tombé sur ce post de Chris Coyier dans lequel il explique sa manière de garder l’URL d’une page Web pour plus tard.

    Il catégorise ses liens dans trois catégories : court terme, moyen terme et long terme et n’utilise jamais les favoris du navigateur pour garder une URL.

    What do I not do?

    • Bookmarks. A lot of browsers offer them and saving URLs is kind of the point of them. I just never got into that habit in any browser.
    • Open tabs. Of course I have some open tabs, and those are pretty immediate forms of link saving, but I’m pretty quick to close them and don’t think of them as links I’m saving for later.

    Chris Coyier

    J’ai trouvé son approche très intéressante même si je ne comprend pas bien pourquoi utiliser les favoris du navigateur soit si dérangeant pour lui. Personnellement c’est la méthode que j’utilise.

    Après, c’est vrai que je ne peut pas accéder à mes favoris depuis mon iPhone, parce que j’utilise Firefox sur mon ordinateur et Safari sur mon iPhone, mais ça n’est pas si dérangeant. Peut-être que je m’inspirerai de sa méthode si mes besoins changent un jour.

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

    Bookmarked Flexbox Patterns.

    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 .

  • List.js

    Bookmarked Search, sort, filters, flexibility to tables, list and more! – List.js by Jonny Strömberg.

    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.

  • Une navigation 3D en CSS et jQuery

    Bookmarked 3D Bold Navigation in CSS and jQuery | CodyHouse.

    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.

  • Ajuster text-color en fonction de background avec Sass

    Bookmarked https://web.archive.org/web/20201013205223/http://thesassway.com/intermediate/dynamically-change-text-color-based-on-its-background-with-sass.

    Dans un article de The Sass Way, Sebastian Ekström nous montre comment, avec Sass, garantir la meilleure lisibilité possible à vos textes pour une couleur de fond donnée.

    Pour cela, il écrit une fonction Sass qui retournera une couleur différente en fonction de la couleur qui lui sera passée en paramètre. Cette fonction vérifie tout simplement le taux de luminosité de la couleur qu’elle reçoit et retourne une couleur contrastée en conséquence. Si sa luminosité est supérieure à 50%, la fonction retournera une couleur sombre, sinon une couleur claire.

    Lisez son article sur The Sass Way, pour voir comment il fait ça.  Sa solution est toute simple mais efficace.

  • Parsley.js – Validez vos formulaires en JavaScript. Simplement.

    Bookmarked Parsley – The ultimate JavaScript form validation library by Guillaume Potier.

    Je faisais ma veille tranquillement ce matin, quand je suis tombé sur Parsley.js, totalement par hasard. Parsely.js est un petit plugin JavaScript qui permet de laisser un peu de côté ce qu’on adore détester : la validation de formulaire côté client. L’intérêt du plugin réside dans le fait qu’il ne nécessite aucune ligne de JavaScript, tout se passe au sein du code HTML5 grâce à l’attribut data-*. Enjoy !

  • Instafeed – vos photos Instagram. Partout

    Bookmarked Instafeed.js – a simple Instagram javascript plugin.

    Aujourd’hui, je suis tombé sur Instafeed.js, un plugin JavaScript permettant d’afficher des flux de photos Instagram n’importe où.

    L’intérêt de ce plugin réside dans le fait que l’on peu récupérer des flux de photos selon un tag particulier, un lieu, un utilisateur ou simplement les photos les plus populaires.

    Du coup, je me suis empressé de le mettre en place ici sur mon blog.

  • Glyphs HTML

    Bookmarked Glyphs | CSS-Tricks by Chris Coyier.

    Cela fait un bout de temps que j’ai ce petit lien dans mes cartons : une ressource qui répertorie les différentes façon d’écrire un caractère spécial au format ISO pour l’inclure dans nos CSS et notamment  avec la propriété content, mais aussi en hexadécimal, etc. Une ressource incontournable donc. Merci Chris Coyier.

  • iconmonstr – des icônes gratuites en PNG et SVG !

    Bookmarked http://iconmonstr.com.

    Vous cherchez des icônes minimalistes pour vos interfaces utilisateur ? Alors le site iconmonstr.com est fait pour vous ! En plus de proposer plus de 600 icônes de qualité, celles-ci sont disponibles au format PNG, mais aussi et surtout au format SVG ! Le must pour vos interfaces adaptées aux écrans hautes densité !