Frank의 공부 일지

async await은 Promise를 가독성 좋게 사용하는 한 가지 방법에 불과하다고 합니다. 자바스크립트를 통해 비동기 코드를 처리하는 가장 기본적인 방법은 콜백 함수, 프라미스(Promise), async-await 등이 있습니다. 각각 모두 장단점이 있습니다. 각각의 함수가 중첩되는 상황이 깊어질수록 콜백 함수는 콜백 헬을 만들고, 여러 프라미스가 체이닝이 되어 선언되면 에러를 디버깅하긴 힘듭니다. 여러 개의 비동기 함수를 사용하려 할 때 Promise.all과 async/await을 사용해서 시간을 계산해보면 Promise.all이 훨씬 시간이 단축되는 것을 테스트 해볼 수 있습니다. 그 이유는 async-await 함수는 하나하나 다 기다렸다가 하고, Promise.all은 병렬로 비동기 함..

요즘 노치 디자인으로 핸드폰들이 나와서 핸드폰의 윗부분을 침범하는 경우가 있는데 이걸 해결하는 방법으로 SafeAreaView가 있다. 사용법은 import { SafeAreaView} from 'react-native'; 로 SafeAreaView를 불러온 다음에 View 태그 대신에 사용하면 된다.

React Native 는 리액트의 접근 방법을 모바일로 확장한 Facebook의 오픈소스 프로젝트입니다. 즉, React 의 규칙을 이용하여 모바일 어플리케이션을 개발할 수 있다는 말입니다. 먼저 node를 설치합니다(mac 환경에서 진행하였습니다.) $ brew install node node 설치가 끝나면 npm을 이용하여 react-native-cli를 설치해줍니다. $ npm install -g react-native-cli 이로써 초기 설치 과정은 모두 끝나고 이제 프로젝트를 생성할 차례입니다. $ react-native init 프로젝트이름 프로젝트 생성 후 이 프로젝트로 이동해서 IOS 또는 Android를 실행해줍니다. $ cd 프로젝트이름 $ react-native run-ios

npm에는 개발자의 편의를 위해서 여러 command를 제공합니다. npm을 사용하여 개발하면서 내가 사용하고 있는 외부 모듈이 문제점을 갖고 있지 않을까 생각한다면 이러한 걱정을 덜어줄 수 있는 command가 있습니다. $ npm audit 프로젝트 루트 경로에서 npm audit 을 입력하면 프로젝트에서 사용하고 있는 모듈의 취약점에 대해서 알려줍니다. npm audit 은 취약점을 찾아줄 뿐만 아니라 간단한 수정도 가능합니다. $ npm audit fix npm audit fix 는 취약점을 가진 종속성에 대해 호환되는 버전으로 자동으로 업데이트 해줍니다. npm audit fix로 해결되지 않은 취약점은 more info 에서 제공되는 정보로 해결책을 참고하실 수 있습니다. 이상으로 프로젝트 모..

여러 프로젝트를 진행하다 보면 협업 하는 경우 코드를 공유하거나 라이브러리를 받을 때 node 버전이 다르게 되면 문제가 생기는 부분도 발생할 수 있습니다. 하지만 각 프로젝트 마다 노드 버전을 다르게 쓰는 방법이 있습니다. 우선 제 os는 mac이고 터미널을 zsh를 사용하고 있는데 이제 zsh 설정 파일인 .zshrc에 들어가서 # place this after nvm initialization! autoload -U add-zsh-hook load-nvmrc() { local node_version="$(nvm version)" local nvmrc_path="$(nvm_find_nvmrc)" if [ -n "$nvmrc_path" ]; then local nvmrc_node_version=$(nv..

git repository에 코드를 업로드하는 방법을 속성으로 살펴보려 합니다. 우선 자신의 로컬 환경(PC)에서 작업하는 저장소를 Local Repo라고 하며, Github에 있는 저장소를 Remote Repo라 합니다. Git 명령어 - git init : 새로운 local repo 생성 - git add : 변경된 파일들을 storage에 추가 - git commit : 추가한 파일들을 Local Repo에 저장 - git push : Local Repo를 Remote Repo에 업로드 Github에 소스 코드 업로드하기 1) 저장소 생성 Github 홈페이지에서 로그인을 한 후 repository를 생성합니다. https://github.com GitHub: Where the world build..

Sequelize - 잘 설명되어 있는 코드 예제를 포함하는 훌륭한 docs와 함께 매우 발달하고 인기 있는 Node.js ORM 라이브러리 - promise 기반 ORM - PostgreSQL, MySQL, MariaDB, SQLite, MSSQL 지원 Objection.js - SQL과 기본 데이터베이스 엔진의 모든 기능을 최대한 쉽게 사용할 수 있도록 하는 동시에 공통적인 기능을 쉽게 만들어준다

Request 객체는 API를 컨트롤하기 위한 메소드를 3개 담고 있는데 - param - query - body 1. req.param : 주소에 포함된 변수를 담는다. 예를 들어 https://yunbo96.tistory.com/post/12345 라는 주소가 있으면 12345를 담는다. 2. req.query : 주소 바깥 , ? 이후의 변수를 담는다. 예를 들어 https://yunbo96.tistory.com/post?nickname=hi 일 경우 hi를 담는다. 3. req.body : XML, JSON, Multi-Form 등의 데이터를 담는다. 당연히 주소에선 확인할 수 없다. 요청 본문에 제출된 키-값 데이터 쌍을 포함한다. req.body는 body-parser를 사용하기 전에는 def..

모듈이 필요한 이유 1. 코드베이스를 나누어 여러 파일로 분할해서 코드를 좀 더 구조적으로 관리. 각각의 독립적인 기능의 조각들을 개발 및 테스트하는데 도움. 2. 다른 프로젝트에 코드를 재사용 가능 3. 은닉성을 제공 4. 종속성을 관리. 필요한 일련의 종속성들을 쉽게 임포트. CommonJS 내부와 모듈 패턴 CommonJS는 Node.js의 첫 번째 내장 모듈 시스템입니다. CommonJS 명세의 두 가지 주요 개념을 요약하면 다음과 같습니다. - require는 로컬 파일 시스템으로부터 모듈을 임포트하게 해줍니다. - exports와 module.exports는 특별한 변수로서 현재 모듈에서 공개될 기능들을 내보내기 위해서 사용됩니다. module.exports vs exports 많은 사람들이 ..

Promise.all - 여러 개의 프라미스를 동시에 실행시키고 모든 프라미스가 준비될 때까지 기다린다고 해봅시다. - 복수의 URL에 동시에 요청을 보내고, 다운로드가 모두 완료된 후에 콘텐츠를 처리할 때 이런 상황이 발생합니다. - Promise.all은 이럴 때 사용할 수 있습니다. let promise = Promise.all([...promises...]); Promise.all 은 요소 전체가 프라미스인 배열(대개는 배열)을 받고 새로운 프라미스를 반환합니다. 배열 안 프라미스가 모두 처리되면 새로운 프라미스가 이행되는데, 배열 안 프라미스의 결괏값을 담은 배열이 새로운 프라미스의 result가 됩니다. 아래 Promise.all 은 3초 후에 처리되고, 반환되는 프라미스의 result는 배열..