This is a reacruitement task I've made once - the Simple Roulette Game. It's a basic roulette game with quite advanced js based animations.

Getting Started

npm run install
# or
yarn install

npm run dev
# or
yarn dev

and visit localhost:3000

npm run test
# or
yarn test

Description

Site is pre-rendered on the server, but canvas element with animation is only rendered in the browser
I've used Pixi.js + GreenSock for canvas and animation
I've used Cypress for E2E testing. The backend is mocked in the tests and I use data-testid to access page elements
Typescript and eslint is set up
The roulette spin result is actually coming from the backend before the animation, but a user only sees the result after the animation is over.
I've used scss modules for styling