tree0505 님의 블로그

디자인이 상당히 어렵다. 전문 퍼블리셔를 빌려야 한다. 빌리지 않고. 깔끔한 디자인을 낼 수 있는 라이브러리다. 디테일하게 들어가면 퍼블리셔를 빌려야 한다. 00장_참고사이트※ 참고 사이트 ※ (1) 부트스트랩5 공식 홈페이지 https://getbootstrap.kr/docs/5.0/getting-started/introduction/(2) 학습 홈페이지 https://www.w3schools.com/bootstrap5/bootstrap_navs.php템플릿.html템플릿 적으면 라이브러리를 쓸 수 있게 하는거다. 부트스트랩 사이트에서 다운로드를 한거다. DOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport..

_index.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>_index.htmltitle> script src="_main.js" type="module">script>head>body> canvas id="myCanvas" width="1280" height="720">canvas>body>html>_main.jsimport { ManagerGame } from "./managerGame.js";function draw() { ctx.clearRect(0, 0, $canvas...

실제로 게임을 만들려면 매니저를 관리하는 매니저를 또 만들어야 한다. _index.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>_index.htmltitle> script src="_main.js" type="module">script>head>body> canvas id="myCanvas" width="1280" height="720">canvas>body>html>_main.jsimport { ManagerGame } from "./managerGame.js";function d..

_index.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>_index.htmltitle> script src="_main.js" type="module">script>head>body> canvas id="myCanvas" width="1280" height="720">canvas>body>html>_main.jsimport { ManagerGame } from "./managerGame.js";function draw() { ctx.clearRect(0, 0, $canvas...

04단계_셀렉트완성_index.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>_index.htmltitle> script src="_main.js" type="module">script>head>body> canvas id="myCanvas" width="1280" height="720">canvas>body>html>_main.jsimport { ManagerGame } from "./managerGame.js";function draw() { ctx.clearRect(0, 0..

주인공이 출전하기 게임으로 들어가기 전에 돈이 1만원이 있어서 자신을 업그레이드 하는것 _index.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>_index.htmltitle> script src="_main.js" type="module">script>head>body> canvas id="myCanvas" width="1280" height="720">canvas>body>html> _main.jsimport { ManagerGame } from "./managerGame.js"..

02단계_페이지이동1단계는 화면을 일일이 수동으로 틀었다면 2단계는 기능만 추가한것 화면 이동을 버튼으로 한것 _index.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>_index.htmltitle> script src="_main.js" type="module">script>head>body> canvas id="myCanvas" width="1280" height="720">canvas>body>html>_main.jsimport { ManagerGame } from "./man..

E02_애니메이션01단계_타이틀보통 인터넷 강의에서는 한페이지에 다 때려 박는다 ㅋ 알아볼 수도 없게. 한페이지에 다 넣으면 구조를 기능을 간소하게 할 수 밖에 없다. 애니메이션만 파악해도 머리가 개운해진다. 다른 페이지에서 함수를 실행하고 싶으면 해야한다. let ctx = ManagerGame.getInstance().getCtx();export class ManagerImage페이지 않에서. 다른 페이지 함수를 실행하고 싶으니까. export를 해놓으면 다른 곳에서 import를 가능하다.import는 다른 클래스를 사용하기 위해서.export안에 클래스 안에 변수는 this.를 붙여서 사용한다.이제는 let을 안쓰고 this.를 쓴다.let은 한번쓰고 버린다. let은 중괄호에서 사라지니까..

05_게임_오목omok.htmlDOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta http-equiv="X-UA-Compatible" content="IE=edge"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>Documenttitle> style> #game{ width: 100%; } #game .layout{ margin: 0 auto; text-align: center; } #game .title{ ..

04_캔버스충돌처리_01_원과점충돌물리가 많이 있지만 그중 가장 기초적인 충돌충돌 원과 점 충돌 원과 원 충돌 원과 네모 충돌 네모와 네모 충돌 원과 점 충돌 내가 클릭할 수 있느냐. 원이 있으면 클릭할 수 있나 여기도 삼각함수가 들어간다. 원안에 점이 있다. 중심점과 마우스가 있다.마우스가 밖에 있나. 마우스가 원 안에 있나. 점이어떻게 측정을 하나. 점과 점을 삼각형을 그리면 된다. 점과 점 사이의 길이를 알면 된다. 이 길이가 원의 반지름 보다 작으면 원 안에 있는거고. 길이가 원의 반지름 보다 크면 원 밖에 있는거다. 대각선의 길이를 어떻게 구하나. X(제곱2) Y(제곱2) Z(제곱2) 직각삼각형인 경우 가로와 세로는 알고 있는데. 대각선을 모른다. 어제 아날로그 시계는 뭐냐? 어제는 선과 각을..