2022-07-20: Phaser 실습하기(2)

앞서 찾아본 web server 구축하는 방법 세 가지 중 가장 간단해 보이는 python 방법을 선택했다.

 

Step1. 프로젝트 파일이 있는 곳에서 git bash를 열고 아래의 코드를 입력했다.

python -m SimpleHTTPServer

그 결과, 'No module named SimpleHTTPServer' 에러 코드가 등장했다.

구글에 검색해본 결과 python version이 3.x인 경우는 python -m http.server를, 2.x인 경우에는 python -m SimpleHTTPServer를 입력한다고 한다.

https://developer.mozilla.org/ko/docs/Learn/Common_questions/set_up_a_local_testing_server

 

 

Step2. 따라서 python -m http.server를 입력하고 브라우저의 url 창에 'localhost:8000'를 입력하자 까만색 화면이 떴다. 이때 만약 html 파일이 여러 개라면 그 중에서 원하는 파일을 선택하면 된다.

console 창을 보니까 에러가 많이 떠있었는데, 대부분이 'assets/...png' 파일을 가져올 수 없다는 코드였다.assets 폴더는 Phaser github에서 제공되는 것 같았고, 따라서 https://github.com/photonstorm/phaser3-examples 을 clone 받은 후 assets 폴더만 내 프로젝트 폴더로 이동했다.

GitHub - photonstorm/phaser3-examples: Phaser 3 Examples

 

그 결과 아래와 캐릭터를 누르면 폭발 효과와 함께 하나씩 사라지는 애니메이션을 실행시키는 데 성공했다.

Phaser animate: hide on complete

다음은 Phaser를 이용해서 공통 프로젝트에 쓸 수 있을만한 우리 팀만의 캐릭터와 애니메이션을 만들어봐야겠다.

three.js와는 달리 Phaser는 node.js와 상호작용이 잘 돼서 이걸 프로젝트에 사용할 수 있다면 정말 좋을 것 같다.