- 62
- 232 566
Code Facile
Приєднався 11 січ 2020
Tutoriels de programmation web pour débutants.
HTML, CSS, Javascript, et bien plus encore.
HTML, CSS, Javascript, et bien plus encore.
Maitrisez les variables CSS en 4 minutes !
CSS EN BREF : Les variables CSS - Wikodemedias - Abonne-toi ;)
--------------------
Me retrouver ailleurs :
CodePen : codepen.io/wikode
Github : github.com/wikode
--------------------
Musique :
► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled"
• SUBSCRIBE to the Official DJ QUads UA-cam channel HERE: ua-cam.com/channels/usF.html...
• Follow Dj Quads on SoundCloud HERE: soundcloud.com/aka-dj-quads
• Follow Dj Quads on Twitter HERE: DjQuads
• Follow Dj Quads on Spotify HERE: open.spotify.com/artist/2VZrd...
• Follow Dj Quads on Instagram HERE: djquads
• Support Dj Quads on Patreon HERE: www.patreon.com/DjQuads
• Music released by: Chill Out Records goo.gl/fh3rEJ
• www.ChillOutMedia.com / www.LoFi-HipHop.com
--------------------
Me retrouver ailleurs :
CodePen : codepen.io/wikode
Github : github.com/wikode
--------------------
Musique :
► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled"
• SUBSCRIBE to the Official DJ QUads UA-cam channel HERE: ua-cam.com/channels/usF.html...
• Follow Dj Quads on SoundCloud HERE: soundcloud.com/aka-dj-quads
• Follow Dj Quads on Twitter HERE: DjQuads
• Follow Dj Quads on Spotify HERE: open.spotify.com/artist/2VZrd...
• Follow Dj Quads on Instagram HERE: djquads
• Support Dj Quads on Patreon HERE: www.patreon.com/DjQuads
• Music released by: Chill Out Records goo.gl/fh3rEJ
• www.ChillOutMedia.com / www.LoFi-HipHop.com
Переглядів: 357
Відео
Comment inclure correctement et facilement une image en HTML & CSS
Переглядів 320Рік тому
CSS EN BREF : Image dans une div en conservant ses proportions initiales - Wikodemedias - Abonne-toi ;) Me retrouver ailleurs : CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled" • SUBSCRIBE to the Official DJ QUads UA-cam channel HERE: ua-cam.com/channels/usF.html... • Follow Dj Quads on SoundCloud HERE: soundcloud....
Comprendre les ombres CSS en 4 minutes !
Переглядів 284Рік тому
CSS EN BREF : Les ombres de texte et de bloc - Wikodemedias - Abonne-toi ;) Me retrouver ailleurs : CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled" • SUBSCRIBE to the Official DJ QUads UA-cam channel HERE: ua-cam.com/channels/usF.html... • Follow Dj Quads on SoundCloud HERE: soundcloud.com/aka-dj-quads • Follow Dj...
Comment créer une grille CSS responsive en 2 minutes !
Переглядів 282Рік тому
CSS EN BREF : Grille responsive automatique - Wikodemedias - Abonne-toi ;) Me retrouver ailleurs : CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled" • SUBSCRIBE to the Official DJ QUads UA-cam channel HERE: ua-cam.com/channels/usF.html... • Follow Dj Quads on SoundCloud HERE: soundcloud.com/aka-dj-quads • Follow Dj ...
Animation CSS au survol expliqué en 2 minutes !
Переглядів 870Рік тому
CSS EN BREF : Style au survol d'un élément - Wikodemedias - Abonne-toi ;) Me retrouver ailleurs : CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled" • SUBSCRIBE to the Official DJ QUads UA-cam channel HERE: ua-cam.com/channels/usF.html... • Follow Dj Quads on SoundCloud HERE: soundcloud.com/aka-dj-quads • Follow Dj Q...
Le modèle de boite en CSS expliqué en 2 minutes !
Переглядів 449Рік тому
CSS EN BREF : Le modèle de boite - Wikodemedias - Abonne-toi ;) Me retrouver ailleurs : CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled" • SUBSCRIBE to the Official DJ QUads UA-cam channel HERE: ua-cam.com/channels/usF.html... • Follow Dj Quads on SoundCloud HERE: soundcloud.com/aka-dj-quads • Follow Dj Quads on Tw...
Centrer un élément avec Flexbox - expliqué en 2 minutes !
Переглядів 354Рік тому
CSS EN BREF : Comment centrer un élément avec Flexbox - Wikodemedias - Abonne-toi ;) Me retrouver ailleurs : CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled" • SUBSCRIBE to the Official DJ QUads UA-cam channel HERE: ua-cam.com/channels/usF.html... • Follow Dj Quads on SoundCloud HERE: soundcloud.com/aka-dj-quads • ...
TOP 10 EXTENSIONS VS CODE BOOSTER VOTRE PRODUCTIVITE
Переглядів 515Рік тому
TOP 10 EXTENSIONS VSCODE POUR BOOSTER SA PRODUCTIVITE - Wikodemedias - Abonne-toi ;) 00:16 : Live Server 01:31 : Prettier 04:05 : Git Lens & Git History 06:31 : CodeTour 09:12 : Community Material Theme & Material Icon Theme 10:38 : Color Highlight 11:12 : Error Lens 11:57 : Turbo Console Log 13:02 : TODO Tree 14:16 : Project Manager Live Server : marketplace.visualstudio.com/items?itemName=rit...
Application Météo React Tailwind API Responsive
Переглядів 1 тис.2 роки тому
TUTORIEL : APPLICATION METEO - React & Tailwind & API - Wikodemedias - Abonne-toi ;) Navigation 00:00 Présentation Projet 00:54 Initialisation 05:13 API Open-Meteo 08:04 Logique centrale 39:45 Components Today & Daily 01:04:00 Tailwind CSS Ressources Le code source sur Github : github.com/witzkvn/20221106_tailwind_react_weather_app Projet Live : 20221106-tailwind-react-weather-app.vercel.app/ C...
ANIMATION CHARGEMENT CSS
Переглядів 1,7 тис.2 роки тому
TUTORIEL : ANIMATION CHARGEMENT - HTML & CSS - Wikodemedias - Abonne-toi ;) Le code source sur Github : github.com/wikode/20220415_loader_css Ou sur CodePen : codepen.io/wikode/pen/bGamJqB . Webgradients : webgradients.com/ Me retrouver ailleurs : Instagram : wikodemedias CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Around" / "Be...
DESSINER EN CSS : LE COEUR
Переглядів 1,1 тис.2 роки тому
TUTORIEL : DESSINER UN COEUR - HTML & CSS - Wikodemedias - Abonne-toi ;) Le code source sur Github : github.com/wikode/20220409_heart_css . Clippy formes complexes en CSS : bennettfeely.com/clippy/ Training smileys : codepen.io/wikode/pen/ExVbQYx Me retrouver ailleurs : Instagram : wikodemedias CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads ...
FOOTER RESPONSIVE
Переглядів 1,7 тис.2 роки тому
TUTORIEL : CREER UN FOOTER RESPONSIVE - HTML & CSS - Wikodemedias - Abonne-toi ;) Le code source sur Github : github.com/wikode/20220402_footer_responsive Ou sur CodePen : codepen.io/wikode/pen/LYeObYY Me retrouver ailleurs : Instagram : wikodemedias CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Around" / "Best Time" / "Chilled" •...
JEU JAVASCRIPT - PIERRE FEUILLE CISEAUX
Переглядів 5 тис.2 роки тому
TUTORIEL : JEU PIERRE FEUILLE CISEAUX - HTML, CSS & Javascript - Wikodemedias - Abonne-toi ;) Le code source sur Github : github.com/wikode/20220316_pierre-feuille-ciseaux Ou sur CodePen : codepen.io/wikode/pen/xxpwyEg . Images : icons8.com/icon/xvKQQjh3GenR/hand-scissors icons8.com/icon/jOnqoxqYslwM/clenched-fist icons8.com/icon/Mn4k8JJ9VT6X/hand Me retrouver ailleurs : Instagram : instagram.c...
MENU DROPDOWN HTML CSS
Переглядів 8892 роки тому
TUTORIEL : CREER UN DROPDOWN - HTML & CSS - Wikodemedias - Abonne-toi ;) 0:00 HTML 4:28 CSS Le code source sur Github : github.com/wikode/20220310_dropdown Ou sur CodePen : codepen.io/wikode/pen/xxPvpbP . Ionicons : ionic.io/ionicons Me retrouver ailleurs : Instagram : wikodemedias CodePen : codepen.io/wikode Github : github.com/wikode Musique : ► Music by: Dj Quads - "Cruise Aro...
JEU JAVASCRIPT QUIZ COULEUR
Переглядів 3,3 тис.2 роки тому
TUTORIEL : CREER UN QUIZ COULEUR JAVASCRIPT - HTML, CSS & JS - Wikodemedias - Abonne-toi ;) 0:00 HTML 4:50 CSS 11:20 Javascript Le code source sur Github : github.com/wikode/20220304_jeu_js_quiz_couleur Ou sur CodePen : codepen.io/wikode/pen/abVXEWO . SVG backgrounds : www.svgbackgrounds.com/ Police google fonts : fonts.google.com/specimen/Courgette?category=Handwriting#standard-styles Page Wik...
CARTE GEOGRAPHIQUE JAVASCRIPT AVEC API LEAFLET
Переглядів 9 тис.2 роки тому
CARTE GEOGRAPHIQUE JAVASCRIPT AVEC API LEAFLET
GERER DES THEMES EN HTML, CSS et JAVASCRIPT
Переглядів 2,3 тис.2 роки тому
GERER DES THEMES EN HTML, CSS et JAVASCRIPT
C'EST QUOI UNE API ? Explication simple et exemple pratique !
Переглядів 37 тис.2 роки тому
C'EST QUOI UNE API ? Explication simple et exemple pratique !
BOUTON TOGGLE avec animation - HTML, CSS et Javascript
Переглядів 3,3 тис.2 роки тому
BOUTON TOGGLE avec animation - HTML, CSS et Javascript
CSS GRID GALERIE D'IMAGES avec popup au clic
Переглядів 6 тис.2 роки тому
CSS GRID GALERIE D'IMAGES avec popup au clic
ASTUCES VISUAL STUDIO CODE pour débutants - codez plus vite !
Переглядів 10 тис.2 роки тому
ASTUCES VISUAL STUDIO CODE pour débutants - codez plus vite !
BARRE DE NAVIGATION LATTERALE MOBILE - HTML, CSS et JAVASCRIPT
Переглядів 2,1 тис.2 роки тому
BARRE DE NAVIGATION LATTERALE MOBILE - HTML, CSS et JAVASCRIPT
TUTO : COMPTE À REBOURS EN JAVASCRIPT
Переглядів 2,7 тис.2 роки тому
TUTO : COMPTE À REBOURS EN JAVASCRIPT
TUTO : CONVERTISSEUR DE DISTANCES HTML, CSS et Javascript - Projet pour débutant
Переглядів 2,4 тис.2 роки тому
TUTO : CONVERTISSEUR DE DISTANCES HTML, CSS et Javascript - Projet pour débutant
WEBDESIGN : CREER UNE CARTE DE PROFIL en HTML et CSS
Переглядів 4,5 тис.2 роки тому
WEBDESIGN : CREER UNE CARTE DE PROFIL en HTML et CSS
TIC TAC TOE en HTML, CSS et Javascript ! Projet débutant - étape par étape
Переглядів 9 тис.2 роки тому
TIC TAC TOE en HTML, CSS et Javascript ! Projet débutant - étape par étape
TODO App pour DÉBUTANTS expliqué en détail ! HTML, CSS & JAVASCRIPT (+ Bonus CSS)
Переглядів 1,1 тис.2 роки тому
TODO App pour DÉBUTANTS expliqué en détail ! HTML, CSS & JAVASCRIPT ( Bonus CSS)
merci. la video est juste complète comme jamais
salut
Chouette! Merci beaucoup
Merci,cela m'a beaucoup aider
merci énormément pour ta vidéo parfait💯👌
Bonjour, "" const listekeycode = touches.map(touche => touche.dataset.key); """ Des que j'enregistre il me met absoluement des () autour de touche : const listekeycode = touches.map((touche) => touche.dataset.key); Ce qui me fais planter le code :/
@codefacileWK J'essaye d'integrer le grid dans mon code mais le souci est qu'en modifiant le "body" dans mon css ça fout en l'air mes autres pages ,j'ai essayé de contourner cela en créant un second css mais ça ne fait aucun effet. Commentintegrerr le grid sans que cela ne modifie les autres pages?
Je pense qu'il faut mettre un id sur la grid comme "myGrid" par exemple, et ensuite prefixer tous les selecteurs css pour la grille par #myGrid dans votre fichier css, pour ne selectionner que les éléments enfants de myGrid
@@codefacileWK de cette façon je colle le contenu du css "body" dans my "mygrid" sans impacter le "body" des autres pages. mais dans le tuto la div porte déjà l'id "grid" où j'ai raté un truc?
Je n'ai plus le code en tête mais dans tous les cas si d'autres éléments sont impactés c'est qu'il faut utiliser des selecteurs CSS plus précis pour ne cibler que les éléments souhaités
@@codefacileWK Merci pour votre aide et réactivité!!
Mon score est 100% , trop coule la vidéo merci 😍
Pouvez-vous m'envoyer les code svpl ou liens
Bonjour, le code est dispo en cliquant sur le lien Github en description de la vidéo
bonjour est-ce que vous pourriez m'aider à comprendre dans quel genre d'application est-ce que je pourrais utiliser cet API ou plus exactement d'autres API de logiciel SEO ou aussi de retouche de photos
Merci cette vidéo m'a bien aidé aujourd'hui...
J’ai tout bien fait, mais lorsque j’appuie sur un bouton, le nombre n’apparaît pas
bonjour je voudrais utiliser l'api de canva , est-ce que je pourrais te poser quelques questions à ce sujet
Bonjour j'aime beaucoup cette vidéo tu as oublié quand tu clique sur icone burger le texte et trop coller avec la Navbar. Merci d'avance de corriger ce petit problème.
super, est ce que tu pourrais encore m'expliquer des trucs en ce qui concerne les api
C'est nul.. Votre vidéo 😢ce qui est énervant ici c'est que c'est trop flou je parviens pas à voir bien vos code.. Vous êtes méchants 😠😠😠😡😡😡😡😡😡
Bonjour, la vidéo est disponible en HD. Je pense qu'il faut régler la qualité de la vidéo de votre côté dans les paramètres du lecteur de youtube et vous assurer d'avoir une bonne connexion internet pour lire ce contenu en HD
cool merci 🙃
merci beaucoup tooop!!
Merci beaucoup pour ces informations ! J'ai appris quelque chose de génial ici aujourd'hui (en plus de la PokéAPI) :)
C’était vraiment super merci beaucoup
Vraiment clair et precis dans les explications alors que c'est rare dans le milieu. Avec un exemple vraiment fun et facile a prendre en main. Merci beaucoup!
salut et merci pour ce tuto! est ce que tu sais s'il existe une api ou autre pour generer automatiquement les données d'une carte pokemon à partir d'une photo ?
Salut et merci ! Pas à ma connaissance... mais peut-être que l'api de OpenAI basée sur une IA peut faire l'affaire ! Je ne connais pas, jamais utilisé, mais à explorer !
bonjour
merci
Cool, merci !
salut ça fait plusieurs tuto que tu fais et que je suit, il y a toujours un soucis dans le html, j'ai beau reproduire moi meme ton html ça ne fonctionne jamais, le css et le js oui mais pas le html. par contre si je copie colle ton html tout fonctionne serais tu pourquoi ?
ps: merci pour t'es tuto
Hey ! C'est bizarre... ça vaut le coup de regarder dans la console (sur ton navigateur, clic droit puis inspecter, et cliquer sur l'onglet console) pour voir s'il y a des erreurs qui pourraient te débloquer... sinon, essaye de voir un comparateur de texte (ou de code si ça existe) en ligne pour comparer ton fichier et mon fichier et voir les différences qu'il pourrait y avoir !
@@codefacileWK salut, d'abord merci de t'as réponse, alors oui j'avais demandé à chatgpt de comparer nos deux html et il n'a rien trouver de significatif, donc bon je copie colle ton code html et puis voilàa XD, encore merci pour t'es tuto !!
bonjour je tiens à signaler que dans mon cas le css ne fonctionne pas correctement, toutes les icone font une colonne et ne sont pas l'une en face de l'autre
Bonjour, souvent cela peut être un problème de structure dans le html ou une typo dans le nom des classes / id qui ne correspondent pas entre le html et le css. J'espère que ça pourra vous aider !
@@codefacileWK bonjour, je vais aller regarder je te remercie pour la réponse !
Très bon exercice !
cest la meilleure video en francais. merci beaucoup...
Bonjour, je ne me souvenais plus de ce commentaire. Je voulais me lancer dans Visual studio code mais c'est trop compliqué. Je préfère en rester à Excel et VBA. Bonne continuation.
perefct !
Mais aucune erreur ne s affiche sur la console du js c est dû à quoi
Bjr j ai essayé votre code mais le compteur ne défile pas
Pas assez de pédagogie, vous ne vous mettez pas au niveau des débutants. Vous allez trop vite. Merci quand même.
Bonjour. Merci pour votre retour ! Je suis surpris de votre commentaire. Pourriez-vous m'en dire plus et me donner des exemples de ce que je pourrais améliorer ? Cela m'aiderait beaucoup ! Merci !
Est un spam jvois pas d'autres chose 💀💀@@codefacileWK
❤ j'ai aimé
j'ai rien compris mais bon ça marche, merci beaucoup😅
Merci beaucoup pour cette vidéo, elle ma beaucoup aider 👍
Merci pour ce tutoriel ! Grâce à toi, j'ai réussi à faire une belle galerie d'images !
merci mon reuf ca mas beaucuop aider
bonjour super tuto j'ai juste un soucis, le body prend toute la largeur de la page web et l'écran aussi, les touches sont bien placé mais j'ai une grosse bande à droite des touches
Bonjour, N'hésitez pas à aller voir le code source en description pour le comparer au votre et trouver les différences qui cause ce rendu
Grand merci !
j'ai refais identiquement comme tu as fait mais ca ne marche pas
Mais comment faire pour le rendre en application
je n'arrive pas à dézoomer. Que faire ?
Sur VS code, vous pouvez controler le niveau de zoom sur windows avec Ctrl+ touche + ou - du pavé numérique ! Sinon menu affichage je crois qu'il y a une option pour gérer le zoom
sa ma degouter du code 🤣 C'est hyper compliquer, je me dit que je serais jammais capable de le refaire tout seul
On a tous commencé quelque part ! Faut y aller à ton rythme, mais surtout pas te laisser impressionner 😉 avec de la patience et de la pratique tu y arriveras les yeux fermés !
@@codefacileWKoui c’est sur je pense que il faudrais que je commence par des projet plus facile merci en tout cas
@@Wwxyzz Pour te familiariser avec le javascript natif, je te conseille de faire soit une todolist soit un pierre-feuille-ciseaux ; les deux projets sont trouvables sur cette chaine. Mais ne recopie pas bètement la vidéo, regarde la entièrement pour comprendre ce qu'il fait, comment il décortique son code, et essaie de refaire la même chose chez toi mais tout seul, sans la vidéo qui tourne derrière. Beaucoup de débutants négligent la partie réflexion avant même de coder, c'est pourtant l'étape la plus importante.
@@varenberg5043merci beaucoup pour ton commentaire je vais essayer de faire ce que tu ma dit 👍👍👍
Wow Merci infiniment, j'ai beaucoup appris. LIKÉ et ABONNÉ direct ! 👍
Super merci pour tes explications ça m’a beaucoup aidé !
Merci!
Bonjour, je ne retrouve pas de liens javascript pour Leaflet sur le site stamen. Pouvez-vous m'aider s'il vous plait?
Merci, 1ere fois que je manipule une API : très utile.
Vraiment très bien tes vidéos, c'est clair, c'est pédagogique ; on apprend de nouvelles choses et de nouveaux concepts à chaque approche.