TUTORIEL : CREER UNE HORLOGE NUMERIQUE - HTML, CSS & Javascript

TUTORIEL : CREER UNE HORLOGE NUMERIQUE - HTML, CSS & Javascript - Wikodemedias - Abonne-toi ;) ///// Navigation : 0:13 Présentation 0:26 Code HTML 1:27 Code CSS 4:54 Code Javascript 10:07 Visualisation du projet final Le code source est disponible sur Github juste ici : https://github.com/wikode/horloge-javascript ///// Description : Hello tout le monde ! Dans ce TUTO, nous allons créer étape par étape une horloge numérique au design moderne. On commence par créer une structure HTML très simple avec un élément destiné à contenir l'heure, et un élément destiné à contenir la date. La partie CSS est bien sûr entièrement customisable selon vos goûts. J'ai choisi un style plutôt épuré, simple et moderne pour ce tuto. Pour la partie Javascript, c'est tout le côté dynamique qui est géré : - Récupérer la date (date complète récupérée sur votre ordinateur) et la stocker dans une nouvelle variable : var today = new Date(); - De cette date, on en tire chaque élément. J'ai décidé de tirer tout ce qui était possible : heure, minutes, secondes, jour, mois, année ... Dans le but de vous montrer toutes les méthodes associées et comment le faire concrètement ! - Associer les données à des mots : avec les méthodes utilisées, le jour de la semaine et le mois de l'année sont retournés sous forme de numéro. Pour les transformer en mot (Lundi, Mardi ... Janvier, Février ...) il est nécessaire de passer par des listes. Là encore, tout est expliqué dans le tuto ;) - Affichage dans la page web : en sélectionnant les éléments HTML dans lesquels on souhaite intégrer nos données, puis en utilisant la méthode .textContent(); Merci d'avoir regardé ! Laissez un petit pouce bleu et abonnez-vous ;) ///// Ressources : Logiciel de codage : Visual studio code Images libres de droits : Pixabay.com ///// Musiques : "Blue Boi - LAKEY INSPIRED" https://www.youtube.com/watch?v=wAukvwLCVbM "Good Morning - LAKEY INSPIRED" https://www.youtube.com/watch?v=7VgI8dMIm0g "Overjoyed - LAKEY INSPIRED" https://www.youtube.com/watch?v=9S4RCAbebxA "Better Days - LAKEY INSPIRED" https://www.youtube.com/watch?v=RXLzvo6kvVQ Retrouvez LAKEY INSPIRED sur : » Spotify: https://goo.gl/aLkwM5 » SoundCloud: https://soundcloud.com/lakeyinspired » Instagram: https://www.instagram.com/lakeyinspired/ » Patreon: https://www.patreon.com/lakeyinspired