Skip to content

clasei/twinkle-circle

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

twinkle-circle

a modern twist on a classic to test your own random access memory

Have Fun → twinkleCircle

twinkle-circle screenshot-v1.0.2

Releases

» twinkle-circle v1.0.0


How It Works

The game initializes with a random circle lighting up, signifying the start of the sequence. As players progress, the sequence grows. To play, users should replicate the sequence by clicking on the circles in the correct order.


App.js Overview

The heart of the twinkle-circle lies within the App.js file, a fundamental component that drives the entire application. Utilizing the power of React's hooks, such as useState, useEffect, and useRef, this component orchestrates the game logic, interaction, and flow. It seamlessly integrates various components, including the header, circles, control panel, and even a custom toast notification for user feedback. The game operates on a sequence mechanism, wherein a random sequence of circle colors is generated and played, with the player's objective being to replicate this sequence. The code is modular, ensuring readability and ease of maintenance.


Installation

git clone https://github.com/clasei/twinkle-circle.git


Customization

  • Particles: to modify, navigate to particles.js and adjust theparameters
  • Circles: changes can be made in Circle.js
  • Slider: changes can be made in ControlPanel.js

Create React App — this project was bootstrapped with Create React App


License

Project is licensed under the Creative Commons License

License — particles.js

The library particles.js is under the MIT License by Vincent Garreau


Feedback, Forks & Contributions

Feel free to open an issue if you have any suggestion

Interested in contributing or customizing? Fork the project

Thoughts? Write to clasei@proton.me

[ build, don't talk ]