Javascript Moderne : Ajouter une version Dark Mode d'un site
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00
Sous-titres non disponibles

TUTO Javascript Moderne : Ajouter une version Dark Mode d'un site

Carl Brison
20,99€
Acheter maintenant, payer plus tard. En savoir plus

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Dans ce tuto vidéo dédié à la pratique du JavaScript moderne, nous allons apprendre à réaliser un mode sombre (Dark Mode) pour vos pages web.
Le mode sombre est utilisé pour améliorer l'expérience utilisateur. Notamment pour baisser la fatigue visuelle dans certaines conditions d'éclairage et même de limiter la consommation en énergie de son écran.

Au programme de ce tuto "mode sombre" grâce au Javascript Moderne

Voici les compétences abordées dans ce cours en ligne :

  • création d'une version claire (Light Mode),
  • création d'une version sombre (Dark Mode),
  • mise en place d'un bouton à bascule (Switch) pour passer d'un mode à l'autre,
  • mémorisation du choix de l'utilisateur pour conserver son choix sur les pages du site et pendant d'autres sessions de navigation (utilisation du storageLocal ou d'un cookie).

À la fin de ce cours, vous serez autonome pour ajouter un thème Dark Mode sur vos sites Internet.

Un QCM vous sera proposé en fin de formation et vous permettra de valider les connaissances théoriques acquises pendant la formation.
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur ce cours.

Pour suivre cette formation dans de bonnes conditions, il est recommandé de connaître :

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Mise en page du site web
Leçon 2
Mise en place du détail des zones
Leçon 3
Mise en place d'un switch
Leçon 4
Mise en forme du switch
Leçon 5
Finalisation du switch
Leçon 6
On passe du sombre au clair et vis et versa
Leçon 7
On ajoute des pages à notre site

Plan détaillé du cours

Leçon 1Mise en page du site web
12m01
Leçon 2Mise en place du détail des zones
14m51
Leçon 3Mise en place d'un switch
05m09
Leçon 4Mise en forme du switch
11m36
Leçon 5Finalisation du switch
05m56
Leçon 6On passe du sombre au clair et vis et versa
13m08
Leçon 7On ajoute des pages à notre site
03m15
Leçon 8On met en place la mémoire du storageLocal
09m19
Leçon 9On utilise la mémoire du storageLocal
07m05
Leçon 10On met en place les cookies
06m36
Leçon 11Conclusion
02m10

Aperçus

Avis des apprenants

Détail des avis
22
Apprenants
2
Commentaires
5/5
Note moyenne
5/5
2
4/5
0
3/5
0
2/5
0
1/5
0
Valérie Arno
Valérie Arno
Publié le 06/02/2024
C'est vraiment chouette de pouvoir modifier ainsi l'affichage du site en le faisant basculer du mode jour au mode nuit :-) Je me suis toujours demandée comment on pouvait faire ça quand je le voyais sur les sites web. Maintenant je sais. Merci Carl pour cette grande nouveauté. C'est quand même bien javaScript quand on sait l'utiliser. ;-)
Carl Brison
Carl Brison
Absolument ! Oui JavaScript est super bien pour rendre nos pages web plus vivantes et plus dynamiques, avec très peu de savoir. Merci beaucoup pour votre commentaire très gentil et je suis ravi de vous relire ;-)
Jean-Claude Warg-Briers
Jean-Claude Warg-Briers
Publié le 01/11/2023
Super tuto, très complet , bien expliqué . Didier
Carl Brison
Carl Brison
Merci beaucoup Didier ;-)

Vos questions sur le cours

Avec quelle version de logiciel ce tuto est-il compatible ?

CSS 3

Que contient le fichier source ?

Le code complet de l'exercice

Quel est le niveau requis pour suivre ce tuto ?

débutant

Payer plus tard

Prix d'achat : 20,00 €
Pour payer plus tard, sélectionnez Klarna comme moyen de paiement lors du règlement.

Ajoutez des articles à votre panier

Sélectionnez Klarna lors du règlement

Recevez une autorisation

Payez dans 30 jours

Klarna : conditions d'utilisation du paiement différé.

Attendez ! 🤗

Accédez à plus de 1424 tutos gratuits

Notre politique de protection des données