오히려 좋아..

상황이 나쁘게만 흘러가는 것 같을 때 외쳐보자.. .

궁금한 마음으로 포트폴리오 보기

분류 전체보기 245

[HTML] 유튜브 iframe 전체화면으로 만들기

유튜브링크를 긁어 iframe에 넣으면 아래처럼 종종 전체화면이 되지 않는 문제가 있다. 온갖 방법을 다 시도해봤는데 안되서 문제 해결한 과정을 정리해둔다. 전체화면을 구현할 수 있는 방법은 먼저 iframe 자체에서 구현해주는 기능을 사용해도 되고 만약 구현되어 있지 않다면 JS(Javascript)를 이용해 구현하면된다. 오늘은 긁어온 링크가 유튜브 처럼 자체 전체화면을 지원한다는 가정하에 작업을 진행하도록 하겠다. 먼저 iframe이 아마 아래처럼 생겼을 것이다. HTML 삽입 미리보기할 수 없는 소스 이제 iframe에 하나만 추가해주면된다. allowfullscreen 이다! 자 이제 추가하고 한번 확인해보자! HTML 삽입 미리보기할 수 없는 소스 다들 나처럼 고생하지 않았으면 한다! 도움이 ..

[typescript] 날짜 String 타입으로 만들기

타입스크립트에서는 많은 것들을 타입으로 만들어서 사용한다. 개인적인 생각으로는 일반 정적 타입 언어들이 컴파일 에러로 잡아주는 부분을 동적 타입언어에서 타입으로 만들었다는 생각이든다. 어쨌든 타입스크립트는 타입 에러를 통해 동적타입 언어의 단점을 어느정도 극복했다고 생각한다. 편하고 빠르고 재밌다. 오늘은 별걸 다 타입으로 만드는 타입 스크립트에서 아래와 같은 date string을 타입으로 만드는 방법에 대해 알아보겠다. '19990201' '20210226' 전체 과정은 마치 레고를 만드는 것처럼 만들면 된다. 먼저 숫자 타입을 만들어준다. const type digit = 1|2|3|4|5|6|7|8|9|0; 1. Year 타입 연도는 아래와 같이 표기 가능하다. 개인용 컴퓨터가 처음 등장했을 때가..

[MongoDB] 스키마 디자인 패턴 1: 버킷 패턴(Bucket Pattern)

https://www.mongodb.com/blog/post/building-with-patterns-the-bucket-pattern Building with Patterns: The Bucket Pattern | MongoDB Blog Streamlining your Travel Needs with Lambus and MongoDB Traveling can be a hassle. Ok, that’s putting it mildly (to say the least). But what if traveling didn’t have to be so difficult? Lambus is the all-in-one travel platform that is designed to put yo www.mongodb..

Technology/DB 2022.02.24

[mongoose] 인덱스 생성 그런데 이제 NestJS에서

Mongodb index 생성 방법 정리해둔다. NestJS Mongoose 설정 방법은 아래 글을 참조하길 바란다. https://cocook.tistory.com/183 [NestJS] NestJS에서 MongoDB 연결하기 2020.12.12 - [Language/Javascript] - [Node.js] MongoDB Mac에서 brew로 다운받고 Node.js로 연결하기 [Node.js] MongoDB Mac에서 brew로 다운받고 Node.js로 연결하기 Node.js + Mongodb 조합을 많이 사용한다.. cocook.tistory.com 아래처럼 생긴 모델일 때 인덱스 생성하기 @Schema() export class Friend { @Prop() category: string @Pro..

[Javascript] 실행시간 측정 방법

파이썬에서는 그냥 현재 시간에서 실행후 시간 빼주는 방법으로 구현했는데 JS는 이런 것도 된다. console.time('test') somethingFunction() console.timeEnd('test') 아래 처럼도 가능하다. console.time('test') const value1 = somethingFunction1() console.timeLog('test', value1) // somethingFunction1의 실행시간 반환 const value2= somethingFunction2() console.timeLog('test', value2) // somethingFunction2의 실행 시간 반환 console.timeEnd('test')

[NestJS] AWS Elastic BeanStalk 배포

NestJS를 배포하면서 꽤 많은 문제를 겪었다. 이때 찾아본 문서를 정리해둔다. 먼저 ELB(Elastic Beanstalk)에서 NodeJS용 이미지는 nginx와 같이 배포되었을 때 로컬의 8081포트와 80포트를 연결해준다. 무슨 말이냐면 80포드(일반적으로 http에서 사용하는 포트)에서 들어온 요청을 그대로 로컬의 8081포트에 연결해준다는 뜻이다. 그런데 NestJS는 기본포트가 3000이다. 따라서 포트를 변경해줘야하는데 다양한 방법으로 변경할 수 있다. 나는 주로 아래와 같은 방법을 선호한다. 환경변수로 PORT값을 설정해주는 방법이다. import { NestFactory } from "@nestjs/core"; import { AppModule } from "app.module"; a..

Typescript에서 Enum을 사용하지 않는게 좋은 이유

https://engineering.linecorp.com/ko/blog/typescript-enum-tree-shaking/ 위 문서를 정리한 내용입니다. 한줄 정리 : Tree-shaking 측면에서 좋지않으니 Enum 대신 UnionType을 사용하도록 하자! 타입 스크립트 Enum 타입스크립트에서 enum은 아래와 같이 사용가능함 enum Color ( RED="red", GREEN="greee", BLUE="blue" ) console.log(Color.Red) // "red" 위 코드는 자바스크립트로 트랜스파일 될 때 아래와 같은 형식으로 변경된다. export var Color; (function (Color){ Color["RED"] = "red"; Color["Blue"] = "blue"..