GDG on Campus Sookmyung

Context API context를 이용하면 단계마다 일일이 props 를 넘겨주지 않고도 컴포넌트 트리 전체에 데이터를 제공할 수 있습니다. 언제 context를 써야 할까 context는 React 컴포넌트 트리 안에서 전역적(global)이라고 볼 수 있는 데이터를 공유할 수 있도록 고안된 방법입니다. 그러한 데이터로는 현재 로그인한 유저, 테마, 선호하는 언어 등이 있습니다. 예를 들어, 아래의 코드는 버튼 컴포넌트를 꾸미기 위해 테마(theme) props를 명시적으로 넘겨주고 있습니다. class App extends React.Component { render() { return ; } } function Toolbar(props) { // Toolbar 컴포넌트는 불필요한 테마 prop를..

React-query 란? react-query는 리액트 애플리케이션에서 서버 상태 가져오기, 캐싱, 동기화 및 업데이트를 보다 쉽게 다룰 수 있도록 도와주며 클라이언트 상태와 서버 상태를 명확히 구분하기 위해서 만들어진 라이브러리 react-query 상태 ✅ fresh : 새롭게 추가된 쿼리 & 만료되지 않은 쿼리 ➜ 컴포넌트가 마운트, 업데이트되어도 데이터 재요청 ❌ ✅ fetching : 요청 중인 쿼리 ✅ stale : 만료된 쿼리 ➜ 컴포넌트가 마운트, 업데이트되면 데이터 재요청 ⭕️ ✅ inactive : 비활성화된 쿼리 ➜ 특정 시간이 지나면 가비지 컬렉터에 의해 제거 react-query 장점 캐싱 get을 한 데이터에 대해 update를 하면 자동으로 get을 다시 수행한다. (예를 들..

볼류메트릭 클라우드 배치하기 언리얼 엔진의 우측 상단 -> 세팅 -> 플러그인 -> 추가 기능을 제작, 외부에서 얻어서 확장이 가능 Volumetrics를 활성화 -> 언리얼 에디터를 재시작(+ 저장) 창 -> 환경 라이트 믹서 -> 볼드매트릭클라우드 입체적인 구름이 배치된다 구름의 모양과 위치 조절 콘텐츠 브라우저 -> 세팅 -> 엔진콘텐츠 표시, 플러그인 콘텐츠 표시를 활성화한다 콘텐츠 브라우저의 엔진 -> 플러그인스 폴더로 이동한다 스크롤을 쭉 내려서 Volumetrics 폴더로 이동한다 Content / Tools 볼류메트릭 클라우드의 디테일 패널 레이어 하단 고도 -> 구름의 높낮이 설정 가능 클라우드 머티리얼 -> 외형을 바꿀 수 있다 content폴더 -> sky폴더 -> meterials폴..

폴리지모드 : 식물에만 해당되는 것이 아니라 여러 스태틱 매시를 설치할 때 모두 사용 가능(바닥을 만들 때에도 사용할 수 있다) 크기와 밀도, 브러시 크기를 조절하여 자연스럽게 만들 수 있다 라이팅포함 -> 여러 모드로 바꿀 수 있다(나나이트 시각화 -> 트라이앵글로 바꾸는 경우 수많은 폴리곤을 확인할 수 있다 like 노이즈) 텍스처 최적화 모든 에셋을 나나이트로 다운로드 받은 경우 너무 많은 폴리곤과 텍스쳐메모리경고, 그래픽메모리 경고가 나타날 수 있다 텍스쳐를 수정한다 텍스처 에셋을 더블클릭 -> 디테일 패널의 레벨 오브 디테일의 LOD바이어스를 0 -> 1로 수정한다 임포트됨은 그대로지만 표시, 최대 인게임이 줄어든 것을 확인할 수 있다 LOD바이어스를 올릴 때마다 텍스처의 해상도를 낮출 수 있다..

퀵셀 메가스캔 에셋 퀵셀 브릿지 콘텐츠 브라우저 Nanite(나나이트) : 최고 고사양, 용량을 많이 차지할 수 있음 아이콘 -> preferences 의 library path에 저장 액터 확대 보기 : 액터 선택 + F 3DAssets Props : 소품으로 사용할 수 있는 에셋들이 존재 원하는 분류만 찾아서 빠르게 사용할 수 있음 Natere : 자연을 주제로 한 것들 확인 가능 Collections : 주제, 테마에 맞춰서 준비되어 있음 Shift버튼을 이용해 원하는 에셋들을 모두 다운로드할 수 있음 만약 나나이트로 다운로드 받지 않았다면 콘텐츠 브라우저에서 스태틱매쉬를 우클릭 -> 나나이트 -> 활성화가 필요하다 콘텐츠 브라우저에서 스태틱 매쉬를 한번에 보는 방법 : 필터를 이용한다 현재 폴더 ..

정렬 데이터를 특정한 기준에 따라 순서대로 나열하는 것 종류: 선택 정렬, 삽입 정렬, 퀵 정렬, 계수 정렬 이진 탐색(Binary Search)의 전처리 과정 리스트 뒤집기(reverse): 시간 복잡도 O(N) 선택 정렬(Selection Sort) 매번 가장 작은 데이터를 선택하는 알고리즘 가장 작은 데이터를 선택해 맨 앞에 있는 데이터와 교환 정렬이 완료된 곳은 제외하고, 나머지 부분에서 1번 과정 수행 (N-1번 반복) 마지막 데이터는 가만히 놔두어도 정렬 완료 for i in range(len(array)): min_index = i # 가장 작은 원소의 인덱스 for j in range(i+1, len(array)): if array[min_index] > array[j]: min_index..

Search Algorithm 탐색 == 많은 데이터 중 원하는 데이터만 찾아내는 과정 대표적인 그래프 탐색 알고리즘 == DFS & BFS 자주 나오는 유형 Stack FILO : 먼저 입력되는 데이터가 나중에 나감 입구와 출구가 동일한 형태로 시각화 가능 ex)상자 쌓기 list = [] 삽입 : 맨 마지막에 넣기 append(x) → O(1) 삭제 : 맨 마지막에 있는 원소 삭제 pop() → O(1) Queue FIFO : 먼저 들어온 데이터가 먼저 나감 입구와 출구가 모두 뚫린 터널과 같은 형태로 시각화 가능 from collections import deque → 파이썬에서는 deque 라이브러리 사용 queue = deque() 삽입 : append() → O(1) 삭제 : popleft()..

뷰포트 실제 실행되는 공간, 오브젝트, 게임 화면이 될 공간 : 뷰포트 뷰포트 조작 방법 마우스 우클릭 -> 화면 회전 마우스 우클릭 + wasdqe -> 화면 움직이기 마우스 좌클릭 -> 액터 선택 액터 : 오브젝트 화살표 : 기즈모 기즈모의 빨간 축 : x축 기즈모의 파란 축 : y축 기즈모의 초록 축 : z축 기즈모 모드 및 단축키 액터 클릭 + e -> 회전모드 액터 클릭 + w -> 이동모드 액터 클릭 + r -> 스케일 모드 비율을 유지하면서 크기를 변화시키고 싶은 경우 : 기즈모 가운데의 하얀색을 이용 : 전체 선택의 의미 두 축 사이의 연결된 선 : 두 축을 한번에 변화시킬 수 있음 뚝뚝 끊기는 느낌 -> 스냅 기능이 켜져 있기 때문. 액터의 배치 편의성을 올려준다. 오른쪽 상단의 스냅 설..

클래스 캡슐화 객체의 실제 구현을 외부로부터 감추는 방식으로, 객체에서 실제 데이터를 조작하거나 구현하는 부분을 기본적으로 private으로 하고, 외부에 노출해야 하는 것만 public으로 하는 것이다. 클래스를 개발할 때는 기본적으로 구현을 감추고, 외부 객체와 상호작용하는 부분만 노출한다. 외부의 잘못된 사용을 방지한다. public class Stack{ private int topOfStack \= 0; // private으로 설정 public int size() { return topOfSize; // Stack 클래스의 원소 topOfStack 알고 싶다면 size() 메소드로! } } 👉🏻 캡슐화의 핵심은 모든 구현을 외부 세계에 알리는 것이 아니라, 외부 세계에서 정말 알아야 할 것들만 ..

8장. 경계 목표 : 소프트웨어 경계를 깔끔하게 처리하는 기법을 살펴보기 1. 경계란 우리 코드와 외부 코드의 경계를 의미함 외부 코드 : 외부 시스템과 호출하거나 단순히 외부에서 만들어진 코드 우리 코드와 외부 코드를 깔끔하게 통합시키기 위해 경계를 잘 지어야 함 2. 경계 짓기(1) - 우리 코드를 보호하기 캡술화 객체의 실제 구현을 외부로부터 감춤 (tmi 하지 않아야 한다!) 캡슐화의 장점 캡슐화로 외부 코드를 감추면 private하게 데이터 관리 가능 → 원하는 기능만 공개할 수 있다 캡슐화 예제 public class Sensors { private Map Sensors = new HashMap(); public Sensor getById(String id) { return (Sensor) s..