본문 바로가기

분류 전체보기34

업로드한 이미지 압축하기(React/browser-image-compression) Javascript에서 이미지를 업로드 했을 때, 이미지 사이즈를 줄여주는 패키지입니다. 설치 yarn add browser-image-compression or npm install browser-image-compression --save 사용법 주요 사용법입니다. import imageCompression from 'browser-image-compression'; function BrowserImageCompression(){ const compressImage = async (image: File) => { try{ const options = { maxSizeMb: 1, maxWidthOrHeight: 300, } return await imageCompression(image, options.. 2021. 5. 27.
expo-cli 설치 or 업데이트 시, EPERM 에러 expo-cli를 설치하거나 버전 업그레이드를 진행할 때, 발생하는 EPERM 에러의 해결방법입니다. npm install -g expo-cli 명령을 실행했을 때, 아래와 같은 EPERM 에러가 발생한다면, Ctrl + Alt + Del을 눌러서 작업관리자를 열고, 프로세스를 확인하면, Adb.exe 혹은 adb.exe가 실행 중입니다. 이 실행 중인 프로세스를 종료하고, npm install -g expo-cli 명령을 다시 입력하시기 바랍니다. 2020. 3. 13.
React 어플리케이션 Dockerfile 작성(개발용) React로 개발된 어플리케이션을 Docker화 하기 위해서 Dockerfile을 작성하고, Google Cloud Platform에 배포하는 방법을 설명한다. [Dockerfile 작성] # node 설치 FROM node:alpine # 작업 디렉토리 설정하고, package.json 복사 WORKDIR /app COPY package.json /app/package.json # npm 설치 RUN npm install # 앱 실행 COPY . /app CMD ["npm", "start"] [docker image 생성] docker build -t gcr.io/[PROJECT_ID]/[IMAGE_NAME]:[TAG] . [image 리스트 확인] gcloud container images list .. 2020. 3. 4.
[npm] 패키지 설치 시, ENOSELF 에러 react-redux를 공부하다가 npm으로 react-redux 패키지를 설치하는데 에러가 발생 해당 에러는 설치하려는 패키지의 이름과 프로젝트 이름이 같아서 발생한 에러 [해결방법] 프로젝트 디렉토리 명 변경 package.json의 name 변경 [결과] 2020. 3. 4.
[React] create-react-app 시, yarn의 unexpected error occurred 해결 create-react-app 명령어를 실행할 때, yarn으로 패키지를 설치하는 데, 아래와 같은 에러가 발생했다. error An unexpected error occurred: "https://registry.yarnpkg.com/react: unable to verify the first certificate". 해당 문제는 SSL 문제로 해결방법은 아래와 같다. yarn config set "strict-ssl" false npm에서도 동일한 에러가 발생한다면 아래와 같이 진행 npm config set strict-ssl false 2020. 3. 3.
[react-native] expo-cli를 이용하여 첫 RN 프로젝트 생성하기 expo expo는 빠르게 react-native 개발을 시작할 수 있도록 도와주는 도구이다. react의 create-react-app과 같은 존재이다. 웹에서 결과를 실시간으로 확인할 수 있고, expo app을 다운받는다면 iOS나 안드로이드에서도 결과를 확인할 수 있다. expo를 이용하여 react-native 프로젝트 생성 expo-cli 설치 npm install -g expo-cli 설치를 완료하였으면, 설치가 잘 되었는지 버전 확인 expo-cli --version expo 프로젝트 생성 expo init [프로젝트 명] 첫 선택화면으로 template을 선택한다. blank로 선택 생성된 프로젝트로 이동하여 프로젝트를 실행 cd [프로젝트 명] npm start 프로젝트가 실행되면서 자.. 2020. 3. 2.
npm install -g 시, 발생하는 Permission Denied Error npm을 업데이트하는 도중에 Permission Denied 에러가 발생했습니다. 제 컴퓨터는 mac입니다. npm install -g npm npm ERR! Error: EACCES: permission denied원인 npm 설치경로에 대한 권한을 갖고 있지 않아서 발생했습니다. 해결방법 1 npm이 global로 설치되는 디렉토리 경로를 자신의 home directory로 변경합니다. # 1. .npm-global 디렉토리 생성 mkdir ~/.npm-global # 2. 해당 디렉토리를 npm config set으로 설정 npm config set prefix '~/.npm-global' # 3. ~/.profile 파일에 PATH를 지정 vi ~/.zshrc # 4. 제일 마지막에.. 2020. 3. 1.