Simon Game JavaScript Tutorial for Beginners



In this JavaScript game tutorial, you will learn how to create a Simon game using JavaScript, HTML, and CSS. Every line of JavaScript is explained.

🔗Full code:
🔗HTML file:
🔗CSS file:

Tutorial by Beau Carnes.

🐦Follow Beau on Twitter: @CarnesBeau

Learn to code for free and get a developer job:

Read hundreds of articles on programming:

And subscribe for new videos on technology every day:

Nguồn: https://themusicobserver.com/

Xem thêm bài viết khác: https://themusicobserver.com/game/

  • Thank you very much, Beau Carnes. I really appreciate you taking the time to create this video. I am also glad that you provided us the code in case we got stuck. I was trying to keep up with the video and missed some brackets.

    yowiehopper July 8, 2020 9:52 am Reply
  • wow man,that's great work,thank you for this tutorial

    Омирзак Кулдыбаев July 8, 2020 9:52 am Reply
  • 20 rounds? Here I thought the game was virtually infinite. I made one in C# and its virtually infinite.

    IT July 8, 2020 9:52 am Reply
  • What software is he using? I need links, I'm totally lost…

    Bayron Anaya July 8, 2020 9:52 am Reply
  • I loved it! Keep up the good work!

    Fabio Zimmerman July 8, 2020 9:52 am Reply
  • Hey Beau, would like to ask you a question. When the user presses a button you setTimeout( () => { clearColor()} , 300); which makes the color disappear after 300 ms. However I'd like to keep the button lit up as long as the user holds down his click button. Is there a way in JS to achieve this?

    Abhishek shah July 8, 2020 9:52 am Reply
  • At 47:26 I am getting this console error:
    index.js:124 Uncaught TypeError: Cannot read property 'style' of null
    at clearColor (index.js:124)
    at gameTurn (index.js:76)

    Anyone have thoughts on this?

    Eric Reddy July 8, 2020 9:52 am Reply
  • hi please tell me what free engine is good for coding javascript. what is this engine in this video?

    Ali Alavi July 8, 2020 9:52 am Reply
  • amazing, really learned a lot thanks beau

    GoatzAreEpic Maokai July 8, 2020 9:52 am Reply
  • Thank you so much. I started to learn java last week.

    Pensri S. July 8, 2020 9:52 am Reply
  • sir how could I send my gratitude to you

    Easir Maruf July 8, 2020 9:52 am Reply
  • On 1.25x speed, he actually talks with exact normal talking speed

    kreglfromworld July 8, 2020 9:52 am Reply
  • Amazing. Thanks from Paraguay.

    Esteban Krauwezuk July 8, 2020 9:52 am Reply
  • thanks

    Hew July 8, 2020 9:52 am Reply
  • @freeCodeCamp.org at 32:26 in the video I attempt to print to the console the filled array but nothing happens when I click start. Just to verify the project worked I copied the JS script and pasted it and run it. However I get an uncaught error property play or null for the function “four” audio.play(). Can someone explain why this happens. I am using sublime text with google chrome browser.

    Suraj Kumar July 8, 2020 9:52 am Reply
  • this teacher is the best!!!

    Marek K July 8, 2020 9:52 am Reply
  • that's what she said

    country boy 15 July 8, 2020 9:52 am Reply
  • thanks, i like Jews

    Renat Noore July 8, 2020 9:52 am Reply
  • I made it and I'm playing now. Thank you. But I guess I'm not very good at this game 🙂

    caner demirci July 8, 2020 9:52 am Reply
  • https://codepen.io/Love2program/pen/qLNzRV?editors=0010 My code isn't working can someone help please? Thanks.

    Hira Ali July 8, 2020 9:52 am Reply
  • Thank you for your very educational video's! Keep up the good work!

    Dennis Daems July 8, 2020 9:52 am Reply
  • why didn't you put brackets after game turn in intervalID. gameTurn is a function. Shouldn't there be brackets after it?

    Gurmukh Singh July 8, 2020 9:52 am Reply
  • excuse me, can you tell me how to run these code

    Long Phan Nguyên July 8, 2020 9:52 am Reply
  • Hey guys, if anyone is interested I completed my Simon game from scratch with unlimited rounds to play with helpful comments.
    Demo: https://shimphillip.github.io/simon-game
    Code: https://github.com/shimphillip/simon-game

    Phillip Shim July 8, 2020 9:52 am Reply
  • Thanks for this helpful video.

    Random Ryan July 8, 2020 9:52 am Reply
  • Hi thanks for the video.

    At around 22 minutes in, when you use the if statement with strictButton.checked, couldn't you just do strict = strictButton.checked and not even need the conditional?

    David Stampher July 8, 2020 9:52 am Reply
  • Guys Look at this please, have tried stack overflow….

    VM144 index.js:22 Uncaught TypeError: Cannot read property 'addEventListener' of null

    at VM144 index.js:22

    (anonymous) @ VM144 index.js:22

    index.js:1 Uncaught SyntaxError: Identifier 'order' has already been declared

    at VM144 index.js:1

    (anonymous) @ index.js:1

    Lune lagune July 8, 2020 9:52 am Reply
  • can you make another video on how you made the html and css?

    Argee Learner July 8, 2020 9:52 am Reply
  • That looks like the requirements of the assignment example. But wait, I thought students are supposed to figure it out to complete the assignment on their own if they can and not just copy or spoon feed? If they work in this field, they can't rely on others all the time to complete their own job…Freecodecamp resources should be ample and good for its purpose I think, but for those looking for more maybe i.e. 4.8 or higher rated Udemy free and paid courses can help: https://recawt.blogspot.com/2018/10/485-rated-udemy-common-technology.html

    S.L. July 8, 2020 9:52 am Reply
  • Just when I was looking for sources to learn Javascript, this video appeared. I already Love freecodecamp.org but these videos are cherry on the cake. Love it.

    Abhishek shah July 8, 2020 9:52 am Reply
  • C++ course please

    Tri Rizki July 8, 2020 9:52 am Reply
  • I am confused? On lines 89 and 78 of the index.js I get a "Uncaught TypeError" and its says "document.getElementbyID is not a function"???

    Sebo July 8, 2020 9:52 am Reply
  • thank you for this video ! ^^
    just one question : in the html file you gave an id and a class to one element, why ? could we only give the id ? beacuse the class has not been used in the css file. (it's this line : <button class="button" id="start">Start</button>)

    chloe price July 8, 2020 9:52 am Reply
  • Funny this is my side project for my coding boot camp. I broke mine from breaking someone else's lol.

    Keenan Smith July 8, 2020 9:52 am Reply
  • Great series. Best channel for a reason 🙂

    Aravind Myd July 8, 2020 9:52 am Reply

Leave a Reply

Your email address will not be published. Required fields are marked *