radderveloper

- 캐릭터가 움직일 때 아래와 같은 사단이 벌어지지 않도록 무한 배경을 구현해보자(배경이 잘린 상태이다.) ● 화면이 캐릭터를 따라가게 해보자 - PlayingScene.js의 create function에 코드를 추가해 화면이 캐릭터를 따라가게 해보자 create() { ... // 사용자가 보고 있는 화면이 m_player를 따라가게 한다. this.cameras.main.startFollow(this.m_player); ... } - 이해를 위해 한 가지를 미리 얘기하면 방향키를 눌러 캐릭터가 움직일 때 이는 실제 캐릭터가 그 방향으로 물리적인 움직임을 수행하는게 아니다. - 즉, 방향키를 누르면 마치 캐릭터가 움직이는 것처럼 보이지만 실제로 캐릭터는 가만히 있고 화면이 계속 움직이는 것이다.(캐릭..

● 도입 - 하나의 class(=scene)에서 함수가 실행되는 순서 - init은 constructor function을 의미한다. / 마지막인 update function은 계속 반복해서 실행된다. - 바로 이 update function에 사용자가 키보드를 눌렀을 때 player가 움직이도록 코드를 작성할 것이다. ● 움직이는 player 만들기 - PlayingScene.js에 update function을 만들어 캐릭터 움직임 관련 내용을 작성했다. import Phaser from "phaser"; import Player from "../characters/Player"; import { setBackground } from "../utils/backgroundManager"; export ..

- create function : 게임이 실행됐을 때 첫 번째로 실행되는 function - update function : create function 이후에 계속해서 실행되는 function ● LoadingScene - LoadingScene은 게임에서 쓰일 asset들을 load 할 scene이다. - load 해 놓은 asset은 전역적으로 사용 가능하다. - '루트폴더/src/scenes' 폴더를 만든 후 해당 폴더 안에 scene 파일을 만들면 된다. - scenes 폴더 내에 LoadingScene.js를 생성해보자(나는 저번 글에서 이미 생성함) // asset import import Phaser from "phaser"; import fontPng from "../assets/fon..

- 당연한 얘기이지만 하나의 게임에는 수 많은 코드가 들어있다. - 이것을 하나의 js 파일에 모두 다 담을수는 없으므로(담아서도 안 됨) 용도에 맞게 코드를 분기해야한다. - 당연히 이러한 분기 때마다 파일도 새로 생성돼야 한다. ※ 강의 들을때마다 아래의 드래그한 영역만 복사한 후 새폴더를 생성해 붙여넣으면 된다. ※ 단, gh-pages와 gh-pages.pub는 제외 ● 준비 - scene_1 폴더를 새로 생성한 후 위의 사진 속 파일을 복붙했다. - vsCODE를 실행해 scene_1 폴더를 open folder 해보 - 터미널을 열어 명령어 입력 후 아래의 사진이 뜨면 정상이다. npm install npm start ● entry point - 현재 scene_1 폴더에 있는 index.js..

● 템플릿 다운로드 후 세팅 by github - 어떤 템플릿 다운? Babel7, Webpack4를 통해 ES6를 지원하는 Phaser 3 프로젝트 템플릿 - 템플릿과 npm을 사용하지 않고도 개발할 수 있지만 사용하는 것을 추천 1. - 아래의 주소로 들어가서 fork https://github.com/photonstorm/phaser3-project-template GitHub - photonstorm/phaser3-project-template: A Phaser 3 Project Template A Phaser 3 Project Template. Contribute to photonstorm/phaser3-project-template development by creating an account..

https://github.com/weniv/phaser_youtube GitHub - weniv/phaser_youtube: 유튜브 공개용 코드 유튜브 공개용 코드. Contribute to weniv/phaser_youtube development by creating an account on GitHub. github.com - git을 이용해 위 github의 소스코드를 clone 했다. - 어차피 무료 공개 강의 범위내에 있는 사이트라 공유한다. - git 설치 후 vscode에서 터미널을 열어 아래 명령어를 차례대로 입력하자 git init --> 먼저 local repository를 만들어줘야한다. git clone https://github.com/weniv/phaser_youtube.gi..