Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ Microsoft AZ-900
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Personal Development Personal Transformation Mindfulness Life Purpose Meditation CBT Emotional Intelligence
Web Development JavaScript React CSS Angular PHP Node.Js WordPress Vue JS
Google Flutter Android Development iOS Development React Native Swift Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
Microsoft Power BI SQL Tableau Business Analysis Data Modeling Business Intelligence MySQL Data Analysis Blockchain
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Business Plan Startup Freelancing Online Business Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee
IT & Software Other IT & Software JavaScript

Build the Game of Life

Master HTML, CSS and JavaScript by building a game
Rating: 4.1 out of 54.1 (101 ratings)
1,534 students
Created by Elisabeth Robson, Eric Freeman
Last updated 1/2020
English
English [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • JavaScript programming
  • JavaScript event handling
  • How to interact with the web page using JavaScript
  • How to create the Game of Life in a web page

Requirements

  • Basic HTML, CSS, and JavaScript Programming Skills

Description

Welcome to Build the Game of Life, a project that takes you through building a generative, cellular automaton game from start to finish in a one page app using HTML, CSS and JavaScript. This project is a great way for you to integrate your skills with markup, style and behavior by creating an interactive and dynamic application right in your browser. In this project we’ll make heavy use of the DOM, events, timing and simple logic to create a truly generative application.

Who this course is for:

  • Beginner to intermediate web developers

Featured review

James Monty-Carbonari
James Monty-Carbonari
83 courses
2 reviews
Rating: 5.0 out of 57 months ago
Yes this is much clearer than the last course on this same topic I took on YouTube. They were using canvas and didn't explain that I should be writing pseudocode first. Learned something new today. Still, I'm having a lot of anxiety doing this.

Course content

7 sections • 66 lectures • 1h 50m total length

  • Preview03:42
  • Preview01:30
  • Prerequisites and Tools
    01:48
  • Exercise: Play the game of life on paper
    01:48
  • Observations about the Game of Life
    00:21
  • Field Trip: Learn more about the Game of Life
    00:12
  • Preview01:54
  • The Game Plan: Big Picture
    00:56
  • Audience Question
    00:37

  • Preview01:54
  • Code the Markup with HTML
    01:31
  • Code the Style with CSS
    00:37
  • Exercise: Think about the grid
    00:47
  • Create the Grid
    01:45
  • Overheard on the forum
    00:55
  • Exercise: Try creating the grid
    00:28
  • Create the grid with JavaScript: Overview
    06:29
  • Create the grid with JavaScript: Write the Code
    00:08
  • Crash test the Grid
    01:31

  • Introduction
    01:59
  • How to turn on a cell
    02:02
  • DOM Events Puzzle
    1 question
  • Add a click handler
    02:17
  • Add a click handler: Write the code
    00:15
  • Crash test the click handler
    01:06
  • Take a Break: Explore the Game of Life
    00:19
  • Handle button clicks
    02:30
  • Exercise: Design the Button Handlers
    00:59
  • Implement the button click handlers
    03:36
  • Crash test the button click handlers
    01:32

  • Introduction
    02:01
  • Design the model
    01:08
  • Overheard on the forum
    01:08
  • Code the grid model: Write the Code
    00:46
  • Code the grid model
    04:18
  • Crash test the grid model
    01:51
  • Exercise: Think about the grid model
    00:38
  • The rules of the Game of Life: Overview
    00:50
  • Preview04:46
  • Compute one generation: Overview
    00:34
  • Compute one generation
    06:48
  • Crash test the code to compute one generation
    01:57
  • Exercise: Research the setTimeout function
    00:11
  • Take a break: Generative applications
    00:23

  • Introduction
    02:04
  • The game plan for the view
    01:02
  • Update the View from the Model: Overview
    00:38
  • Update the View from the Model
    03:57
  • Audience question
    00:36
  • Crash test the View code
    01:50
  • Exercise: Think about how to keep the game going
    01:03
  • Plan the timer
    02:26
  • Code the timer: Overview
    00:32
  • Code the timer
    02:29
  • Crash test the timer
    02:45

  • Introduction
    02:18
  • Code the clear button: Overview
    00:48
  • Code the clear button
    02:05
  • Crash test the clear button
    01:25
  • We have a bug!
    03:56
  • Fix the bug
    02:09
  • Bonus: add a random button
    01:14
  • Final design and test: Overview
    00:33
  • Final design and test
    02:11
  • The finish line
    00:59
  • The final code
    00:05

  • Bonus Lesson
    00:14

Instructors

Elisabeth Robson
Co-founder and Principal at WickedlySmart
Elisabeth Robson
  • 4.5 Instructor Rating
  • 179 Reviews
  • 1,837 Students
  • 6 Courses

Elisabeth Robson is a co-founder and principal at WickedlySmart, an author, and software developer, and teaches online courses for for O'Reilly Media and LinkedIn Learning. She's the co-author of four best-selling titles--Head First JavaScript Programming, Head First Design Patterns, Head First HTML & CSS, and Head First HTML5 Programming--and previously the Director of Special Projects and co-director of the Head First series at O'Reilly Media. Prior to her work at O'Reilly Media, Elisabeth was Director of Engineering at The Walt Disney Company. Elisabeth holds a Master's Degree in Computer Science from Yale University. 

Eric Freeman
Computer Scientist
Eric Freeman
  • 4.1 Instructor Rating
  • 124 Reviews
  • 1,600 Students
  • 2 Courses

Eric is described by Head First series co-creator Kathy Sierra as "one of those rare individuals fluent in the language, practice, and culture of multiple domains from hipster hacker, corporate VP, engineer, think tank." Professionally, Eric recently ended nearly a decade as a media company executive-having held the position of CTO of Disney Online at The Walt Disney Company. Eric now devotes his time to writing and teaching software technology. His book Head First Design Patterns is considered an indispensable guide for object-oriented programmers and won the Jolt award for technical excellence.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Impressum Kontakt
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.