클립보드 복사하기 ex) const onCopy = () => { const copiedText = 'test'; navigator.clipboard .writeText(`${copiedText}`) .then(() => { alert('코드가 복사되었습니다.'); })...
stack or tab 스크린 이동 시 새로 고침
tab screen 이동할 때 새로 고침 옵션에unmountOnBlur: true 추가하면 해당 탭에 이동할 때 항상 새로 고침이 된다. import {createBottomTabNavigator} from '@react-navigation/bottom-tabs'; import React from 'react'; import * as sc...
React Native 커스텀 폰트 사용하기
다운로드한 폰트를 디렉토리 안에 넣어준다. ex) src/assets/font/<폰트>.ttf rnpm 설치 npm install -g rnpm package.json "rnpm": { "assets": [ "./src/assets/fonts" ] } ...
ESLint & Prettier 적용하기
ESLint는 JavaScript, JSX의 정적 분석 도구로 코드를 분석해 문법적인 오류를 찾아주고 일관된 코드 스타일로 작성하도록 도와준다. ESLint는 스타일 가이드를 좀 더 편리하게 적용할 수 있다.(예: Airbnb Style Guide, Google Style Guide) 포맷팅 : 일관된 코드 스타일을 유지할 수 있다. (들여...
React Webpack 설정
package.json npm init git git init .gitignore 루트에 .gitignore 파일을 생성 후 아래와 같이 git에 저장하고 싶지 않은 폴더 및 파일을 입력한다. node_modules dist/* .DS_Store react yarn add react reac...
웹팩(Webpack)
웹팩이란? 출처 모듈로 연결된 여러 개의 자바스크립트 파일을 하나로 만들어주는 역할을 한다. 하나로 합쳐진 파일을 번들이라고 하는데 웹팩은 번들을 만들어주는 번들러이다. 웹팩 설치 webpack & webpack-cli 을 설치한다. npm install -D webpack webpack-cli 웹팩 설치 ...
타입스크립트 OOP 객체지향
객체지향이란? 서로 관련 있는 데이터와 함수를 객체(하나의 역할을 수행하는 메소드와 변수의 묶음)로 정의해서 서로 상호작용할 수 있도록 프로그래밍 해나가는 것을 말한다. 각각의 객체는 메시지를 주고받고, 데이터를 처리할 수 있다. 장점 객체지향을 사용하면 중복되는 관련 객체를 재사용할 수 있어 코드의 중복을 어느 정도 줄일 수 있고 관련 있는 객...
타입스크립트란 type
원시 타입 아래와 같이 타입을 설정하면 다른 타입의 종류를 할당할 수 없다. 다른 타입을 할당할 경우 타입 에러가 발생한다. number const age:number = 30 // number 타입만 할당이 가능하다. const name:string = 3 // error (string 타입을 할당해야 한다.) string const n...
타입스크립트란?
타입스크립트는 마이크로소프트에서 개발하고 관리하는 오픈소스 프로그래밍 언어로 자바스크립트를 베이스로 하는 javascript를 감싸는 자바스크립트의 상위 집합(superset of javascript) 언어이다. 브라우저나 운영체제 상관없이 javascript가 동작하는 곳 어디든 대체해서 사용할 수 있다. 타입스트립트 장점 1. 컴파일 단...
Git 기본
계정 연결 git config --global user.name 'kimraeyoung' git config --global user.email '<깃헙 계정 이메일>' alias alias 명령어를 짧게 사용하도록 설정하는 법. git config --glboal alias.co chec...