분류 전체보기227 HTML/CSS/JS로 게임 만들기 3 https://conquer-it.tistory.com/131?category=1065783 HTML/CSS/JS로 게임 만들기 2 7. 총알 생성을 위한 스페이스바 이벤트 생성하기 스페이스바가 눌렸을 때 총알이 발사 되고 싶다면 어떻게 해야할까? 우선, 우리가 만들어 놓은 keyup 이벤트에 스페이스바를 추가하면 된다. (keydown 이벤트에 총알발사를 추가하게 되면 난이도가 굉장히 쉬워지기 때문에 keyup에 적용) //방향키 이벤트 let keysDown = {}; const setupKeyboardListener=()=>{ document.addEventListener("keydown",(event)=>{ keysDown[event.key] = true; }); document.addEventL.. 2022. 9. 16. [IoT] 사물인터넷(IoT)과 관련된 다양한 용어 사물인터넷이라는 개념은 오래 전부터 사용되고 있었다. 1991년 Xerox 팔로알토 연구센터의 마크와이저 박사는 21세기 컴퓨터에 관한 글에서 유비쿼터스 컴퓨팅이라는 개념을 처름 소개했다. 마크와이저 박사의 21세기 컴퓨터에 관한 글 일부 - The most profound technologies are those that disappear. They weave themselves into the fabric of everyday life until they are indistinguishable from it. (가장 심오한 기술은 구분되지 않을 정도로 일상생활로 비집고 들어간 것이다.) * 가장 심오한 기술인 유비쿼터스 컴퓨팅의 개념은 다양한 디바이스들 사이의 상호작용 속에서 나타난다고 강조하고 있다.. 2022. 9. 15. [WEB] HTML/CSS/JS로 게임 만들기 2 https://conquer-it.tistory.com/130 HTML/CSS/JS로 게임 만들기1 5. 방향키에 이벤트 주기 우선 방향키를 눌렀을 때 우주선이 이동하기 위해서는 방향키에 이벤트를 주어야 한다. 그렇기 때문에 함수를 만들어 키보드 이벤트를 줘 보자. const setupKeyboardListener=()=>{ document.addEventListener("keydown",(event)=>{ console.log("어떤 키가 눌렸나",event.key) }); } 이벤트리스너에 키보드로 움직이는 것이다 보니 click이 아니라 keydown 이벤트를 주었다. 그 후 잘 동작하는지 보기 위해 console을 해 주었다. (잘 나오고 있다.) 우리가 누른 값이 저장이 되어야 우주선이 움직일 .. 2022. 9. 15. [WEB] HTML/CSS/JS로 게임 만들기 1 오늘은 HTML / CSS / JS로 게임을 만들어 볼 것이다. 게임은 어렸을 때 많이 했던 갤러그이다. 이 게임은 적군이 아래로 다가오는데 다가오는 적군에 총을 쏴서 없애는 게임이다. 물론 위 게임처럼 완벽하게 만들 수는 없겠지만 최대한 비슷하게 만들어볼 예정이다. 1. 캔버스 세팅하기 JS에서 캔버스를 생성해 주어서 게임을 진행할 화면을 세팅해줘야 한다. canvas(캔버스) - HTML문서 내부에 그림을 그릴 수 있는 일종의 컨테이너 요소이다. JS를 통해 애니메이션과 이벤트를 처리할 수 있다. //캔버스 세팅 let canvas = document.createElement("canvas"); let ctx = canvas.getContext("2d"); // 2d로 보여줄 것이다. canvas.w.. 2022. 9. 13. 이전 1 ··· 22 23 24 25 26 27 28 ··· 57 다음
