분류 전체보기 검색 결과

해당 글 777건

Gamepad API와, 게임 클라이언트 개발에서 웹개발의 역할

Gamepad API 자체는 성의없다고 할 정도로 너무... 적습니다. 어쨌든 게임 개발에서 웹이 차지하고 있는 이유를 공부해보았습니다. 게임에서 로비(그러니까, 게임 일시 정지나 캐시샵 같은) 관련 작업은 html/css/js 스택으로 구성하는 일이 꽤나 있다. 바닐라 js는 아니고, angular나 react와 같인 프론트 프레임웤도 사용하고 상태 관리인 redux까지 합쳐서 웹 스택을 그대로 가져간다. 하긴, 어차피 빌드하면 다 js인데 ㅋㅋ 그리고 이 웹을 s3에 올리던지, 그냥 게임 내에서 임베드해서 웹페이지를 가져오던지 한다. 이 로비에서 이루어진 작업은 또 서버와 통신하는 등의 작업을 수행한다. 로비에서 뭐 캐쉬 아이템 구매를 했다던지, 로그인을 했다던지 등... 게임에서 어케 웹 UI를 올..
웹 전반, 브라우저/Web API 2021. 4. 28. 21:42

이미지 서비스를 위한 리사이징 플로우 탐구

과거에 이미지 서비스를 구현했을 때는 multer-s3-transform을 통해서, 이미지를 sharp로 리사이징한 후 s3에 저장해서 cloudfront를 붙여 서빙하곤 했다. 이 방법이 크게 문제가 되는 것은 아니지만, 조금 더 세련되고 간편한 방법이 없을까 싶어서 방법을 탐구해보았다. 1. 일반적인 이미지 서비스를 위한 플로우 (미리 리사이징해서 서빙하기) 이미지 변환용 ec2 서버를 한대 돌려서, 업로드 되면 SQS 메세지를 통해 해당 이미지를 리사이징하는 방법입니다. 아마존 웹 서비스를 다루는 기술의 pyrasis 님의 실습 부분을 참고하였습니다. s3에 일어난 이벤트들을 리스닝하지 못해서 SQS를 사용하는 것이 어쩐지 복잡해보이네요. 람다를 활용해 특정 이벤트를 감지하여 작동시키는 것이 좋아보..
Ops, Infra, etc/⚡ serverless 2021. 4. 27. 03:33

Dependency Injection(의존성 주입) in Typescript

Dependency Injection (DI)? Nest를 다루다 보면 'Dependency Injection'(DI)가 참 많이 나온다. 아니, Nest에서의 핵심이라고 하는 편이 맞을 것 같다. DI는 고유한 것이 아니라 JAVA spring, daggar 등 다양한 언어, 프레임워크에서 사용되는 패턴이다. js가 OOP에 적합한 언어가 아니라는 인식이 있어서 DI는 외면당해왔는데, 견고한 node 프로젝트를 위해서는 DI를 사용하는 편이 좋다고 한다. - 견고한 node 프로젝트 설계하기 참고 '의존성 주입'이란 용어를 짚어보자. 의존성 : 어떤 함수, 클래스 등이 내부에 다른 함수, 클래스를 사용함 주입 : 어떤 함수, 클래스 등이 내부에 사용하는 다른 함수, 클래스를 내부에서 생성하는 것이 아니..
Programming Language/🟦 Typescript 2021. 4. 27. 00:26

intelliJ 설치 및 세팅

openJDK 설치 https://darrengwon.tistory.com/819?category=910003 openJDK 설치, JVM, JIT 컴파일 방식, hello world openJDK 설치 jdk (java development kit) 설치 후 설치된 경로에 들어가 java.exe, javac.exe 가 있는 경로를 환경 변수에 넣어주자. oracleJDK보다 openJDK를 주로 사용한다. 왜? 돈이 없으니까... JDK : java.. darrengwon.tistory.com 처음 접근하면 아래와 같다. [New Project]를 눌러 프로젝트를 생성하자. Kotlin 프로젝트를 기준으로, Kotlin을 설정한 후, Project이름을 정하고, 원하는 템플릿을 설정합니다. 우선 세팅 ..
미분류/Tip 2021. 4. 25. 03:38

PCI DSS

최근, Stripe가 직접적으로 카드 정보를 다루지 않고 클라이언트 내에서 자체적으로 토큰을 생성하는 등, 한국에 있는 결제 모듈과는 다른 방식을 채택을 하고 있다고도하고, 좀 더 보안적이라고 해서 PCI 컴플라이언스에 더 잘 충족한다는 말들 들었다. 단순히 결제 모듈 받아 쓰는 입장에선 알 필요가 없다만, 궁금해서 알아보기로 했다. PCI DSS가 뭔데 ? 닷컴 버블 때, 웹으로 어떻게든 돈을 벌어보려고 카드 정보를 받았는데 이 때의 분위기가 HTML 개발자도 고액으로 데려가던 분위기라, 사용자의 보안같은 건 신경도 안 쓰던 때였다. 신용 카드사는 이를 막기 위해서 제각기 나름대로 보안책을 만들어서 웹 마스터들에게 요구했다. 당연히 신용 카드가 한 둘이겠는가, 도량형 통일 하듯 기준을 통일할 필요가 생..
미분류/💰 Import, fin-tech 2021. 4. 23. 22:17

serverless하게 추천 시스템을 구현해보자 - 이론편

* aws summit에서 vingle의 이상현님이 진행하신 발표를 참고하였다 www.youtube.com/watch?v=-LZFJ6BpplE&ab_channel=AmazonWebServicesKorea 우선, 추천 알고리즘은 아주 다양하며, 많은 경우 이들을 중첩시켜 사용하는 하이브리드 방식으로 사용한다고들 한다. 한 알고리즘을 통해 얻은 점수와 다른 알고리즘을 통해 얻은 점수를 적절하게 다시 평균을 내는 방식으로 말이다. (당연히 산술 평균은 아니겠고, 어느 정도 가중치를 다르게 줄 것 같다.) 여튼, 추천 방식은 다음과 같이 나뉘어 진다고 한다. (1) 장바구니 알고리즘(연관성 규칙) A라는 행동을 할 때 B라는 행동을 할 것이다. 장바구니 알고리즘은 여타 다른 알고리즘보다 간단한 편이기도하고, 효..
Ops, Infra, etc/⚡ serverless 2021. 4. 22. 23:54

js의 Number, BigInt 타입과 정밀한 숫자 계산에 대하여

js는 Int, long, float, double 이런 타입이 존재하지 않고 상남자스럽게 "number" 타입 하나만 존재한다. 최근에, 돈이 오고가는 프로젝트를 node로 개발해볼까 싶어서 한 번 짚어보았다. - object wrapping var, 일반 var 이건 java할 때도 살펴보았으니 설명은 생략. object로 wrapping 된 녀석은 object 타입이며 자기 자신과 비교할 때만 true를 반환합니다. object라니깐요? const a = new Number("123"); // create a wrapper object const b = Number("123"); // 단순 primitive 값 반환 const c = 123; // 단순 primitive 값 반환 console.lo..
Programming Language/🟨 Javascript 2021. 4. 20. 08:50

deno 설치 및 denon 세팅

deno.land/ Deno - A secure runtime for JavaScript and TypeScript Deno is a simple, modern and secure runtime for JavaScript and TypeScript that uses V8 and is built in Rust. deno.land 우리 제발 딱 deno 메인 페이지에 나와있는 1장만 읽어봅시다. deno를 이해하는데 도움됩니다. 기존에 node에서 간단히 js, ts를 가지고 놀기 위한 환경을 아래와 같이 구성해서 사용해왔다. nodemon 굴리고, lint에 prettier를 붙여서 포매팅하였다. ts는 ts-node로 굴리고, js는 babel로 트랜스파일하여 es6+문법을 사용 가능하게 했고, 브라우저..
Node, Nest, Deno/🦕 Deno 2021. 4. 19. 19:18

Reflect, Proxy (1) : Reflective 프로그래밍을 위한 표준 내장 객체들

Reflect? reflecting이란 코드가 구동시(런타임) 자기 자신을 검사, 수정할 수 있는 능력을 말한다. 위키피디아에서 확인해보면, 언어별 reflect 방법을 소개한 것을 확인할 수 있다. Reflect라는 영단어의 본래 의미를 생각해본다면, "자기 자신을 반추하다" 정도로 이해할 수 있을 것 같다. reflection programming is the ability of a process to examine, introspect, and modify its own structure and behavior.[ 출처 : https://en.wikipedia.org/wiki/Reflective_programming vanilla javascript에서도 Reflect는 기본 내장 객체로 존재한다...
Programming Language/🟨 Javascript (Core) 2021. 4. 16. 00:35

cloudwatch를 활용한 대시보드 만들기

음... 대시보드를 구성할 수 있단다 해보자. 대시보드를 생성하면, 생성할 위젯을 선택한 다음, 구성하면 된다. 생각보다 간단하다! 텍스트 (MarkDown 문법 사용) 가장 쉽게 할 수 있는 건 "텍스트"이다. MarkDown 문법을 그대로 사용할 수 있다. 하나 다른 것이 있다면 버튼 생성인데, [button:원하는 이름] 꼴로 버튼을 생성한다. primary 속성을 줘서 색을 입히고 싶다면 [button:primary:원하는 이름] 꼴로 생성하면 된다. 아래처럼 작성하고, 대쉬보드에 표현됩니다. 편함 ㅎ 번호, 행, 누적 행 등 그 외의 위젯들. 생성하는 방법 다 비슷해서 묶어서 설명하겠다. 여러 지표들을 단순히 표현해준다. 주의점으로는 결제 관련 수치는 us-east-1 리전으로 이동하여 찾도록하..
AWS/☁️ AWS 2021. 4. 14. 00:59