https://github.com/bboydflo/tetris
learn stuff by implementing tetris
https://github.com/bboydflo/tetris
react react-hooks
Last synced: 6 months ago
JSON representation
learn stuff by implementing tetris
- Host: GitHub
- URL: https://github.com/bboydflo/tetris
- Owner: bboydflo
- Created: 2019-11-21T08:10:49.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-10-28T15:26:00.000Z (over 1 year ago)
- Last Synced: 2025-04-09T02:36:03.996Z (over 1 year ago)
- Topics: react, react-hooks
- Language: JavaScript
- Homepage: https://florin-cosmin-tetris.netlify.app
- Size: 2.25 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 19
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Tetris
This is my own implementation of a tetris game with the sole purpose to learn new things. Game logic is implemented in a [custom hook](https://www.npmjs.com/package/use-tetris)
This has started as a React app but eventually switched to Preact for smaller bundle size (check webpack config).
## Resources
- [A tetris using HTML5 Canvas.](https://github.com/CharlieGreenman/Html5Tetris)
- [Learn Modern javascript by implementing tetris game](https://medium.com/@michael.karen/learning-modern-javascript-with-tetris-92d532bcd057)
## Run the app
```sh
npm i && npm start
```
Then head on to [localhost:8080](localhost:8080)
## Deployment
```sh
git push
```
Netlify is setup to listen to changes on master. Whenever a change occurs in master, netlify will build the project (`npm run build`) and deploy the contents of the `dist` folder
## Credits
1. [how to use requestAnimationFrame with react hooks](https://css-tricks.com/using-requestanimationframe-with-react-hooks/)
2. [use event listener hook](https://usehooks.com/useEventListener/)
## Check more awesome hoooks
1. [hooks guide](https://hooks-guide.netlify.app/)
2. [use hooks](https://usehooks.com/)
3. [use hooks ts](https://usehooks-typescript.com/)
4. [awesome react hooks](https://github.com/rehooks/awesome-react-hooks)