xtring.dev

null 병합 연산자 null 병합 연산자(nullish coalescing operator)라고 불리는 ??에 대해서 알아 봅시다. ??를 사용하면 짧은 문법으로 여러 피연산자 중 그 값이 '확정되어있는' 변수를 찾을 수 있습니다. a ?? b의 결과는 아래와 같습니다. a가 null 또는 undefined가 아니면 a 그 외의 경우는 b(a가 null 또는 undefined) null 병합 연산자 ?? 없이 x = a ?? b와 동일한 동작을 하는 코드를 작성하면 다음과 같습니다. x = (a !== null && a!== undefined) ? a : b; 이 길어지는 코드를 간단하게 표현할 수 있습니다. 하나의 예시를 더 보겠습니다. let firstName = null; let lastName ..

헷갈리는 부분을 다시 한번 정리하고자 작성했습니다. 정확히 알고 가면 많은 실수를 줄일 수 있습니다. Boolean형 비교 Boolean형의 비교 연산은 하나의 값을 반환합니다. - true가 반환되면, "긍정", "참", 사실"을 의미합니다.(= 1 또는 그 이상의 양수) - false가 반환되면, "부정", "거짓", "사실이 아님"을 의미합니다.(= 0 또는 그 이하의 음수) 예시) console.log(2 > 1);// true console.log(2 == 1); // false console.log(2 != 1);// true 반환된 Boolean값은 다른 값들 처럼 변수에 할당하는 것이 가능합니다. let result = 5 > 4;// 비교연산의 결과를 result에 할당 console.l..

Front-end 개발하면서 서버에서 제공해주는 RESTful API를 사용하게 됩니다. 최근에는 GraphQL과 같은 엔드포인트에서 Front가 요청하는 데이터를 객체 형태로 제공하는 방식도 있지만 현재 이 시점에서도 많이 사용되고 있는 HTTP Method에 대해 알아보겠습니다. HTTP Method는 Front-end라면 기본적으로 알아야 하며 서버측에서 데이터를 받아오는데 가장 기본이 됩니다. HTTP는 Request Method를 정의하여, 주어진 리소스에 수행하길 원하는 동작을 나타냅니다. 이 동작들을 HTTP Method라고 합니다. 각각의 메서는 서로 다른 구현하지만, 일부 기능은 메서드 집합 간에 공유되어지기도 합니다. GET(Read) 서버에게 Resource를 보내도록 요청(Reque..

헤르메스(Hermes)는 React Native에서 안드로이드 앱을 구동할 때 최적화하기 위해 사용합니다. 기존의 React Native 앱은 '실행 시점'에서 JavaScript를 bytecode로 컴파일합니다. 하지만 헤르메스를 사용하면 '빌드 시' bytecode로 컴파일을 하여 빌드 파일의 크기를 줄여주고, 실행시점에서의 컴파일이 필요없게 되어 초기 실행 속도가 개선됩니다. 따라서 헤르메스(Hermes)의 이점으로는 아래 세가지가 있습니다. 1. 앱 실행(launch) 속도가 빨라집니다. 2. APK 사이즈를 줄일 수 있습니다.(실제 20%까지 줄여지는 것을 눈으로 확인함) 3. 메모리 사용량을 줄일 수 있습니다.(20% 절감) 이렇게 좋은 헤르메스는 사용법도 아주 간단합니다. 먼저, 프로젝트의 ..

React Native로 개발한 앱을 Play Store에 업로드하기 위해서 Android 앱을 Build해봅시다. 1. PlayStore 개발자 등록하기 먼저 구글 Play에서 developer 계정을 생성하고 등록합니다. developer.android.com/distribute/console?hl=ko Google Play | Android Developers Google Play Console로 앱과 게임을 게시하고 Google Play에서 비즈니스를 성장시키세요. 앱의 품질을 개선하고, 사용자층과 소통하고, 수익을 창출하기 위한 여러 기능을 활용할 수 있습니다. developer.android.com 개발자 계정을 등록할 때 약 5만원의 등록비가 필요합니다... 2. Android 서명키 생성하..

성장이란 무엇인가? 최근 1년간 성장이라는 단어에 목메어 살아왔던 것 같다. '성장해야 한다.', '성장하고 싶다.'라는 말로 항상 나를 채찍질하며 나보다 앞질러 있는 사람들을 쫒아가는데 급급했다. 그런데 오늘 문득 성장이라는 것이 무엇일까라는 생각을 하게 되었다. 컴포넌트 하나를 만들어도 이전엔 못했던 범용성있고 유연하게 만드는 것? 아니면 MVP를 빨리 만들어내는 것? 무엇이 성장인지 곰곰히 생각해보니 결국 나는 목적없는 성장을 꿈꾸고 있었는지도 모르겠다는 생각이 들었다. 어떤 개발자, 어떤 기술을 다루는 개발자라는 꿈은 있었지만 굉장히 흐리멍텅하고 구체적이지 않은 그림만 바라보고 욕심부린 것 같다. 맞다. 나는 원래 개발자가 꿈이 아니였던 사람이다. 나는 예술이나 경영을 전공하고 싶었고 어쩌면 떠밀..

React Native에서 Image 컴포넌트를 사용하면 이미지를 뷰에 맞추기 위해 resizeMode를 사용하여 일부 상위 컨테이너에 맞추게 됩니다. 하지만 때때로 resizeMode 만을 통해 상위 컨테이너에서 보여주고 싶은 부분을 완벽하게 보여주지 못하는 경우가 발생하기도 합니다. 바로 아래 예시를 살펴봅시다! 위와 같은 경우 item(상위 컨테이너)이 가진 영역 만큼 안에서 이미지는 상하단의 영역을 보장하여 이미지의 사이즈를 조정합니다. 하지만 이 경우 좌우영역의 빈 공간이 발생하게 됩니다. 그렇다면 resizeMode='cover'로 바꾸면 어떻게 될까요? 이미지의 비율에 상관없이 부모 컨테이너의 영역을 모두 덮을 수 있도록 해줍니다. 이 것은 때때로 문제를 가질 수 있는데요. 🤓 cover 속..

git을 사용하기 위해 git init을 실행하면 자동으로 생성되는 .gitignore 파일이 있습니다. 예측하기로, git 버전 관리를 하는데 있어 git에서 업로드하지 않을 파일 목록을 지정한다고만 알고 있었습니다. .gitignore 파일이란? git 버전관리에서 제외(Github에 업로드하지않을 파일 목록)할 파일 목록을 지정하는 파일 .gitignore이 파일명이며, 해당 파일 목록에 들어가는 대표적인 것은 node_modules가 있습니다. node_modules에 대한 정보는 package.json 안에 명시되어 있기 때문에 해당 module이 없더라도 npm i[install]를 실행시키면 node_modules 안에 생성됩니다. 따라서 node_modules를 굳이 github에 올리지 ..