Level 1b: HTML and JavaScript Programming - Tic-Tac-Toe Game

Welcome!  You're about to start an exciting journey.  Programming can be amazing, engaging, and interesting, but most of all I think it should be fun.  If you've ever thought about learning programming, this is a good place to start.

These lessons are meant for beginners; they introduce basic programming concepts and allow a budding new developer to build a functional tic-tac-toe game in HTML and Javascript.  Who doesn't like games?

Each lesson takes just a few minutes; the entire program can be completed in under an hour.  There are no pre-requisite skills beyond being able to hit keys on your keyboard and open files in a browser.  The only software required is a browser (I recommend Google Chrome) and a Text Editor (I recommend TextWrangler on a Mac and Notepad++ on Windows).  If you're on a Linux system, you probably already have a great one.

I'd recommend that as you start coding, you experiment.  What happens if this variable is changed slightly?  What happens if these statements are rearranged?  Experimentation is key to learning, and you should convince yourself about the way code works by trying a few different things.  It can really help you to understand what's happening.

The best way to learn how to write code is to start writing code!  Don't be afraid to pause the video, write things out, test it what you've done, and convince yourself that it works before moving on.

If you're ready, you can start with Lesson 1: Introducing HTML

Other lessons:
  • Lesson 1 is about 7 minutes long and talks about HTML and building a basic interface.
  • Lesson 2 is about 6 minutes long and talks about working with styles.
  • Lesson 3 is about 5 minutes long and it introduces functions and variables in Javascript.
  • Lesson 4 is about 4 minutes long and it talks about if-then statements in Javascript.
  • Lesson 5 is the big lesson.  It's about 13 minutes long and goes into detail on how to create the game.
  • Lesson 6 is about 8 minutes long and it introduces loops and finishes the game.