https://github.com/mateuszsokola/2048-in-react

:joystick: 2048 game in Next.js with awesome animations!
https://github.com/mateuszsokola/2048-in-react

2048 2048-clone 2048-game animations course javascript js learn-to-code next nextjs node nodejs online-learning react screencast ts tutorial typescript udemy udemy-course

Last synced: 7 days ago
JSON representation

:joystick: 2048 game in Next.js with awesome animations!

• Host: GitHub
• URL: https://github.com/mateuszsokola/2048-in-react
• Owner: mateuszsokola
• License: mit
• Created: 2021-07-29T19:09:01.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2024-09-01T14:14:51.000Z (5 months ago)
• Last Synced: 2025-01-19T02:07:59.461Z (14 days ago)
• Topics: 2048, 2048-clone, 2048-game, animations, course, javascript, js, learn-to-code, next, nextjs, node, nodejs, online-learning, react, screencast, ts, tutorial, typescript, udemy, udemy-course
• Language: TypeScript
• Homepage: https://mateuszsokola.github.io/2048-in-react/
• Size: 725 KB
• Stars: 206
• Watchers: 4
• Forks: 317
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# 2048-in-react

[![Open issues][issues-badge]][issues-url]

[![CI][lint-badge]][lint-url]

[![CI][test-badge]][test-url]

[![TypeScript][typescript-badge]][typescript-url]

This is a fully functional clone of the popular 2048 game, built using React and Next.js. Not only does it offer smooth animations and works on mobile devices, but it's also a fantastic learning resource for developers. Whether you're here to play, contribute, or learn, this project has something for everyone.

If you're interested in mastering React by building this game step-by-step, check out the course linked below!

[![](.docs/demo.gif)](https://mateuszsokola.github.io/2048-in-react/)

## [Play 2048 💥](https://mateuszsokola.github.io/2048-in-react/)

## Features

- Fully-functional 2048 clone

- Animations

- Supports **keyboard** and **touch** events

## Development

_Easily set up a local development environment!_

Just start dev server on [localhost](http://localhost:3000):

- clone

- `npm install`

- `npm run dev`

**Start coding!** 🎉

## Build your own 2048 Game! 🚀

Want to learn how to build this game from scratch using React & Next.js? I've got you covered! This project is part of an online course where I guide you through the entire process, step-by-step.

Whether you're a beginner looking to enhance your skills or an experienced developer seeking a fun project, this course will take you through the core concepts of React while building a fully functional game.

[![Build 2048 Game in React](https://assets.mateu.sh/assets/github-2048-in-react-readme)](https://assets.mateu.sh/r/github-2048-in-react-readme)

## Support

If you encounter any issues or have suggestions, feel free to open an issue. Your feedback is always appreciated!

[lint-badge]: https://github.com/mateuszsokola/2048-in-react/actions/workflows/lint.yml/badge.svg

[lint-url]: https://github.com/mateuszsokola/2048-in-react/actions/workflows/actions/workflows/lint.yml

[test-badge]: https://github.com/mateuszsokola/2048-in-react/actions/workflows/test.yml/badge.svg

[test-url]: https://github.com/mateuszsokola/2048-in-react/actions/workflows/test.yml

[issues-badge]: https://img.shields.io/github/issues/mateuszsokola/2048-in-react

[issues-url]: https://github.com/mateuszsokola/2048-in-react/issues

[typescript-badge]: https://badges.frapsoft.com/typescript/code/typescript.svg?v=101

[typescript-url]: https://github.com/microsoft/TypeScript