비행슈팅 게임의 기본을 만들어 본다.
목표는 키보드 상하좌우 방향키로 비행기를 움직일 수 있게 한다.
1. HTML 만들기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>1942 game</title>
<script src="1942.js"></script>
</head>
<body>
<canvas id = "canvas" width="900px" height="900"
style="position: absolute; top : 0px; left: 0px; border: 1px solid blueviolet;"
>Canvas 를 만들지 못했습니다/</canvas>
</body>
</html>
웹문서에서는 크게 두가지 일을 정의했다.
1.1 HTML 문서에서는 캔버스를 정의 하고, 사이즈를 정한다.
캔버스의 크기를 정확히 알기위해서 border 속성을 추가했다.
1.2 자바스크립트 코드를 연결한다.
캔버스를 사용해서 웹 게임을 만드는 기본골격의 시작은
웹 문서를 만드는 일이다. 앞선 강좌에서 계속해서 반복해오는 패턴이다.
코딩과 패턴은 반복하면서 익힌다...
다음편은 자바스크립트 코드이다.
반응형
'게임 만들기' 카테고리의 다른 글
| 비행슈팅 게임 만들기 기본 3편 (0) | 2024.09.25 |
|---|---|
| 비행슈팅 게임 만들기 기본 2편 (2) | 2024.09.22 |
| 자바스크립트 캔버스에 이미지 띄우기 (2) | 2024.09.11 |
| 자바스크립트 키보드 입력값 화면에 표시하기 3편 (0) | 2024.09.10 |
| 자바스크립트 키보드 입력값 화면에 표시하기 2편 (0) | 2024.09.09 |
댓글