Reviving Classic games with ReactJS, Type Script and Jest
Master React by Building Classic Games: A Comprehensive Guide to Advanced Techniques, Testing, and State Management
Updated on Oct, 2025
Language - English
Development ,Web Development,ReactJS
Lectures -73
Quizzes -7
Duration -9 hours
Lifetime Access
Lifetime Access
30-days Money-Back Guarantee
Get your team access to 10000+ top Tutorials Point courses anytime, anywhere.
Course Description
Learn the full power of React using this comprehensive, hands-on course in which you will construct modern web development in seven classic games. Suitable for developers with an understanding of React, TypeScript, and CSS who wish to master their skills through practical, engaging projects.
Produce several well-known games, such as Connect 4, Wordle, Master Mind, Memory Game, Lights Out, Hangman, and the 15 Puzzle. For each project, you will go deeper in understanding the core concepts of React - the concepts of components, hooks, and state management - while learning how to handle those states with Context API and Redux.
You'll also learn how to write unit tests with Jest so your applications do what you expect them to. You will also learn more about code-splitting and separation of concerns in web applications.
It is directed towards ambitious web developers or even experienced programmers looking to refine their skills and gain knowledge on how to create interactive, high-performance applications. At the end of this course, in addition to a portfolio of the classics, you will have a solid foundation in both React and TypeScript to tackle the most complex projects and propel your career in web development.
Goals
- Develop Interactive Apps: Build dynamic web applications with React components, state, and props
- TypeScript Integration: Learn to integrate TypeScript with React to build type-safe, scalable applications with enhanced code quality
- Test with Jest: Write unit and integration tests for React applications using Jest, ensuring reliability and robustness
- Implement React Hooks: Use modern hooks like useState, useEffect, redux, ContextAPI and side effects
- Build Classic Games: Create 7 classic games using React components and state management
- Optimise Performance: Learn techniques like code-splitting to enhance React app performance
- State Management: Master state management using the Context API and Redux to handle global state in React applications
- TypeScript Integration: Learn to integrate TypeScript with React to build type-safe, scalable applications with enhanced code quality
- TypeScript Integration: Learn to integrate TypeScript with React to build type-safe, scalable applications with enhanced code quality
Prerequisites
While a basic knowledge of React and TypeScript is recommended, rest assured that all concepts will be thoroughly explained in great detail throughout the course.
A basic knowledge of css would be great but not required.
Curriculum
Check out the detailed breakdown of what’s inside the course
Connect-4 game
9 Lectures
-
01- Setup the project
07:08
07:08
-
How to setup the project
-
02 - Board
11:57
11:57
-
03 - Drop the marbles into the board
13:14
13:14
-
04 - Animate and move marbles
17:18
17:18
-
05 - Dropping marbles into correct spot
07:27
07:27
-
06 - Animate moving and dropping final touches
08:31
08:31
-
07 - Set Winner and reset types
20:38
20:38
-
Connect-4 quiz
Hangman game
10 Lectures
15 Puzzle
11 Lectures
Lights out
9 Lectures
Memory game
8 Lectures
MasterMind
15 Lectures
Wordle
11 Lectures
Instructor Details
Amir Shahbabaie
Course Certificate
Use your certificate to make a career change or to advance in your current career.
Our students work
with the Best
Related Video Courses
View MoreAnnual Membership
Become a valued member of Tutorials Point and enjoy unlimited access to our vast library of top-rated Video Courses
Subscribe now
Online Certifications
Master prominent technologies at full length and become a valued certified professional.
Explore Now