Game Development


JavaScript HTML Game from Scratch Blackjack

Learn how to create a web application from scratch. Apply JavaScript to HTML and CSS to build a Blackjack application

4.65 (97 reviews)


4 hours


Nov 2019

Last Update
Regular Price

What you will learn

Use JavaScript with HTML and CSS together

Create a Blackjack game from scratch

Apply logic and build a web based game using HTML, CSS and JavaScript


Learn how to build a playable Blackjack web based application from scratch!

Using HTML, CSS and JavaScript this course will show you how to create a game from scratch.  One of the best ways to learn how to use JavaScript is to apply it to projects.  This course show you the steps and process from a blank file to building out the entire game.

This course is designed for beginners with some basic JavaScript, HTML and CSS experience required.  We will be reviewing only the JavaScript functionality required to build the game and demonstrating how to apply the code. This course does not cover HTML, CSS and JavaScript in their entirety but covers the use of them in relation to building a game.

Start with the basics of what is needed, apply logic and build out a working web application.  Test your application, tweak fine tune and get it working as designed.   

  • Start off building a deck of cards in JavaScript
  • Learn how to generate values of cards to use within your application.
  • Prepare to build the game.  Define the game rules and what you need in order to get that functionality.
  • Learn how to build a playing card visually with CSS
  • Create the game play using JavaScript applying logic
  • Add player actions and decision points
  • create the logic for the dealer
  • Put it all together to play Blackjack

Source Code is included, step by step instruction to demonstration how to build an application.  

Taught by an instructor with over 18 years of web development experience.

I'm here to help you learn how to write JavaScript and ready to answer any questions you may have.  

This course showcases how to build a fun interactive application.  When you are ready 


JavaScript HTML Game from Scratch Blackjack
JavaScript HTML Game from Scratch Blackjack
JavaScript HTML Game from Scratch Blackjack
JavaScript HTML Game from Scratch Blackjack


Introduction to building a web based game

JavaScript game introduction

Course Resources

JavaScript Creating Random Numbers

Creating a deck of Cards JavaScript

Source Code loops and random

Output special Characters JavaScript HTML CSS

Adding Color to Characters ternary operator JavaScript

Source Code

How to generate a random card value using JavaScript

Source Code for random card values

Creating the game

Creating a game Start JavaScript

Shuffle Array values random order JavaScript

Deal the cards setup player and dealer JavaScript Loop

Output Dealer and Players Hand of cards JavaScript

Source Code deal out cards

Template for a Card CSS

Using CSS to create a playing card

Output Styled Cards into Gameplay JavaScript CSS

Source Code output styled cards

CSS JavaScript Cover Dealer Card

Adding gameplay elements HTML

Applying Styling CSS to buttons and updating game elements

Hide buttons start game JavaScript

Source Code

Create next options for player JavaScript

Player actions JavaScript

Create player values and interactions JavaScript

Dealer Logic JavaScript play the game

Blackjack values and calculations JavaScript

Determine who won adjust values JavaScript

Working prototype source code

Code Tweaks and fine tuning JavaScript HTML CSS

Gameplay adjustments and tweaks JavaScript

User styling and dashboard design CSS HTML

Setting click event JavaScript

Limit min max for input field values JavaScript onchange event

Fix button tweak double JavaScript

Testing and tweaks to debug application JavaScript

Final test run through of gameplay

Source Code review and exploration

Game instructions and game play outline

Clean up source code final tweaks JavaScript

HTML source Code index.html

CSS review code

CSS Source Code style.css

JavaScript code review part 1

JavaScript Code review part 2

JavaScript Source Code

Bonus Section

Bonus Lecture


Gary13 August 2020

Fantastic! ! I've spent so much time trying to understand what was shown in this video through other means. It's easy to follow , explains VERY clearly and simply so anyone can understand ! Great job!

Jacob6 August 2020

Its cool in concept, but overall I've been disappointed with this course. Its pretty clear he was just making this as he went along, and therefore the structure is all over the place. Both in the course and in the code. By the time you finish 'Working Prototype", it is far from finished and riddled with bugs. Small annoyances, he exclusively uses var, when we have better declarative functions in 'let' and 'const'. Mixed bag use of camelCase in some spots. HUGE annoyance, he puts all of his javascript and CSS into a single file, which makes it much harder to follow along as he is constantly going back to check his work. I'm enjoying to opportunity to go back and make all these adjustments myself, but definitely not what I was looking for in this course.

Oredola5 February 2020


Stanley21 October 2019

Good if you have a good understanding of javascript. The course use ES5 syntax, and i think the instructor wrote code that was a bit hard to read. This course helped med understand some javascript app design consepts. But i will not recommend it to beginners. One of the best things about this course is that it motivated me to improve the game, and make it my own. The course inspired me to create similar games on my own.

Andrew8 July 2019

I have watched many YouTube videos attempting to build a blackjack game, but your experience is showing in how easily you work with the JS. I am so impressed that I am considering purchasing additional courses.

Jos28 April 2019

It's a nice course that shows how to make a simple game in js, html, and css. It shows some neat tricks in some videos, and has overall been an enjoyable course. Also, the course has a specific section for reviewing the code. It's an important step in development, and I'm glad to see that it was emphasized in the course.

Dante4 June 2018

El curso menciona Inteligencia Artificial para el dealer, cosa que no es verdad, no se puede comparar una red neuronal con capacidad de aprender y volverse más complicada automáticamente, a un while. Muy mal. En la lección 28 dice : DEALER AI Javascript Play the Game (AI = Artificial Inteligence) <- there no such think on this

Kevin25 April 2018

Good - I'm sure as I learn how to code more the speed at which this course is delivered will seem 'normal', however, I gave it a four just because at times I felt slightly clearer instructions/explanations could have given.

Prates23 February 2018

The instructions are clear, the pace is good and the objectives were met. As the course progresses, the logic and the code used became more and more complex. The pace became more accelerated, specially when he selected some code from one position to pasted into another position. Sometimes I had to go back several times to understand what changes he was doing in the code.

Julien16 February 2018

Nice and straightforward curse. Great to see how to use some of your knowledge in real-world apps. I'll be taking more of Laurence courses soon.

Richard4 February 2018

I like it so far and the instructor is fairly easy to follow. I also like how he explained each step in detail. This made it easy for me to catch up after being away.

Peter9 September 2017

I really learnt a lot about JavaScript, the tutor is enthusiastic and delivers the course at a fairly fast pace. Only reason I didn't give 5* is because there is a bug in the game where if the player is dealt blackjack immediately the buttons disappear and the user can't proceed with the next hand. Also I noticed some repeated ids in the css code. Overall though a great project and great tutor!

David27 July 2017

This is my second course by this instructor and I'm definitely satisfied with the overall product, but I do have some issues. First the good: the project delivers on what was described and what I personally wanted out of it. I had been building blackjack myself and was nearly done with it, but when I saw this I decided to buy it. I wanted to see how someone else approached the process of dealing with the Ace card, and dealing with the computer's actions. I also learned more about switch/case statements which was interesting. What I have issues with, and these may simply be personal ones: 1) There doesn't seem to be a clear delineation between what is "test code" and what is "real code" meant to be kept in the final program. I very much like seeing the instructor "work" through the process because it gives me insight that I simply can't get on my own, however moving from lesson to lesson without any knowledge of what should/shouldn't be kept is more than a little irritating. 2) This is more than likely a personal thing, but I don't like how the go-to for this instructor is innerHTML. It feels very 'brute force' like and unnecessary in a lot of situations where we're simply updating the text of an element where I feel textContent would be more appropriate. In both cases for courses by this instructor, I've simply jumped to the end of the code and worked through it myself, adding comments at every point to explain what each block of code is doing, where certain values are coming from, etc. This is because so much of a back-and-forth nature of the instructor's testing makes it difficult to follow what is 'really" important. I would MUCH prefer that the instructor split this up into separate, clearly labeled lessons. Have a video whose sole purpose is to "learn" how to accomplish a particular task, and then have the following lesson be an implementation of that code into the real working project. This does happen already to an extent, but it is, in my opinion, very messy. All things being said though, I'm very satisfied with the course. I personally feel like I learn more having to effectively 'debug' the final product myself because I always skip to the end.

Martin16 July 2017

For this type of project I would have liked to see more planning and design of the code probably with the use of UML Sequence Diagrams. The lecture appeared to be building the game by the seat of his pants.

Bob28 June 2017

I have wanted to build a solitaire game and this is getting me the way to build the card decks. I am really enjoying the course to this point. I have had some programming experience in c, c#, c++, Basic, Visual Basic, HTML, CSS, JS and python. What is being taught here I have pretty much covered in one form or the other, though I have picked up a few things I did not know. That being said, this is an awesome course and it is laid out so that anyone can follow along to make the game but I think some prior HTML, CSS and JS experience would better help you understand exactly what is being done and why. The instructor goes briefly over what and why, but you would get more out of it if you research things you do not understand and learn more about them. Again, I really like what is being done and how it is being presented. Just completed the course and thought it was more than worth my time. Thank you for providing so much information on creating a wonderful corse.


9/30/201995% OFFExpired


Udemy ID


Course created date


Course Indexed date
Course Submitted by