Les ressources de la semaine #1

Découvrez cette semaine les ressources qui m’ont tapé dans l’oeil. Au programme du CSS, du SQL, et du JS.

1. Effet Accordéon en CSS Pure

Il s’agit d’un bloc type accordéon fait uniquement en CSS avec un effet de mouvement grâce aux icônes qui suivent le mouvement de l’accordéon au moment de l’ouverture d’un élément. C’est très bien fait.

See the Pen Funky Pure CSS Accordion by Jamie Coulter (@jcoulterdesign) on CodePen.

On peut imaginer adapter ce bout de code pour afficher un agenda d’événement pour un centre culturel ou autre.

2. SQL.sh la bible SQL en ligne

Ce n’est pas une seule ressource à proprement parlé que je vous propose là mais un site Web Complet. Le site sql.sh propose une documentation très exhaustive du langage SQL avec certains cas pratique.

Lorsque je cherche une solution en SQL je me tourne assez souvent vers ce site qui me permet de trouver une piste pour résoudre mon problème. Dernièrement je suis tombé sur cette page qui liste les différentes types de jointures possible en SQL, je me suis rendu compte que je ne connaissais l’existence de même pas la moitié des jointures existantes.

3. Feature.js un outil de détection de fonctionnalités

C’est une librairie très light (1 Kb) qui permet de savoir si le navigateur propose telle ou telle fonctionnalité.

Voici la liste des fonctionnalités qui peuvent être testées :

  • AddEventListener
  • Async attribute
  • Canvas
  • ClassList API
  • CORS API
  • Context Menu
  • CSS 3D transform
  • CSS transform
  • CSS transition
  • Defer attribute
  • DeviceOrientation
  • DeviceMotion
  • Geolocation
  • History API
  • Input Placeholder
  • LocalStorage
  • MatchMedia
  • Picture element
  • QuerySelectorAll
  • REM Units
  • Service Worker
  • Sizes attribute
  • Srcset attribute
  • SVG
  • Touch
  • Viewport Units
  • WebGL

C’est très léger et très facile à utiliser :

 if (feature.webGL) {
 console.log("WebGL supported");
 } else {
 console.log("WebGL not supported");
 }

Pour en savoir plus, rendez-vous sur le site de Feature.js.