기초부터 차근차근 정리하고 싶었는데 지식이 일천하여 정리가 잘 안되어서 그냥 실전으로 익히는 게 나을것 같아서 무작정 따라해보았다..
일단 이걸 보면서 코드를 따라 치고 시작해보자.
이 과정은 벽돌깨기 게임을 만드는것인데 별도의 게임 엔진을 사용하지 않고 순수 자바스크립트로 만드는것이기 때문에 canvas를 활용했다.
일단 새로운 폴더를 만들고 그 안에 index.html, style.css, bb.js 파일을 만들고 html 파일에 아래와 같은 코드를 쓴다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Brick Breaker</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<canvas id="bb" width="480" height="320"></canvas>
<script defer src="bb.js"></script>
</body>
</html>새로운 것들
1. canvas
canvas는 html에서 캔버스 스크립팅 API 또는 WebGL API와 함께 사용해서 그래픽과 애니메이션을 그릴수 있는 엘리먼트라고 한다. html에서 블럭깨기 게임을 만들기 위해서 필수적으로 사용해야 할 엘리먼트이다.
2. script
script 엘리먼트는 데이터와 실행 가능한 코드를 문서에 포함할때 사용하며 우리는 자바스크립트 코드로 블럭깨기를 구현할 것이기 때문에 사용해야 할 엘리먼트이다.
