[항해 플러스 코육대] 제 1회 코육대 참여 - 테트리스 미니 프로젝트

Github Repository & Pages

깃허브 레포지토리

GitHub - interrobang3544/hanghaeplus-tetris: 항해 플러스 제 1회 코육대 미니프로젝트

깃허브 페이지

TETRIS

 

기능 구현 설명

기본적으로 아래와 같이 구성하였다. 좌측에는 게임판이, 우측에는 게임현황판/다음블럭/재시작버튼을 두었다.

게임 진행 방식은 아래와 같다(잘 알려진 TETRIS 게임의 규칙).

• 게임이 시작되면 랜덤한 블럭(테트로미노)이 생성되어 나타나고 시간에 따라 점차 아래로 떨어지게 된다. 
• 사용자는 ←, →, ↓  키를 입력하여 블럭을 한 칸씩 움직일 수 있고, ↑  키로 블럭을 회전, spacebar키로 블럭을 제일 아래줄로 드롭할 수 있다.
• 블럭은 더 이상 움직일 수 없을 때 고정되고 새롭게 블럭이 생성된다.
• 같은 줄에 블럭이 전부 쌓이는 경우 그 줄이 사라지고 그 줄보다 위에 쌓여있던 블럭들은 그만큼 내려온다.
• 블럭이 가장 위에서 움직일 수 없는 경우 게임은 종료된다.

표시 되는 중요한 정보는 아래와 간다.

• Play Time(게임 시간)은 시간, 분, 초 단위로 게임이 진행된 시간을 보여준다.
• Speed Level(게임 레벨)은 현재 게임 레베을 보여준다. 1부터 시작해서 최대 10까지 30초마다 증가하며, 점차 블럭이 내려오는 속도가 빨라진다.
• Score(점수)는 제거한 줄 수를 보여준다.
• Next는 다음 블럭 모양을 보여준다.

 

게임이 종료될 때는 아래 처럼 블럭들이 회색으로 변하며 GAME OVER 라는 문구가 나타난다.

재시작 버튼을 누르면 처음 상태로 돌아간다.

 

참여 소감

추석 연휴동안 의미 있는 일을 하고 싶었는데 코육대라는 재미있는 컨텐츠가 있어서 즐거웠습니다.

바닐라 자바스크립트만을 이용해서 만들어 보고 싶었고, 덕분에 다시 기본적인 개념들을 리마인드 하는데에 큰 도움이 되었습니다.

생각보다 하루하루 시간내기가 어려워서 높은 퀄리티의 결과가 나오지는 못했지만 그래도 정말 보람찼습니다. 

시간이 더 있다면 리팩토링을 통해 효율성, 가독성 높은 코드를 짤 수 있었을 것 같은데 아쉽기도 합니다.

 

제 1회 코육대 이벤트 페이지 링크

이벤트에 관심 있으신 분은 아래 링크를 확인하세요!

항해 플러스: 제1회 코육대