- 64
- 416 040
SwebDev
France
เข้าร่วมเมื่อ 30 มี.ค. 2017
Je m'appelle Sébastien, je suis développeur front-end.
Voila.
Voila.
Bien débuter avec Canvas - Partie 1
🔥 S'ABONNER À LA CHAÎNE 🔥
►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html
🔥 POUR ME SUIVRE 🔥
► RatonCodeur
Salut !
Dans cette première vidéo de la série "Bien débuter avec Canvas", je te propose d'apprendre à créer ce qui pourrait être le début d'un jeu en 2D.
Pour cela, nous allons créer une forme carré, et l'animer pour la faire tomber vers le bas du canvas.
Dans cette vidéo, tu apprendras à :
- sélectionner le canvas et lui donner la largeur et la hauteur du viewport
- dessiner une forme carré dans canvas
- l'animer pour la faire "tomber" en simulant la gravité
- détecter lorsque le carré arrive en bas du canvas pour stopper sa chute
La vidéo du TH-camr ChrisCourses : th-cam.com/video/4q2vvZn5aoo/w-d-xo.html
►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html
🔥 POUR ME SUIVRE 🔥
► RatonCodeur
Salut !
Dans cette première vidéo de la série "Bien débuter avec Canvas", je te propose d'apprendre à créer ce qui pourrait être le début d'un jeu en 2D.
Pour cela, nous allons créer une forme carré, et l'animer pour la faire tomber vers le bas du canvas.
Dans cette vidéo, tu apprendras à :
- sélectionner le canvas et lui donner la largeur et la hauteur du viewport
- dessiner une forme carré dans canvas
- l'animer pour la faire "tomber" en simulant la gravité
- détecter lorsque le carré arrive en bas du canvas pour stopper sa chute
La vidéo du TH-camr ChrisCourses : th-cam.com/video/4q2vvZn5aoo/w-d-xo.html
มุมมอง: 1 037
วีดีโอ
Apprendre Flexbox en 25 minutes
มุมมอง 16K2 ปีที่แล้ว
🔥 L'inscription à mon cours complet sur Flexbox : www.swebdev.fr/cours/apprendre-flexbox 🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur Salut ! Apprendre Flexbox en 25 minutes ? C'est possible !
Débuter avec CSS Grid - Partie 5
มุมมอง 2K2 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur 🔥 LA PLAYLIST 🔥 ► th-cam.com/play/PLdlcrLtifCUnPYvGdOqi5-Pl3hG7lIkKn.html Salut ! Cette vidéo fait partie de la série "Débuter avec CSS Grid". Un guide pour les débutants qui souhaitent s'initier à CSS Grid en ma compagnie. Le but est d'explorer CSS Grid pas à pas pour bien co...
Débuter avec CSS Grid - Partie 4
มุมมอง 1.5K2 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur 🔥 LA PLAYLIST 🔥 ► th-cam.com/play/PLdlcrLtifCUnPYvGdOqi5-Pl3hG7lIkKn.html Salut ! Cette vidéo fait partie de la série "Débuter avec CSS Grid". Un guide pour les débutants qui souhaitent s'initier à CSS Grid en ma compagnie. Le but est d'explorer CSS Grid pas à pas pour bien co...
Débuter avec CSS Grid - Partie 3
มุมมอง 1.9K2 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur 🔥 LA PLAYLIST 🔥 ► th-cam.com/play/PLdlcrLtifCUnPYvGdOqi5-Pl3hG7lIkKn.html Salut ! Cette vidéo fait partie de la série "Débuter avec CSS Grid". Un guide pour les débutants qui souhaitent s'initier à CSS Grid en ma compagnie. Le but est d'explorer CSS Grid pas à pas pour bien co...
Débuter avec CSS Grid - Partie 2
มุมมอง 2.4K2 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur 🔥 LA PLAYLIST 🔥 ► th-cam.com/play/PLdlcrLtifCUnPYvGdOqi5-Pl3hG7lIkKn.html Salut ! Cette vidéo fait partie de la série "Débuter avec CSS Grid". Un guide pour les débutants qui souhaitent s'initier à CSS Grid en ma compagnie. Le but est d'explorer CSS Grid pas à pas pour bien co...
Débuter avec CSS Grid - Partie 1
มุมมอง 8K2 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur 🔥 LA PLAYLIST 🔥 ► th-cam.com/play/PLdlcrLtifCUnPYvGdOqi5-Pl3hG7lIkKn.html Salut ! Cette vidéo fait partie de la série "Débuter avec CSS Grid". Un guide pour les débutants qui souhaitent s'initier à CSS Grid en ma compagnie. Le but est d'explorer CSS Grid pas à pas pour bien co...
Créer des carrés responsive en CSS
มุมมอง 2K3 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur Dans cette vidéo, je te montre comment créer des carrés responsive en CSS !
5 manières de centrer en CSS
มุมมอง 3.5K3 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur Dans cette vidéo, je te montre 5 manières de centrer un élément en CSS que j'utilise tous les jours !
Smooth scrolling avec Jump.js
มุมมอง 1.7K4 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur
Découverte de Bootstrap 5
มุมมอง 11K4 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur Le nouveau site de Bootstrap: v5.getbootstrap.com/ L'article qui annonce la sortie de Bootstrap 5: blog.getbootstrap.com/2020/06/16/bootstrap-5-alpha/
Bootstrap 4 - Installation et personnalisation
มุมมอง 2K4 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur
Bootstrap 4 - Comprendre la grille
มุมมอง 9K4 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur Dans cette vidéo, je te montre comment fonctionne la grille de Bootstrap 4.
Tailwind CSS - Intégration responsive mobile-first
มุมมอง 1.4K5 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur
Tailwind CSS - Découverte et installation avec Gulp
มุมมอง 2.6K5 ปีที่แล้ว
🔥 S'ABONNER À LA CHAÎNE 🔥 ►th-cam.com/channels/18RbwcHN3cP8Q-K53PF-JQ.html 🔥 POUR ME SUIVRE 🔥 ► RatonCodeur
Comprendre la méthode map() en JavaScript
มุมมอง 8K5 ปีที่แล้ว
Comprendre la méthode map() en JavaScript
Snippets personnalisés avec Visual Studio Code
มุมมอง 2.5K5 ปีที่แล้ว
Snippets personnalisés avec Visual Studio Code
Comprendre la méthode filter() en JavaScript
มุมมอง 5K5 ปีที่แล้ว
Comprendre la méthode filter() en JavaScript
Compiler des fichiers Sass avec Node-Sass
มุมมอง 1.5K5 ปีที่แล้ว
Compiler des fichiers Sass avec Node-Sass
Exercice JavaScript - Vérifier la fin d'une chaîne de caractères
มุมมอง 2.1K6 ปีที่แล้ว
Exercice JavaScript - Vérifier la fin d'une chaîne de caractères
Créer des effets de hover sur des ghost buttons en CSS
มุมมอง 2.6K6 ปีที่แล้ว
Créer des effets de hover sur des ghost buttons en CSS
merci enormement
23:00 je crois que tu as oublié de préciser que la dimension est augmentée et que c'est visible sur la div quand on survole le code : il y a un rectangle hachuré pour la div avec à sa droite une flèche qui indique le changement de largeur (sur la div verte) et le sens de la flèche indique si la largeur a été augmentée ou diminuée, sinon c'est vraiment très bien
Juste,MERCI
Grid à ne pas confondre avec Greed. Je sors ➡
Merci beaucoup pour cette vidéo, je débute et avait du al à bien comprendre comme agencer mes éléments avec flexion et ta vidéo m'aide beaucoup. Merci beaucoup
Super tuto, merci à toi. En plus en français!
🙂
Top ta vidéo! Claire et précise 🤗
Je te keff, car les séries d’exercices et les explications des méthodes jusqu’à l’utilisation, m’ont bcp aider ❤
top la video
Bon sang ! j'ai ENFIN pigé les notions d'absolute et relative ! Champagne !
j'adore votre explication simple !
merci pour l aide
bravo pour ta pédagogie
votre vidéo est vraiment très claire et avec une voie confortable douce vraiment votre vidéo est fluides simple et précis. je voudrais savoir si tu pourrais faire une autre vidéo baser sur la aperçu d'un montant œil croiser et ferme pour affiché le sole comment ce la se faire mes a la prochaine Jai pris mon tabouret j'attent votre vidé sympas qui arrive encore Merci
Le titre dit « 25min » et la vidéo sur « 27min »
Tu veux que je te rembourse ?
@@ratoncodeur remboursé!!!
Merci !!
Super !
Chapeau ! Tu es vraiment doué pour expliquer des trucs. J'aime regarder ce genre de vidéos fluides et compréhensibles pour à peu près tous les niveaux.
Merci ! On espère le retour des vidéos. Tu es un excellent pédagogue.
Superbe cours sur canvas !
Bravo..Clair et efficace.Merci !
ça parait tellement simple 😭 Je galère tellement avec l'algo...
bonjour , je rencontre un soucis lors du lancement de la tache gulp sass a la 9eme minute. J' ai suivi a la lettre tes explications tout s'est passé correctement sauf cette derniere commande qui me donne en erreur " gulp : Le terme «gulp» n'est pas reconnu comme nom d'applet de commande, fonction, fichier de script ou programme exécutable. Vérifiez l'orthographe du nom, ou si un chemin d'accès existe, vérifiez que le chemin d'accès est correct et réessayez. Au caractère Ligne:1 : 1 + gulp sass + ~~~~ + CategoryInfo : ObjectNotFound: (gulp:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException " aurais tu une solution a me proposer ? Merci. Sinon je trouve tes videos tres clair et pour apprendre c'est que du bon
wow belle explication super Merci
Merci pour votre cours, mais pourquoi est-on obligé de mettre de suite un élément parent en position relative pour utiliser la position absolute ?
super vidéo bien utile merci
Juste parfait, comme d'habitude tellement clair & simplement expliqué 🎉 Merci pour ton partage de connaissances 👍
Un pouce rien que pour la définition comme a l'école.
Bonjour. En gros, align-items permet l'alignement sur x lorsqu'on est en colonne et sur y lorsqu'on est en row. C'est un peu l'inverse de justify-content. Autre question, "display: grid" faut-il encore l'utiliser pour du responsive ? Comment peut-on faire pour centrer un container (et tous ses enfants) sur un body au dimension définie ? Les marges et padding s’additionnent dans les calculs ? J'ai vu une astuce pour éviter les dépassements en utilisant un overflow:hidden je ne me souviens plus bien de la marche à suivre... Peux-tu nous la rappeler ? Et pour les éléments qui suivent le container (en dehors du div du flex) ils se mettent à-côté ou à la ligne ? Pour les dimensions des containers, est-ce mieux d'utiliser du rem, du px, du % ? Un container flex peut-il contenir un autre container flex ? Ce truc, ça me fait penser à du tetris... 😵💫 PS: Désolé pour toutes les questions mais je profite de votre expérience. 😄
wow merci beaucoup
Good
est ce que je peut avoir les photos (images) svp et merci .
{ splitStr=str.split(' '); array=[] let lWord; let max=[]; for(let i=0;i<splitStr.length;i++) { array.push(splitStr[i].length) } lWord=Math.max(...array) for(let i=0;i<splitStr.length;i++) { if(lWord===splitStr[i].length) max.push(splitStr[i]) } return max } console.log(longestWord(`with consistanty (is so important) i will be one of the best devloper`)) console.log(longestWord(`I woke up early today `))
Merci beaucoup ! Grâce à vous, Flexbox et Grid css ne sont plus un secret pour moi.
Merci pour les astuces :) reste a les appliqués
Un cours très clair, démonstratif et donc très efficace ! Merci !
Grâce à vous , j'ai appris Flexbox , Grid Css et Box-sizing. Merci beaucoup !
J'ai adoré !!
function go(str,l){ var p = str.split('').reverse(); if(p[0]==l.toLowerCase()){ document.write("true") }else{document.write("false")} }
Vraiment très clair, très détaillé et bien expliqué. Bravo, bon travail! (..et merci 😄)
Bon ben j'suis vraiment à la bourre de ... 5 ans. Ceci dit excellente approche en vanilla. Du coup je vais voir si tu as poursuivi sur le sujet. Ciao et merci !
claire nette et précis, j'adore.
Salut, je commence le dev web et tu fais partie de mon top 3 vidéo tuto ☺️. Vraiment pédagogique tes vidéos. Bon je sais que la vidéo à plus de 1 an mais je tente qd même ma question. Pourquoi ne pas rajouter 2 x 100px à grid-temple-rows (pour avoir nos 3 lignes explicites) plutôt que d'ajouter 2 x 100px à une nouvelle ligne comme grid-auto-rows ?? J'espère que je me fais bien comprendre 😅
je dois être la seule à ne pas comprendre un des premiers points (en même temps je débute ^^), pourtant ta vidéo a l'air hyper claire ! J'ai l'impression que le display : flex apparait dans le html, pourtant dans la formation que je suis on ne l'applique que dans le CSS... si tu peux m'éclairer ce serait top :)
Bon exercice, mais à quoi cela sert il concrètement de savoir faire ça ?
à connaitre en pratiquant les différentes méthodes de javascript qui sont pas forcement assimilable juste en un coup d'oeil
bon je ne pratique plus depuis un moment. Et la refonte prochaine d'une applis m'oblige à me ressourcer. J'ai arrêter vers l'installation de manière durable de FlexBox. Ton explication est très didactique et ramené à ton expérience, tes incompris du moment est un plus. je ne voyais pas ce qui clochais maintenant c'est plus claire pour moi. Merci du partage.
Salut moi j'aimerais savoir ou trouver les images pour faire du parallaxe surtout les illustrations
Super tuto ! J'ai enfin compris la notion de block et ses conséquences en terme de positionnement.
pendant l'exercice j'ai aussi pris en compte les phrase en retirant les espaces avec .replaceAll(), comme ça une phrase comme "Karine alla en Irak" est compris dans les palindromes