A Music Game Built With React-three-fiber And The Spotify API

by React

next-audio-game

This game was made with the ambition of getting more familiar with 3D content on the web. The game itself draws inspiration from the classic game AudioSurf.

A Spotify Premium subscription is required to play the game.

View Demo View Github

Technologies

  • Next.js 12
  • NextAuth.js
  • react-three-fiber
  • glsl shaders
  • Spotify API
  • Chakra UI

Getting Started

  1. Clone the project
  2. Create a .env.local file in the root of the project. Instructions can be found in .env.example
  3. Install dependencies by running yarn
  4. Start the game by running yarn dev

Screenshot

Controls

Change lane with A,S,D or :arrow_left: :arrow_down: :arrow_right:

Contributing

Contributions are more than welcome!

Attributions

This project was bootstrapped with create-r3f-app

Road shader by Daniel Velasquez via tympanus

Space Craft Speeder by Kenney CC0 via Poly Pizza