A tetromino game based on React, Redux, TypeScript, and functional programming.
🚀 Play the game: https://gibbok.github.io/blocchi-puzzle/game/
👨💻 UI components: https://gibbok.github.io/blocchi-puzzle/storybook/
Recently I took some time to work through the remaking of a classic tetromino game as a side project, although the game logic is fairly straightforward, I wanted to implement it using a professional approach and most modern front-end technologies and techniques.
The game is built in TypeScript, using functional programming techniques with fp-ts.
UI components are written in React in isolation using Storybook. Application state management is handled using Redux with middleware redux-thunk. The layout is fluid and responsive based on CSS3 written using styled-components.
Animations created using GSAP and react-transition-group with CSS transitions.
All tests are written using Jest and Sinon with coverage to near 100%. UI snapshots and behavioral testing is performed using react-test-renderer. To mock the store redux-mock-store was used.
Additional visual regression testing is setup using Loki. End-to-end testing made with Cypress. Continuous integration with Travis CI.
