StudyYeong

Singleton pattern은 생성자가 여러 차례 호출되더라도 실제 생성되는 객체는 하나이고 최초 생성 이후에 호출된 생성자는 최초 생성자가 생성한 객체를 리턴하는 디자인 유형이다. 주로 공통된 객체를 여러개 생성해 사용하는 Database Connection Pool과 같은 상황에서 많이 사용된다. 몇 가지 단점도 있는 패턴이다. Single responsibility 원칙을 저해한다. 두 가지 문제를 한 번에 해결해버리는 패턴이다. 한 가지는, ‘하나의 클래스는 하나의 인스턴스만 가질 것’ 다른 문제는 ‘단 하나의 클래스 인스턴스로 글로벌 액세스 포인트를 제공할 것’이다. 유닛 테스트를 작성하기 힘들어진다. 글로벌 변수의 현재 상태는 실행 순서에 따라 값이 달라지기 때문이다. 또한 글로벌 인스턴스이기 때문에 테스트 중 다른 컴포넌트가 상태를 변화시킬 수 있어 디버깅이 어려워질 수 있다. 자바스크립트에서 singleton pattern을 구현하는 방법은 여러가지가...

AWS Lambda 테스트 코드를 작성한다. 나는 serverless 프레임워크 위에서 작업을 진행하고 있다. SQS 테스트serverless 문서에 따라 ElasticMQ를 사용했다. ElasticMQ는 Amazon SQS와 호환 가능한 메시지 큐 시스템이다. Amazon SQS를 테스트 하고 싶을때도 많이 사용된다고 한다.

테스트를 위해 local DynamoDB를 serverless에 설치하려는데 에러가 발생했다. 1sls dynamodb install 설치 명령어를 입력하면 아래 에러가 발생하며 설치가 실행되지 않았다. Error: Error getting DynamoDb local latest tar.gz location undefined: 403 검색해보니 이미 많은 사람들이 겪고있는 문제였다. (Error getting DynamoDb local latest tar.gz location undefined: 403) 공식 해결법은 아직 없는 것 같고 라이브러리 코드를 조금 수정해서 해결할 수 있었다. 해결법node_modules/dynamodb-localhost/dynamodb/config.json 파일을 열어 download_url을 https://s3.us-west-2.amazonaws.com/dynamodb-local/dynamodb_local_latest.tar.gz로...

React Native로 개발한 앱을 여러번의 수정을 거쳐 빌드를 마치고 앱 스토어 심사를 기다리고 있다. 순탄하게 흘러갔던 과정이 단 하나도 없었던 것 같아 기록을 남겨놓으려고 한다. 빌드iOSiOS는 XCode 사용법이 익숙치 않아 초반에 어려움을 느꼈으나 한 번만 세팅만 잘 맞춰놓으면 그 뒤로 문제가 발생한 적은 없었던 것 같다. ‘Product > Scheme’ 설정에서 Build Configuration을 Release로 맞추고 ‘Product > Archive’를 눌러 실행하면 production 버전의 빌드가 시작된다. 정상적으로 빌드가 완료되면 Archive 히스토리와 함께 새로운 창이 뜬다. 배포할 버전을 선택하고 Distribute App 버튼을 누르면 배포가 진행된다. 앱 배포 및 TestFlight 기능을 사용하기 위해 App Store Connect를 선택했다. 다음 옵션도 대부분 App Store Connect에 관리를 위임하도록...

React에서 자식 컴포넌트에 ref를 전달하려고 하면 오류가 발생한다. 123456789101112import { useRef, useEffect } from 'react'export function Parent() { const elementRef = useRef() useEffect(() => { // Does not work! console.log(elementRef.current) // logs undefined }, []) return <Child ref={elementRef} /> // assign the ref}function Child({ ref }) { // a new component return <div ref={ref}>Hello,...

클로저란 함수의 레퍼런스와 함수를 둘러싼 state, 즉 lexical 환경을 합쳐서 부르는 말이다. 클로저는 내부 함수에서 외부 함수 scope에 접근할 수 있도록 해준다. JavaScript에서 클로저는 함수가 생성될 때마다 함수 생성 시점에 클로저가 생성된다. Lexical scoping아래 코드를 살펴보자. 123456789function init() { var name = "Mozilla"; // name 은 init에서 만들어진 local variable이다 function displayName() { // displayName() 은 내부 함수이다. 클로저를 형성한다. console.log(name); // 외부 부모 함수에서 만든 variable을 사용하고있다. } displayName();}init(); init()은 name이라는 local variable과...

Archieve를 진행하려고 하는데 계속해서 에러가 발생했다. 1jest-haste-map: Watchman crawl failed. Retrying once with node crawler. Usually this happens when watchman isn't running. Create an empty .watchmanconfig file in your project's root folder or initialize a git or hg repository in your project. Error: Watchman error: std::__1::system_error: open: /Users/sychoi/Desktop/Project/MyProject: Operation not permitted. Make sure watchman is running for this project. See...

로고 이미지로 svg 파일을 받아서 앱 아이콘 사이즈에 맞게 파일 변환이 필요했다. 이미지 비율은 유지하면서 로고가 중앙에 오도록 하여 전체 이미지 크기는 정사각형으로 고정이 필요했다. svg를 png로 변환해주는 사이트들이 많은데 그냥 프로그램을 설치하는게 제일 깔끔한 방법인 것 같다. 😌 rsvg-convert먼저 원하는 width와 height를 가진 png 파일로 변환한다. librsvg를 설치했다. ubuntu에서는 rsvg-convert로 사용가능하다. 1brew install librsvg 설치 후 아래 명령어를 입력한다. 1librsvg -a -w 1024 -h 1024 logo.svg > logo-libsrvg.png imagemagick이미지와 관련된 다양한 기능을 제공하는 소프트웨어이다. 1brew install imagemagick 아래 명령어를 입력하면 된다. 1magick -background none -resize 1024x1024...

에러가 발생했던 코드는 아래와 같다. 12345678910111213export default function EventListScreen() { return ( <FlatList // ..... ListEmptyComponent={ !eventList.length && ( <Text>생성된 이벤트가 없습니다.</Text> ) } // .... /> )} 이 구문은 &&를 사용하는 inline logical 구문이다. React 공식 문서에서도 찾아볼 수 있다. 코드에 빨간 줄이 뜨긴 하지만 실행은 정상적으로 된다.React는 false를 만난 순간 그 뒤에 나온 코드를 무시하기...