This product provides a real-time race of horses running in 8 different lanes on a straight route.
After pressing the start button, the countdown is shown and then the horses start from the starting point to the race. During the run, the speeds within a certain range are instantaneously changes randomly. In this way, who will win is always determined by the luck factor during the race.
The leaderboard is located on left of the race pitch. Depends on the position of the horses, the changing rankings are displayed in this table instantly. Racing can be started at any time via start button . The race that has started cannot end before the last horse crosses the finish line. The race is not over until the last horse crossing the finish line.
The result table are shown in a list with lane numbers through popup. There is a button at the bottom of the result table . When the button is clicked, horses return to their initial state, ready to start.
In current version, the product has been developed to support Chrome and Safari which are two of the most used browsers in the world.
The product be developed to run on Opera and Firefox browsers.
The product will be made available not only on web browsers, but also on mobile responsive and tablets.
Netlify link : realtimehorserace.netlify.app
horserace.mp4
npm install
npm run dev
npm run build