Catégories
Astuces et Design

Créer une application météo en ligne de commande à Deno

Si vous avez suivi nos articles d’introduction sur Deno, vous êtes probablement intéressé par la rédaction de votre premier programme. Dans cet article, nous allons passer en revue l'installation du runtime Deno et la création d'un programme météo en ligne de commande qui prendra un nom de ville comme argument et renverra les prévisions météo […]

Catégories
Astuces et Design

18 dispositions de grille pour créer de superbes sites Web

Lors de la création d'un nouveau site Web, il est toujours judicieux de s'asseoir et de réfléchir à tout le contenu que vous souhaitez vraiment présenter. Si vous trouvez que vous avez beaucoup à dire, les dispositions de grille sont toujours un bon choix. Pour commencer, la plupart sont réactifs et ajusteront automatiquement l'orientation en […]

Catégories
Astuces et Design

Créer une application météo pour terminal à Deno

Si vous avez suivi nos articles d’introduction sur Deno, vous êtes probablement intéressé par la rédaction de votre premier programme. Dans cet article, nous allons passer en revue l'installation du runtime Deno et la création d'un programme météo en ligne de commande qui prendra un nom de ville comme argument et renverra les prévisions météo […]

Catégories
Astuces et Design

Comment créer une Porsche 911 avec croquis (partie 3) – Smashing Magazine

A propos de l'auteur Concepteur visuel et UI / UX, auteur de dizaines de didacticiels Adobe Photoshop et Sketch. Accro à l'espresso. Regardez passionné. Plus à propos Nikola Lazarević … Il s’agit de la troisième et dernière partie du didacticiel dans laquelle nous allons créer les roues (jantes et pneus) et ajouter toutes les touches […]

Catégories
Astuces et Design

Créer un carrousel à l'aide de CSS Scroll Snap et JavaScript

Ce didacticiel vous aidera à créer un carrousel réactif en utilisant la propriété CSS scroll-snap et très peu de JavaScript pour la navigation. Vous pouvez l'utiliser pour l'affichage de produits, ou comme galerie, ou pour vos témoignages – comme l'exemple de ce tutoriel. Voici donc ce que nous allons créer: Il ne s'agit en réalité […]

Catégories
Astuces et Design

Créer un blog statique avec Sapper et Strapi – Smashing Magazine

A propos de l'auteur Daniel Madalitso Phiri est un développeur, écrivain, constructeur de choses loufoques, DJ, Lorde superfan et Community Builder de Lusaka, en Zambie. Plus à propos Daniel … Cet article vous explique comment créer un blog statique alimenté par Svelte avec Sapper et Strapi, ainsi que comment déployer le site Web sur Netlify. […]

Catégories
Astuces et Design

Les 10 meilleurs ensembles d'actions Photoshop pour créer l'effet Bokeh

L'effet bokeh a une multitude d'utilisations dans l'art numérique. Il peut être surutilisé, bien sûr. Mais cela peut aussi être tout simplement magnifique. Essayer de recréer ce look par vous-même serait une tâche fastidieuse. Dieu merci pour les actions de Photoshop, non? Vous trouverez ici un ensemble fantastique d’actions Photoshop qui simplifient considérablement le processus […]

Catégories
Astuces et Design

Comment créer une Porsche 911 avec croquis (partie 2) – Smashing Magazine

A propos de l'auteur Concepteur visuel et UI / UX, auteur de dizaines de didacticiels Adobe Photoshop et Sketch. Accro à l'espresso. Regardez passionné. Plus à propos Nikola Lazarević … Dans la partie 1 de ce didacticiel, Nikola Lazarević a expliqué comment créer et modifier la carrosserie d'une voiture dans Sketch, y compris les feux […]

Catégories
Astuces et Design

Comment créer une Porsche 911 avec croquis (partie 1) – Smashing Magazine

A propos de l'auteur Concepteur visuel et UI / UX, auteur de dizaines de didacticiels Adobe Photoshop et Sketch. Accro à l'espresso. Regardez passionné. Plus à propos Nikola Lazarević … Ce tutoriel s'adresse aux illustrateurs qui sont également des passionnés d'automobile. Si vous suivez, vous apprendrez à dessiner à partir de zéro dans Sketch la […]

Catégories
Astuces et Design

Comment créer une chronologie réactive avec des miniatures d'image

Dans ce didacticiel, vous apprendrez à créer une chronologie réactive pour un ensemble d'événements connexes que vous souhaitez afficher dans une séquence chronologique (ou chronologique inverse). Cela peut être utilisé pour afficher des étapes importantes de l'entreprise, des nouvelles ou des événements personnels. j'ai utilisé événements de voyage personnels à titre d'exemple dans ce post. […]

Catégories
Astuces et Design

Créer des applications de bureau avec Electron et Vue – Smashing Magazine

A propos de l'auteur Développeur front-end basé à Lagos, au Nigeria. Il aime convertir les conceptions en code et créer des éléments pour le Web. Plus à propos Timi … Electron est un framework logiciel open source développé et maintenu par GitHub. Il permet le développement d'applications GUI de bureau à l'aide des technologies Web. […]

Catégories
Astuces et Design

Comment créer un calendrier mensuel avec des données réelles

Avez-vous déjà vu un calendrier sur une page Web et pensé, comment diable ont-ils fait ça? Pour quelque chose comme ça, il peut être naturel de chercher un plugin, ou même un calendrier Google intégré, mais c'est en fait beaucoup plus simple d'en créer un que vous ne le pensez et ne nécessite que le […]

Catégories
Astuces et Design

Créer un site Gatsby avec des données WordPress

Dans mon article précédent la semaine dernière, j'ai mentionné la création d'un site WordPress-Gatsby partiellement porté. Cet article est une suite avec une procédure pas à pas sous le capot. Gatsby, un framework basé sur React pour les sites statiques, attire l'attention non seulement des développeurs JavaScript, mais également des développeurs et des utilisateurs de […]

Catégories
Astuces et Design

Comment créer une application frontale accessible avec Chakra UI et Nuxt.js – Smashing Magazine

A propos de l'auteur Kelvin Omereshone est le directeur technique de Quru Lab. Kelvin était auparavant ingénieur front-end chez myPadi.ng. Il est le créateur de la communauté Nuxtjs Africa et très passionné… Plus à propos Kelvin … Dans cet article, nous allons examiner comment utiliser Chakra UI et NuxtJS pour créer des applications frontales accessibles. […]

Catégories
Astuces et Design

Comment créer une carte de conférence animée à l'aide de CSS

Dans ce didacticiel, vous apprendrez à créer des cartes postales de blog qui basculent en survolant, révélant l'extrait de message au dos de la carte. Nous obtiendrons cet effet en utilisant CSS. Le résultat final est réactif, faisant basculer la carte au clic, sur les appareils mobiles. Ce GIF montre ce que vous pourrez créer […]

Catégories
Astuces et Design

Comment créer un crochet React personnalisé pour récupérer et mettre en cache des données – Smashing Magazine

A propos de l'auteur Ingénieur front-end passionné de performances et de technologies de pointe. Plus à propos Ademola … Il est fort probable que de nombreux composants de votre application React devront appeler une API pour récupérer des données qui seront affichées pour vos utilisateurs. Il est déjà possible de le faire en utilisant le […]

Catégories
Astuces et Design

Comment créer un composant de liste avec Emotion

J'ai fait un peu de refactoring cette semaine chez Sentry et j'ai remarqué que nous n'avions pas de composant de liste générique que nous pouvions utiliser entre les projets et les fonctionnalités. Donc, j'en ai commencé une, mais voici le hic: nous stylisons les choses chez Sentry en utilisant Emotion, avec laquelle je n'ai qu'une […]

Catégories
Astuces et Design

Créer un effet de défilement de parallaxe simple dans la section des héros à l'aide de CSS pur

Dans ce didacticiel, vous apprendrez à créer un simple effet de défilement de parallaxe CSS pur dans la section des héros de votre page de destination. Le défilement de parallaxe est un effet où différents éléments visuels sur la page se déplacent à différentes vitesses lorsque l'utilisateur fait défiler. Cela crée un effet 3D ajoutant […]

Catégories
Astuces et Design

Comment créer une navigation déroulante réactive en utilisant uniquement CSS

Ce didacticiel vous guidera dans la création d'une navigation déroulante réactive en utilisant uniquement CSS, à l'aide de CSS flexbox et du «checkbox hack». Des connaissances de base en HTML et CSS sont nécessaires pour suivre. La barre de navigation supérieure est vitale pour tout site Web. La plupart des sites ont une structure similaire […]

Catégories
Astuces et Design

Polices de mariage pour créer de superbes documents imprimés pour la fête

Un mariage est probablement l'un des moments les plus importants d'un couple et la gestion de tous les aspects peut être difficile et épuisante à la fois. Si vous avez réservé un certain endroit, trouvé les moments artistiques clés que vous souhaitez vivre et la prochaine chose que vous devez faire est de concevoir la […]