blob: b77f74414e408102e5250806dba3543f8d4ec13f (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
---
title: Tutorials
slug: Games/Tutorials
tags:
- Canvas
- Games
- JavaScript
- NeedsTranslation
- TopicStub
- Web
- Workflows
- 게임
- 자바스크립트
- 캔버스
translation_of: Games/Tutorials
---
<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/ko/docs/Games")}}</div>
<p>이 페이지에는 다양한 형태의 웹 게임을 효과적으로 만들기 위해 중요한 여러가지 튜토리얼들을 포함하고 있습니다.</p>
<dl>
<dt><a href="/ko/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript">순수 JavaScript를 사용한 2D 게임</a></dt>
<dd>이 튜토리얼을 통해 여러분은 순수 자바스크립트를 활용하여 간단한 게임을 만들어볼 수 있습니다. 렌더링, 이미지 그리기, 충돌 감지하기, 동작 원리, 승리/패배 구성하기 등 게임을 만들기 위해 필요한 기본적인 요소들을 구현하기 위해 {{htmlelement("canvas")}} 사용법을 배우게 될 것입니다.</dd>
<dt><a href="/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">Phaser를 사용한 2D 게임</a></dt>
<dd>이 튜토리얼을 통해 여러분은 위 튜토리얼과 똑같은 게임을 만들어 볼 수 있을 것 입니다. 다만 이번에는 HTML5 게임 프레임워크인 <a class="external external-icon" href="http://phaser.io/">Phaser</a>를 이용하여 만들어 볼 것입니다. 게임을 만들기 위해 필요한 기본적인 요소들을 프레임워크를 활용하여 만드는 방법을 배우게 될 것입니다.</dd>
<dt><a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">기기 수직/수평 기능을 이용한 2D 주사위 게임</a></dt>
<dd>이 튜토리얼에서는 {{htmlelement("canvas")}} 가 제공하는 충돌 감지, 모양 놓기같은 기본적인 기능을 포함한 HTML5 2D 주사위 게임을 만들어 볼 것입니다. <a href="/ko/Apps/Build/gather_and_modify_data/responding_to_device_orientation_changes">Device Orientation</a> 기능과 <a href="/ko/docs/Web/Guide/API/Vibration">Vibration</a><strong> </strong>기능을 활용한 모바일 게임이며 the <a href="http://phaser.io/">Phaser</a>프레임워크로 만들 것입니다.</dd>
</dl>
|
