본문 바로가기

부트캠프

개인과제 JS로 로그라이크 콘솔게임 만들기 1일차

로그라이크 게임 만들기 1일차 

 

  • 타이틀
게임 시작시 처음으로 마주하는 화면 부터 이름 소개등을 내가 만들 게임에맞게 변경하였다.

실행시 첫 페이지
과제로 받은 server.js 파일의 타이틀 텍스트를 내가만들게임 이름
Attack Defense Run away 의 약자 ADR RPG 로 변경해주고
게임 이름이 왜 ADR RPG 인지 알려주고 게임시작을 환영하는 문구를 추가함
경계선 의 값을 50 => 60으로 변경하여 타이틀과의 길이를 맞추어주고

타이틀 코드
  // 타이틀 텍스트
  console.log(
    chalk.cyan(
      figlet.textSync("A D R - R P G", {
        font: "Standard",
        horizontalLayout: "default",
        verticalLayout: "default",
      })
    )
  );​


경계선 코드

//경계선
const line = chalk.magentaBright("=".repeat(60));
  console.log(line);


환영문구 코드

 console.log(
    chalk.yellowBright.bold(
      "Attack Defense Run away ADR RPG가 당신을 환영합니다! "
    )
  );

 

  • 선택지추가등 여러가지 로직추가
시작화면에서 새로운 게임을 선택할시 나올 게임 플레이 화면 만들기

기본적인 게임설명 
플레이어는 단 1개의 목숨으로 1 ~ 10 스테이지 안에있는 몬스터를 물리쳐야한다.
플레이어가 선택지를 고를시 선택지에 맞는 행동을 실행하며 몬스터는 공격하는 턴제방식의 게임이다.
기본적으로 1~5의 선택지를 제공할 예정

선택지 목록(아직확정아님)
1.공격한다  2.연막탄을 던진다 3.회복한다 4.방어한다. 5.도망간다.
플레이어는 입력창에 1~5의 숫자를 입력할수있고 입력한 숫자에 대응하는 로직을 만들예정이다.
while문을 사용하여 플레이어와 몬스터의 체력이 0보다 클 경우만 실행하도록함

선택지 코드
while (player.hp > 0 && monster.hp > 0) {
    console.clear();
    displayStatus(stage, player, monster);

    logs.forEach((log) => console.log(log));

    console.log(
      chalk.green(
        `\n1. 공격한다 2.연막탄을 던진다. 3.회복한다 4.방어한다 5.도망간다`
      )
    );

 

선택지


스테이터스 창 표시
지금이 몇 스테이지인지 ||플레이어의 체력과 공격력 || 몬스터의 체력과 공격력|| 을 업데이트해준다
가시성을 위 해 테두리도 길이에 맞게 늘려줌

스테이터스창 코드

function displayStatus(stage, player, monster) {
  console.log(
    chalk.magentaBright(
      `\n====================== Current Status ========================`
    )
  );
  console.log(
    chalk.cyanBright(`|| Stage: ${stage} |`) +
      chalk.yellowBright(
        `| Player: HP:${player.hp} DMG:${player.attackDmg} |`
      ) +
      chalk.redBright(`| Monster: ${monster.hp} DMG:${monster.attackDmg} ||`)
  );
  console.log(
    chalk.magentaBright(
      `==============================================================\n`
    )
  );
}
스테이터스창

● Class Player || Monster 에서 정의 한 hp , attackDmg 의 값을 넣어줌




2번 선택지 선택시 연막탄을 사용할시 0~3사이에 랜덤한값을 제공하고 그 값만큼 몬스터가 행동을 멈춘다
하지만 0이 나올시 바로 공격함

연막탄 코드

●작성방법
Math.random() 메서드를사용해 0~3의 값을 랜덤으로 나오게하는 코드를작성후 클래스 몬스터 안에
몬스터가 연막을 맞을시 행동 로직을 작성 이후 swhich문을 통해 연막탄 값에 따라 일정시간 행동을 멈추는 로직을 작성함 연막탄의 값이 0 보다 클경우 행동을 멈춘후 연막탄의 값이 1씩 줄어들고 연막탄의 값이 처음부터0이나왔다면 몬스터가 공격함

 

  //몬스터가 연막을맞을시 행동
    if (this.stopTime > 0) {
      this.stopTime--; // 행동을 멈추고 턴 수 감소
      return;
    }
4-2. 연막탄 남은 턴수의 조건에 따라 멈추거나 공격하는 switch문 작성

  if (monster.stopTime >= 1) {
      //연막탄이 유지되는동안 몬스터가 행동을 멈춤
      //턴이 지날떄마다 연막탄의 남은 턴수를 알려주고 1씩 빠짐
      logs.push(
        chalk.red(
          `몬스터가 당신을 찾고있습니다.(${monster.stopTime - 1}턴 남음)`
        )
      );
      monster.stopTime--;
    } else {//연막탄의 남은 턴수가 1보다 작다면
      switch (choice) {
        case "1":
          logs.push(
            chalk.red(
              `몬스터가 공격합니다! ${player.attackDmg}의 피해를 받습니다.`
            )
          );
          player.userHitDmg(monster.attackDmg);

          break;
        case "2":
          if (monster.stopTime === 0) {//연막탄 선택지 선택시 0이 나왔다면
            logs.push(
              chalk.red(
                `몬스터가 연막을 뚫고 당신을 공격합니다! ${player.attackDmg}의 피해를 받습니다!`
              )
            );
            player.userHitDmg(monster.attackDmg);
          }
          break;

 

연막탄 사용시


몬스터의 제력이 0 보다 작을경우 2스테이지로 넘어가며 스테이지*체력 스테이지*공격력 이 오르는 로직구현

스테이지++ 몬스터LevelUp 코드

export async function startGame() {
  console.clear();
  const player = new Player();
  let stage = 1;

  while (stage <= 10) {
    const monster = new Monster(stage);
    await battle(stage, player, monster);

    stage++;
스테이지 클리어 조건 정의 (미완)

class Monster {
  constructor(stages) {
    this.maxHp = 100 * stages; //최대 체력
    this.hp = this.maxHp; //현재 체력
    this.attackDmg = 20 * stages; //공격력
    this.stopTime = 0;
  }
정의한 stage 값을 Monster클래스에 생성자함수에 인자로 받아와 몬스터가 죽고 새로
생성될때마다 스테이지에 비례하여 곱해주는 로직작성
스테이지+ 새로운 몬스터생성 /플레이어레벨업로직 미구현