L’objectif de ce projet
Pratiquer JavaScript:
- function
- array
- for loop
- copy to clipboard toggle
Temps de réalisation
version de base – 5H | version complète – 10H
Difficultés
Pas de difficulté pour la version de base.
Pour la version complète:
- HTML à modifier – pour inclure ou exclure les symboles ou chiffres, également des buttons pour copier les mots de pass générés.
- CSS – création de toggles à partir de checkbox.
- JavaScript – pas de connaissance sur copy-to-clipboard. Malgré la solution trouvé sur W3C, elle ne fonctionne pas initallement.
Solutions
- HTML
- deux checkbox & button à copier ajouté.
- CSS
- solution trouvé grâce à W3C – Toggle Switch.
- ajout media pour les écrans verticaux.
- JavaScript
- copy-to-clipboard – cette solution implique de changer l’affichage de mots de passe générés en <textarea> au lieu d’un <div>.
- pour inclure ou exclure les symboles et/ou numéros, j’ai séparé l’array de base.
Résumé
- Une itération sur cette application: il y a des modifications sur les codes existants en version de base pour intégrer des nouvelles demandes.
- Il est important d’utiliser console.log() en codant pour comprendre les blocages.
- JS est effectué de haut vers le bas : initialiser la situation dès le départ.
See the Pen Random Password Generator with copy-on click and number/symbols on/off by huan (@kidztse) on CodePen.
Version complète de générateur
See the Pen Random Password Generator by huan (@kidztse) on CodePen.
Version de base
