처음부터 차근차근

프로젝트명 : Shoot a gift 제작 기간 : 2021년 12월 4일 ~ 12월 7일 Unity 2020.3.9 버전 이용 Oculus 사의 ‘Quest 2’라는 VR기기를 사용하여 만든 게임 양손을 이용한 플레이 가능 Oculus Air link를 통해 데스크톱 Unity와 연결하여 개발함 게임 설명 공중에 있는 선물 상자를 총으로 쏴서 맞추는 게임 오른쪽에 시작 버튼을 누르면 카운트 다운 뒤에 게임이 시작됨 테이블에 있는 총을 직접 들어서 조준을 한 다음 쏴야함 선물상자를 맞추면 10점이 쌓이고, 폭탄을 맞추면 -4점이 됨 시간이 다 되면 공중에 있는 오브젝트가 모두 사라지고 앞에 점수가 뜸 구현 기능 헤드 상하좌우로 돌아보기 기능 양손 애니메이션 오브젝트 grab 기능 플레이어 이동, 회전 플..

프로젝트명 : Kart Racing 제작 기간 : 2021-05-28 ~ 2021-05-30 Unity 2020.3.9 버전 이용 목표 지점까지 빨리 도착해야 하는 캐주얼 레이싱 게임 레이싱 게임으로 잘 알려진 를 모티브로 함 2021년 2학년 1학기 모바일 게임실무 수업에서 만든 게임 프로젝트 구현 기능 카운트 다운 현재 속도 출력 드리프트 부스터 부스터 정렬 경로 이탈 시 시작 지점으로 이동 골인 - Best score, Score 체크포인트 esc 메뉴(게임 다시 시작, 메인 메뉴로 이동) 실행 동영상 github https://github.com/soyoungkimm/Kart-Racing 카트 모델 및 애니메이션 출처 : https://kkamysgame.blogspot.com/2020/11/kk..

컴포넌트 파일 분리 컴포넌트를 만들어서 App.js 안에다 두면 복잡하고 유지보수하기 힘들다. 그래서 컴포넌트를 만들면 각각의 컴포넌트들을 파일로 따로 분리해둔다. 1. src / components 디렉토리를 새로 만든다. 이 안에다가 컴포넌트 파일을 모아둘 것이다. 2. components 파일 안에다 '컴포넌트명.js' 파일을 만든다. 그리고 안에다 코드를 작성한다. import React, {Component} from 'react'; // react랑 Component 임포트 class FooterTab extends Component{ render(){ return ( 제목 ); } } export default FooterTab; // 다른 파일에서 FooterRab을 가져다 쓸 수 있게 만..

반복문(for) vue에서는 반복문으로 for문을 쓴다. for문을 따로 선언하지 않고 태그안에다 끼워서 쓴다. export default { name: 'App', data() { return { animals : ['cat', 'dog', 'mouse'], } }, components: { HelloWorld } } {{ animal }} animals라는 배열을 animal이라는 변수에 하나씩 넣어 출력한다. animals자리에 배열이 아닌 object 자료형도 넣을 수 있다. key는 반복문을 사용할 때 꼭 써야한다.(안쓰면 에러남) key 컴퓨터가 반복문을 돌릴때 각각의 요소를 구분하기 위한 값이라고 보면된다. 그래서 key에다가는 유니크한 숫자같은 값을 넣어준다. 그래서 아래와 같이 사용한다...

Vue란 웹 애플리케이션을 개발할 때 사용하는 오픈 소스 자바스크립트 프레임워크이다. Vue 프로젝트 만들기 1. vue cli 설치 먼저 프로젝트를 모아놓을 디렉토리를 만들고 그 위치에서 아래의 명령을 친다. npm install -g @vue/cli vue cli 설치하는 명령 vue cli : vue 개발환경 세팅을 도와주는 프로그램 2. 프로젝트 생성 vue.cmd create 프로젝트명 프로젝트 생성하는 명령 그다음 vue3선택하고 enter키 누르기 프로젝트 구조와 Vue 실행 원리 App.vue : 메인 페이지라고 생각하기 App.vue html 코드는 에다 짜고 javascipt는 안에다 짜면 된다. css는 안에다 짜면 된다. 원리 App.vue에 있는 코드를 main.js가 index...

주의사항 App.js의 return ( ) 괄호 안에 하나의 만 들어갈 수 있다. 즉 return( ) 안에 있는 것은 하나의 태그로 묶여야 한다. 여러개의 div가 들어가면 안된다. ex) 여러개의 div를 그래도 쓰고싶거나 의미없는 div를 사용하기 싫으면 으로 감싸면 된다. 리액트 Component 문법 html을 나만의 한 단어 바꿔서 그 단어로 줄여서 쓸 수 있는 방법이다. 컴포넌트 안에 컴포넌트를 넣어서 만들 수 도 있다. 어떤것을 component로 만드는 것이 좋을까? -> 반복되는 html 덩어리들, 자주 변경되는 html UI들, 다른 페이지들 component의 단점 state 쓸 때 복잡해진다. component 만드는 법 1. import 코드와 export default App;..

react 프로젝트가 컴파일이 될 때마다 뜨는 warning이 있다. 터미널 창에서 계속 보이니까 눈에 거슬린다. 이 warning은 대부분 '변수를 만들었지만 사용하지 않았다~'등의 생겨도 기능상 문제가 없는 경고라서 터미널 창에서 안보이게만 하면된다. 이 warnig을 뜨지않게 하는 방법 App.js 코드 맨 위에다가 /* eslint-disable*/ 를 추가한다. 이렇게하면 더이상 waring이 뜨지 않는다!

JSX 문법 { 변수명 } { 함수명() } : 함수의 리턴값이 출력된다. { class명 } JSX에서 이미지 넣는 방법 상단에 이미지 import 코드 작성 import 이미지명 from '이미지 파일 경로' 코드 안에다 작성할 때 { }를 사용해서 이미지 경로 불러오기 꼭 이렇게는 안하고 src='이미지명.jpg' 이렇게 직접 넣어도 되는데 위처럼 쓰면 편해서 이 방법을 주로 사용한다. JSX에서 css 넣는 방법 css 인라인시트 style을 넣을 때는 오브젝트형식으로 넣어야한다. 그리고 font-size 처럼 '-'가 있는 것들은 camelCast기법으로 fontSize이렇게 써야한다. 구분자로 ;가 아닌 ,를 써야한다. style="{ { color : white, fontSize : 50px..