JB Lavisse
JB Lavisse
  • 5
  • 14 149
Morpion JavaScript : Coder un Jeu de Tic Tac Toe en 30 Min
Dans cette vidéo, nous allons coder ensemble un jeu de Morpion (ou Tic Tac Toe) en JavaScript en seulement 30 minutes. Tu y trouveras toutes les étapes nécessaires pour créer ton propre jeu, depuis l'initialisation du projet jusqu'à la réalisation des fonctionnalités interactives.
Cette vidéo est idéale pour ceux qui souhaitent apprendre les bases du HTML, CSS et JavaScript de manière ludique et pratique. Prêt à relever le défi ? C'est parti !
⭐ Rejoins notre communauté :
bit.ly/lvdc-discord
📄Récupère le code source:
github.com/levillageducode/defi2-tictactoe-js
👇 Retrouve-moi sur les réseaux sociaux :
www.twitch.tv/levillageducode
Переглядів: 324

Відео

Recréer l'intro de Star Wars en CSS
Переглядів 745Рік тому
Que la force du CSS soit avec toi ! Si tu cherches à recréer avec les technologies du web ce magnifique prologue qui te met dans l'ambiance avant chaque film Star Wars, tu es au bon endroit 🙂. ⭐ Rejoins la communauté pour télécharger les fichiers et le code source: bit.ly/lvdc-discord 👇 Retrouve moi sur les réseaux sociaux: Twitch: www.twitch.tv/levillageducode
Apprendre JS en codant une app de quiz #3 - Le DOM
Переглядів 2,9 тис.2 роки тому
Suite et fin de la conception de notre app de quiz! On va voir comment apporter de l'interaction dynamique directement sur le contenu de notre page, et donc repérer des clics et agir sur nos éléments HTML en conséquence ;). 00:00 Intro 02:41 Création du projet 04:57 Le DOM 07:37 Style de notre app 15:58 Récupérer un élément par son ID 21:55 Récupérer des éléments grâce aux classes 25:06 querySe...
Apprendre JS en codant une app de quiz #2 - L'Orienté Objet
Переглядів 3,1 тис.2 роки тому
En JavaScript, TOUT est potentiellement un objet. Une fois que l'on comprend vraiment ce que cette phrase implique, on débloque une réelle palette de nouvelles possibilités pour notre app de quiz ;). 00:00 Intro 03:26 Les fonctions 09:16 Les propriétés d'un objet 13:11 Créer un objet 19:08 Les méthodes d'un objet 26:10 Méthodes de valeurs primitives 36:00 .push() 43:15 Fonction constructeur 53:...
Apprendre JS en codant une app de quiz #1 - Les bases
Переглядів 7 тис.2 роки тому
Bienvenue sur la première vidéo du village du code! Tu trouveras ici la plupart des fondamentaux du JavaScript: l 'intérêt d'en faire, les variables, les conditions, les boucles, les tableaux, les fonctions.. L'objectif de cette série de 3 lives? Apprendre JS par le fun :). Et directement en pratique sur une application de quiz! 0:00 Intro 0:35 Présentation de l'app de Quiz 3:34 C'est quoi le J...

КОМЕНТАРІ

  • @MissingNo00x000
    @MissingNo00x000 5 місяців тому

    Alors vraiment, donnez à cette personne la popularité qu'elle mérite omg, tellement friendly comme pédagogie, t'es au top franchement

  • @joaninhaPB33
    @joaninhaPB33 6 місяців тому

    Merci beaucoup c'est tellement bien expliqué vivement la semaine prochaine 😊

  • @glloq8
    @glloq8 6 місяців тому

    Cool les explications !! Tu peux aussi faire un display: grid; place-items: center pour aligner tes éléments dans ta cell

    • @levillageducode
      @levillageducode 6 місяців тому

      Effectivement, tu as tout à fait raison ! C'est même plus simple d'ailleurs :) Merci ;)

  • @joaninhaPB33
    @joaninhaPB33 7 місяців тому

    Merci beaucoup 🙏🙏🙏

  • @bienvenulokonon9236
    @bienvenulokonon9236 9 місяців тому

    je viens de suivre en 2024 et je kiffe20/20

  • @joannybernardeau8691
    @joannybernardeau8691 9 місяців тому

    Je recherchais un exercice pour le fun sur star wars en guise de revision. Sincèrement tes explications sont claires, j'adore! Merci beaucoup

    • @levillageducode
      @levillageducode 6 місяців тому

      Ravi que la vidéo t'ait plu ! Merci 😊

  • @sangfroidniloi
    @sangfroidniloi 9 місяців тому

    Je ne comprenais pas pourquoi mon compteur s'incrémentait bien, c'est parce que j'avais déja fleché la fonction :D Du coup j'ai compris la différence avec les autres déclarations de fonction ! Merci pour cette vidéo ! De plus c'est rare dans les tutos javascript de voir du code bien rangé en POO et ça c'est vraiment cool !

  • @Arno13998
    @Arno13998 10 місяців тому

    Très bonne pédagogie, bravo ! En tant que novice, tes 3 vidéos m'ont appris beaucoup de chose. Ca me motive à creuser davantage de mon côté en espérant qu'il y ait une suite 😉

  • @TomCodeur
    @TomCodeur Рік тому

    J'adore !

  • @rapha_buleux7319
    @rapha_buleux7319 Рік тому

    et merci beaucoup de m'avoir fait découvrir excalidraw! je suis moi même enseignant et ça va me changer la vie (si seulement je l'avais eu pendant le confinement !!!!)

  • @rapha_buleux7319
    @rapha_buleux7319 Рік тому

    Merci beaucoup pour cette vidéo. Les explications sont trés claires et progressives. J'espère que le site sera bientôt à nouveau consultable et qu'un live twitch va popper.

  • @villeurbanne
    @villeurbanne Рік тому

    Je n’ai qu’ à te dire cheveux rasés, c’est l’équivalent de chapeau bas. Ce n’est pas du français mais c’est aussi expressif comme ton terme « continuage ». Merci en boucle à l’infini de ce partage des savoirs

  • @ladimnoob88
    @ladimnoob88 Рік тому

    incroyable ta pédagogie, je bois tes cours et c'est super simple pour ma part. t'es mon mentor 🤣

  • @MsJumars
    @MsJumars Рік тому

    Bordel l’image de couverture m’a tuée 😂

    • @levillageducode
      @levillageducode 6 місяців тому

      J'y ai mis tout mon XP d'infographiste 😋

  • @fadouaelhannachi3633
    @fadouaelhannachi3633 Рік тому

    Ce cours est tellement bien fait! Merci infiniment

  • @felixbouazza8710
    @felixbouazza8710 Рік тому

    Cette référence du joggeur me fait beaucoup pensé à un homme qui court en bonnet et survêtement fluo, ça te parle ? ahah Super vidéo, merci JB !

    • @levillageducode
      @levillageducode Рік тому

      Le bonnet, c'est obligatoire ! Sinon j'ai froid aux cheveux quand je cours!

  • @emilieclain7671
    @emilieclain7671 Рік тому

    Merci JB, trop cool ton tuto yhouhou!!! 🎉❤

  •  Рік тому

    Super! et merci, continue à nous sortir ce genre de contenu

  • @Bl4ckDrg0n
    @Bl4ckDrg0n Рік тому

    (May the 4th) be with you ;)

    • @levillageducode
      @levillageducode Рік тому

      J'avais même pas fait le rapprochement! À un jour près, c'était impecc :)

  • @alyssaaly7442
    @alyssaaly7442 Рік тому

    J'ai suivi et je suis encore tes cours en replay chez Studi, ca été pour moi une véritable découverte ,ca m'aide bcp pour avancer dans ma formation merci infiniment! Je n'ai pas encore vu ces vidéos -ci mais je suis sûre qu'elles doivent être TOP!

  •  Рік тому

    Salut Tes vidéos sont d'une utilité énorme pour quelqu'un qui débute dans le développement web comme moi. La façon dont tu as structuré ton cours et comment tu veux nous emmener à la solution finale étape par étape est tout simplement précieux. je t'en remercie, je me suis abonné à ta chaine et mis des like. En espérant que tu vas revenir avec un autre projet aussi bien expliqué

  • @inova_trading8849
    @inova_trading8849 Рік тому

    Hello salut J'aimerais avoir votre mail pour un projet.. Urgent. Merci

  • @inova_trading8849
    @inova_trading8849 Рік тому

    Hello j'aimerais avoir voitre mail pour realiser un projet très urgent svp... Merci

  • @inova_trading8849
    @inova_trading8849 Рік тому

    Hello

  • @sweetnessoflife6708
    @sweetnessoflife6708 2 роки тому

    Bonjour Jean-Baptise ! Tu m'as accompagné pour mes deux premiers blocs de Bachelor chez Studi et quel plaisir de te retrouver ici pour éclaircir et m'accompagner sur le bloc de développement. Tes vidéos sont absolument géniales !! Merci :)

  • @mayadray4629
    @mayadray4629 2 роки тому

    Bonjour quelqu'un aurait-il le code de ce tuto svp ? J'ai dû faire une erreur quelque part mais je galère à la trouver et c'est pas évident sans avoir un aperçu entier du code... (ça fait 5h que je suis sur cette vidéo)

    • @guilhem3332
      @guilhem3332 2 роки тому

      Oui pour moi aussi s'il vous plait !!🙌

  • @jeanlucpontzeele3056
    @jeanlucpontzeele3056 2 роки тому

    bonjour jean-baptiste je te suivais sur studi en début d'année en replay j'adore ta manière de concevoir l'apprentissage j'ai baissé un peu les bras, car bcp de cours chez studi qui ne vont pas a l'essentiel soit trop de blabla dans les cours de mediathèque , soit dans un live qui dure 1 h souvent on commence 10mn après, voir plus, je devais passé en janvier 2023 puis j'ai demandé a studi de repousse et pole emploi ne veut pas donc demoralisé. donc si je n'ai pas le certificat je m'en fou un peu, ancien infirmier de 57an en reconversion j'ai du aller a droite a gauche car bcp de difficulté a retenir les syntaxes encore aujourdhui durdur . j'ai vu que devait faire un pdf de quoi ?. j'ai encore du mal avec création bdd ,création api enfin un grand 😉merci pour tes cours super je comprends plus vite

  • @luciemonteiro7447
    @luciemonteiro7447 2 роки тому

    INCROYABLES tes vidéos ! Vraiment très agréables à suivre et drôle, bien pensées et présentées pour des débutants, merci beaucoup !

  • @electronpositron7005
    @electronpositron7005 2 роки тому

    Super !!!!!!!!!!!!!!!!!!

  • @kevinbourgitteau574
    @kevinbourgitteau574 2 роки тому

    La pédagogie de Mr Lavisse, toujours au top

  • @bakhcha12
    @bakhcha12 2 роки тому

    Un excellent moyen de présentation et un contenu très avancé et simplifié pour être accessible aux débutants comme moi. Merci pour la méthode merveilleuse et le style intéressant. Bonne chance.

  • @djamelbenabderrahmane7018
    @djamelbenabderrahmane7018 2 роки тому

    Cela a vraimant été une aubaine que de vous découvrir. Vous avez une pédagogie hors du commun pour nous hisser vers un niveau vraimant très appréciable. Bravo et merci.

  • @vdval
    @vdval 2 роки тому

    Bonjour, super vidéo très claire. A l'avenir je ferai attention à la console en arrivant sur un site 😉

  • @imenmiled3591
    @imenmiled3591 2 роки тому

    C'est TOP

  • @djamelbenabderrahmane7018
    @djamelbenabderrahmane7018 2 роки тому

    J'ai eu vraiment beaucoup de plaisir à suivre votre cours vraiment intelligemment présenté. Bravo et merci.

  • @PierreSchinko
    @PierreSchinko 2 роки тому

    Javascript pour les nulls 😉 Par un null 😁 😁 😁 je cours voir la leçon 2 👍 👍 👍

  • @chghosts887
    @chghosts887 2 роки тому

    salut, je sais que cette rediffusion date un peut mais je voudrait signaler un fail, il ai toujours possible , pendant le temps ou tu afficher les rep en vert et rouge de cliquer sur les autre rep, Ducoup si la personne click sur toute les rep dans les 1s que tu a défini, il auras le point, il faut donc l'empêcher de recliquer app sont premier click

    • @levillageducode
      @levillageducode 2 роки тому

      Hello! Tu as totalement raison :) C'est une belle piste d'amélioration

  • @chadracchristmvoungou7225
    @chadracchristmvoungou7225 2 роки тому

    La pédagogie 😁😁 Bravo pour la vidéo. ça m'a vraiment beaucoup

  • @abdeldarou8187
    @abdeldarou8187 2 роки тому

    merci beaucoup

  • @Gauthier_Rémi
    @Gauthier_Rémi 2 роки тому

    Quelle est la différence entre un développeur?

  • @davenpaint
    @davenpaint 2 роки тому

    Salut JB, désormais, abonné je suis 😁

  • @killyanfaucon6853
    @killyanfaucon6853 2 роки тому

    Au top ! Vraiment nickel tes cours ! Si la majorité des enseignants pouvaient apprendre les choses comme tu le fais, ça serait juste un plaisir d'apprendre ! Car tout est clair et les explications sont là! Et avec le fait de concrétiser les notions avec un projet, c'est juste le combo gagnant ! Merci ! :D

    • @levillageducode
      @levillageducode 2 роки тому

      Ahhh merci ! :) Super content que ça te plaise!

  • @jeromemarras1608
    @jeromemarras1608 2 роки тому

    Salut JB ! Je n'arrive pas à comprendre pourquoi le forEach n'a pas fonctionné avec le className, et qu'il fonctionne avec le queryselector? Quelle différence il y a entre les deux? (appart l'utilisation des sélecteurs CSS ^^ )

    • @levillageducode
      @levillageducode 2 роки тому

      Hello :) ! querySelectorAll te revoit une nodeList, qui possède la méthode forEach: developer.mozilla.org/fr/docs/Web/API/NodeList Ce qui n'est pas le cas d'une HTMLCollection, qui est retournée par getElementsByClassName !

  • @anthonym.4356
    @anthonym.4356 2 роки тому

    Ouaaiiiisss s

  • @MXXflipflop
    @MXXflipflop 2 роки тому

    Super vidéo ! :) vivement demain pour la dernière ?

    • @levillageducode
      @levillageducode 2 роки тому

      Merci :) ! La dernière est dispo ici : ua-cam.com/video/yZ46TiZ7NbI/v-deo.html

  • @nicolasbarthes7622
    @nicolasbarthes7622 2 роки тому

    Juste parfait comme format, le ton, les explications, la pédagogie générale sur la façon d’aborder le travail de développement … Merci JB !!

  • @antonypoure936
    @antonypoure936 2 роки тому

    ze best

  • @jeromemarras1608
    @jeromemarras1608 2 роки тому

    Je sais qu'en ES6 il y les class et le constructor pour créer les objets, quelle méthode vaut-il mieux appliquer?

    • @levillageducode
      @levillageducode 2 роки тому

      Hello! Si tu connais la déclaration par classe, je te conseille de l'utiliser ;). Ca améliore le confort d'écriture, car il s'agit d'un enrichissement syntaxique par rapport aux fonctions constructrices. Par contre: la chose à savoir, c'est que contrairement à d'autres langages de programmation, JS est basé sur des prototypes, et non sur des classes. Ca va plus loin que la vidéo que j'ai faite, mais sinon go sur la doc de MDN qui en parle bien: developer.mozilla.org/fr/docs/Web/JavaScript/Guide/Details_of_the_Object_Model En tout cas, je pense que ça vaut le coup de comprendre comment ça se passe avec une fonction "constructeur" aussi. Jb

  • @bigpapa59460
    @bigpapa59460 2 роки тому

    JB ❤️ je vais faire ta promo. @Papoel 😉

  • @MikediWushu
    @MikediWushu 2 роки тому

    Vidéo très claire et on ne s'ennuie pas une seconde!