분류 전체보기(124)
-
[React-Native] 웹뷰(WebView)와 웹 콘텐츠 간의 통신
React Native에서 웹뷰(WebView)와 웹 콘텐츠 간의 통신은 주로 두 가지 방법을 통해 이루어집니다. JavaScript를 통한 메시지 전송 (postMessage): React Native의 WebView 컴포넌트는 웹 콘텐츠로 메시지를 보내고 웹 콘텐츠에서 메시지를 받을 수 있도록 postMessage 인터페이스를 제공합니다. URL 스킴을 통한 메시지 전송: 커스텀 URL 스킴을 사용하여 애플리케이션과 웹 콘텐츠 간에 통신할 수 있습니다. 이 방법은 웹 페이지가 특정 URL 패턴을 로드하려고 할 때 트리거됩니다. JavaScript를 통한 메시지 전송 (postMessage) 웹 페이지에서 postMessage를 사용하여 React Native로 메시지를 보내는 과정은 다음과 같습니다:..
2023.11.08 -
[ETC] 서브셋 폰트 경량화
서브셋 폰트(subset font) 글꼴(font)의 서브셋(subset)을 의미합니다. 즉, 문자 세트의 일부만을 포함하는 글꼴입니다. 웹에서 이를 사용하는 주된 이유는 성능 향상입니다. 전체 글꼴 대신 필요한 문자들만 포함한 서브셋을 사용함으로써, 파일 크기를 줄이고 페이지 로딩 시간을 단축시킬 수 있습니다. 예를 들어, 영문 웹사이트에서 한글 폰트를 사용할 필요가 없다면, 한글을 포함하지 않은 서브셋 글꼴을 사용하여 리소스를 절약할 수 있습니다. 마찬가지로, 한글 웹사이트에서도 필요한 한글 글자들만을 포함하는 서브셋을 만들어 사용할 수 있습니다. 서브셋 리스트 어떤 글자를 남기고 어떤 글자를 버리는 것이 좋을까? 자주 사용하는 것은 포함하고, 거의 사용하지 않는 글자를 삭제하는 게 바람직합니다. 일..
2023.11.08 -
[JS] 제네레이터
JavaScript에서의 제네레이터는 ECMAScript 6 (ES6)에서 도입된 기능으로, 이터러블(iterable) 프로토콜을 구현하는 함수입니다. JavaScript의 제네레이터 함수는 function* 키워드로 정의되며, yield 키워드를 사용하여 값을 반환하고 함수 실행을 일시 중지할 수 있습니다. 주요 특징 일시 중지와 재시작: 제네레이터는 실행 중인 상태를 저장하고 나중에 그 상태를 복원하여 계속 실행할 수 있습니다. yield 키워드: 제네레이터 함수 내에서 yield를 사용하여 값을 반환하고 실행을 일시 중지합니다. iterator 객체: 제네레이터 함수를 호출하면 이터레이터 객체가 반환되며, 이 객체의 next() 메서드를 사용하여 함수를 계속 실행하고 다음 yield 값까지 가져올 ..
2023.09.20 -
[NestJS] .CSV 파일을 JSON 형태로 변환하기
변환에 앞서 새프로젝트 구성을 마쳤다는 가정하에 진행 변환에 필요한 파일 업로드를 처리할 엔드포인트 컨트롤러 생성 app.controller.ts import { Controller, Post, UploadedFile, UseInterceptors, } from '@nestjs/common'; import { FileInterceptor } from '@nestjs/platform-express'; import { ExcelService } from './excel.service'; @Controller() export class AppController { constructor(private readonly excelService: ExcelService) {} @Post('/upload') // 데코..
2023.08.04 -
[ETC] -lock.json or .lock 파일은 뭘까?
npm install 또는 yarn install을 실행하면 각각 package-lock.json 파일 또는 yarn.lock 파일이 생성됩니다. 이 파일들은 프로젝트의 의존성에 대한 구체적인 정보를 제공합니다. package-lock.json 또는 yarn.lock 파일에는 프로젝트의 모든 의존성에 대한 정확한 버전, 패키지의 해시 체크섬, 패키지의 의존성 등의 세부 정보가 포함되어 있습니다. 또한, 이러한 lock 파일은 의존성 트리(dependency tree)를 재현하기 위해 사용됩니다. 예를 들어, 패키지 A가 패키지 B를 필요로하고, 패키지 B가 패키지 C를 필요로하는 경우, 이러한 관계가 lock 파일에 기록됩니다. 따라서 다른 환경에서 동일한 의존성 트리를 생성할 수 있게 됩니다. 이를 통..
2023.08.04 -
[JS] 다양한 연산자
산술 연산자(Arithmetic Operators): Addition (+): 두 피연산자를 더합니다. Subtraction (-): 첫 번째 피연산자에서 두 번째 피연산자를 뺍니다. Multiplication (*): 두 피연산자를 곱합니다. Division (/): 첫 번째 피연산자를 두 번째 피연산자로 나눕니다. Modulus (%): 첫 번째 피연산자를 두 번째 피연산자로 나눈 나머지를 반환합니다. 대입 연산자(Assignment Operators): =: 왼쪽 피연산자에 오른쪽 피연산자의 값을 할당합니다. +=, -=, *=, /=, %=: 각각 더하기, 빼기, 곱하기, 나누기, 나머지를 계산한 후 결과를 왼쪽 피연산자에 할당합니다. 비교 연산자(Comparison Operators): Equa..
2023.08.04