Les Ressources du Web #28

Mon temps de veille était assez réduit ces dernières semaines, mais voici malgré tout une sélection d’articles, astuces et ressources, avec pas mal de JS pour enrichir vous sites web ou web app, quelques effets sympa en CSS et une flopée d’outils, ressources et liens d’inspirations pour vous accompagner dans vos créations graphiques.

S’il fallait n’en retenir qu’un

Cette fois je retiendrais de ma sélection ce premier article d’une série de 3 (déjà publiés) pour vous accompagner dans la construction d’une progressive web app.

Vous évoluerez au fil de l’article dans un univers utilisant les outils Gulp, Handlebars, SASS et Babel afin de construire une web app proposant du « offline first » et des fonctionnalités simples afin de plonger dans ce monde entre deux eaux.

Place à la sélection.

JavaScript

• Odoo.js – Un odomètre animé et fluide en SVG avec effet de flou de mouvement.
• Grade.JS – Un effet de dégradé reprenant 2 couleurs dominantes d’une photo.
• Working With Battery API – Un article sur l’utilisation de la Battery API.
• Rotating elements using mouse and touch position – Un article proposant un script pour faire tourner un élément suivant la position de la souris ou du doigt.
• Lory – un script de slideshow évolutif et responsive.
• Page Accelerator – accélérez le chargement de vos pages web grâce à ce script.
• Reframe.js – rendez les éléments non-responsives responsives, simplement.
• currencyFormatter – un script pour formater des valeurs monétaires en multilingue.
• JavaScript ES6 features – un tour d’horizon de l’évolution de JS et de ES6 plus particulièrement.
• Build a Progressive Web App – une série de 3 articles sur le développement d’une progressive web app.
• 8 JavaScript Librairies for Map Visualizations – une sélection de scripts pour créer des maps interactives.

WordPress

• Slate Admin Theme – un thème WordPress repensé et allégé visuellement pour votre admin
• WooCommerce Connect – un plugin pour se connecter aux services de WooCommerce. (Shipping Rate & Labels pour le moment, en pleine évolution)
• MailPoet 3 Beta – la version 3 du célèbre MailPoet est en beta depuis fin octobre.

CSS & Animations

• Flexible Typography with CSS Locks – Une idée d’implémentation de taille de texte et hauteur de ligne en fonction de l’écran de consultation.
• CSS Glitch Effect – un tutoriel pour créer un effet « Glitch » en CSS.
• SVG Line Animation – une initiation à l’animation de vecteur (SVG + CSS) à lire absolument.
• Explained CSS Pseudo classes – une explication des pseudo classes avec plein d’images.
• How To build a Responsive Grid System – la construction d’une grille responsive en détail.

Outils, Inspiration & Ressources graphiques

• Vectr – un éditeur de fichiers vectoriel en ligne et téléchargeable gratuit et intuitif.
• Origami Studio – l’outil pour vos prototypes (interactivité et animation au rendez-vous)
• Thimble – un éditeur HTML libre de Mozilla pour aider à l’enseignement.
• 20 Mouse Effects – une liste de 20 idées d’effet aux mouvements de la souris. (et leur code)
• Traveler Font – une « Western Typeface » plutôt stylée.
• 15 Inspirational UI – des interfaces pour votre inspiration à télécharger gratuitement
• 36 Space Icons – des icônes « outline » sur le sujet de l’espace à télécharger gratuitement
• DevFreeBooks – des livres gratuits sur le sujet du développement Web. (n’oubliez pas de donner ;p)
• Hamburger Menu Alternative – des menus mobiles alternatifs aux « burger » menu.

Et vous vous avez remarqué quoi de beau sur la toile ces derniers temps ?
Bonne exploration !