자바스크립트로 만든 공 없애기 게임 페이지 (반응속도 연습)

개요

• 페이지내에 랜덤으로 공이 생성되는 공을 클릭을 통해 제거하는 게임

사용 기술

• HTML5, CSS, JAVASCRIPT

구현기능

1. start 버튼을 누르면, 랜덤하게 공이 생성
2. 가운데 시간 표시를 통해 게임 진행 시간 파악 가능
3. 생성된 공의 숫자는 오른쪽 위를 통해 파악 가능
4. 공을 클릭하면 공이 제거되며, 오른쪽위의 남아 있는 공의 숫자가 하나 줄어 듦
5. PAUSE 버튼을 누르면, 타이머(개인 진행 시간)이 멈추며, 공의 생성도 멈춘다.
6. RESTART를 통해 다시 게임을 RESET 할 수 있다.

소감 / 발전방향

• 시간이 지날 수록 점점 더 공이 빠르게 생성되게 만들고 싶었으나, 구현상의 어려움이 있어서 만들지 못했다. 위 버전을 보완하여, 앞서 설명한 기능을 추가한 새로운 버전을 만들어야 겠다.
• JS를 통해 간단한 게임을 만들어 보니, 의외로 뿌듯했고, JS의 callback, 비동기 처리의 개념을 실제로 적용해 볼 수 있어서 공부가 잘 되었다.
• 순수 JS로 더 많은 것을 할 수 있다는 생각이 든다.