JavaScript 입문 : 가위바위보 게임 - 순서도

이 글은 제로초 TV의 자바스크립트 강좌를 기본으로 하고 있습니다. 

 

▒ 가위바위보 게임 순서도 

 

다시한번 옛 기억을 살려보고자 합니다. 아직 만들어내는 실력이 뛰어나지는 않지만 코딩을 하기전 어떤 형태로 해야하는지에 대한 부분은 순서도를 만들었던 기억이 있습니다. 

 

순서도를 만들때 필요한 항목을 정리해 보면 다음과 같은 항목이 필요하리라 판단됩니다. 

 

① 가위바위보 게임에 사용될 그림파일(png 확장자) 

② 빠르게 가위 바위 보가 변하게 값 지정

③ 값이 지정이 되면 화면의 그림 변경

④ 그림 멈추면서 가위 바위 보 승패 확인 

⑤ 승리는 1점 무승부 0점 패배는 -1점으로 점수 계산하기

⑥ 화면에 점수 표시 

⑦ 1초후  그림 회전 

 

상기 사항을 첫번째 순서도 초안으로 생각하고 다음과 같이 순서도를 그릴 수 있습니다. 순서도를 그리는 소프트웨어는 많이 있스습니다만, VS Code내 확장을 통하여 순서도를 그릴 수 있습니다. 

 

Extension 프로그램은 Draw.io integration입니다. 

설치방법은 이제 아실 것으로 판단되어 스크린샷 하나로 대체 하겠습니다. 

 

 

확장자가 .drawio로 새 파일을 만들면 순서도를 그릴 수 있습니다.

 

혹은 직접 온라인 상에서 draw.io로 접속해서 순서도를 그릴 수 있습니다. 같은 프로그램인데 차이점은 VS Code와 연동시킨점과 화면캡쳐를 위해 온라인에서 직접 그린것의 차이이고 같은 회사 같은 프로그램입니다. 

 

순서도(Draft)는 다음과 같이 그림 수 있갰습니다.

 

 

이제 상기 순서도를 1차로 차근 차근 공부해 가면서 필요시 순서도도 업데이트 하도록 하겠습니다. 그러기 위해서는 편한 방식으로 순서도를 저장하기 바랍니다.