NPM (10) 썸네일형 리스트형 [#. PM2] PM2 이용해서 백그라운드에서 NODE/REACT 무중단 실행하기 https://pm2.keymetrics.io/ PM2 - Home Advanced process manager for production Node.js applications. Load balancer, logs facility, startup script, micro service management, at a glance. pm2.keymetrics.io ① pm2 설치(전역) $ sudo npm install pm2 -g ② NODE(Backend) 실행 Node는 보통 아래와 같이 실행한다 $ node ./bin/www pm2로 실행하려면 $ pm2 start ./bin/www ③ React(Frontend) 실행 $ pm2 start node_modules/react-scripts/script.. [#. ngrok] undefined is not an object (evaluating 'b.apply') error 해결하기 ngrok을 이용해서 디바이스 기기에서 제공 주소로 들어가 화면을 확인하는 데까진 성공했다 하지만 다른 페이지로 이동하려고 클릭하는 순간 발생했다 (Node + React 기준으로 React 페이지에서 발생) undefined is not an object (evaluating 'b.apply') safari에서 접근하면 뜨는 에러라고 한다 index.js 수정 const store = createStore(persistedReducer, compose( applyMiddleware(ReduxThunk, promiseMiddleware), window.navigator.userAgent.includes('Chrome') ?// 추가 window.__REDUX_DEVTOOLS_EXTENSION__ && w.. [#. ngrok] install failed ngrok error 해결하기 로컬 웹 서버를 모바일 디바이스에서 확인하기 위해 ngrok을 이용하려고 한다 ngrok NAT와 방화벽 뒤에 있는 로컬 서버 를 안전한 터널을 통해 공개 인터넷에 노출시켜 주는 도구 즉, 포트 포워딩과 같은 네트워크 환경 설정 변경없이 로컬에 실행중인 서버를 안전하게 외부에서 접근 가능하도록 해주는 도구 먼저 아래 명령어를 통해 ngrok을 설치하려고 했다 npm install -g ngrok 하지만 에러가 발생했다 ngrok@4.2.2 postinstall: `node ./postinstall.js` Failed at the ngrok@4.2.2 postinstall script. 서치해 보니 Mac에서만 발생하는 에러라고 한다 기본적으로 npm은 수명 주기 스크립트(예: postinstall)를 일.. [#.NPM] NPM vs YARN의 차이점을 알아보자 보통 package를 설치할 때 NPM을 주로 사용했다 하지만 NPM이 있는데도 YARN이 개발된 이유가 있지 않을까? NPM과 YARN의 차이점에 대해 알아보자 ① Parallel installation of packages, packages 병렬 설치 패키지가 설치되면 일련의 작업을 수행한다. NPM에서 여러 패키지를 설치할 때, 패키지가 완전히 설치 될 때까지 기다린 후 다른 패키지를 설치한다. 즉, 작업은 패키지별로 순차적으로 실행된다. 하지만 YARN은 이러한 작업을 병렬로 설치하므로 퍼포먼스와 속도가 증가한다. React를 설치했을 때, NPM과 YARN의 속도 차이는 이렇다 NPM — 3.572 seconds YARN — 1.44 seconds YARN이 현저하게 속도가 빠른 것을 알 수 있.. [#. admin-bro] express-session deprecated undefined resave option; express-session deprecated undefined saveUninitialized option; 에러 해결하기 node에서 admin-bro를 세팅하고 서버를 실행했더니 express-session deprecated undefined resave option; provide resave option node_modules/@admin-bro/express/lib/buildAuthenticatedRouter.js:56:41 express-session deprecated undefined saveUninitialized option; provide saveUninitialized option node_modules/@admin-bro/express/lib/buildAuthenticatedRouter.js:56:41 뭔가가 deprecated 되었다는 메시지가 계속 뜬다 developer0809.tistory.co.. [#. Sequelize] sequelize 설치하기, sequelize-auto command not found 해결 node react 프로젝트에서 seqeulize를 사용하기 위해 처음에 sequelize-auto를 설치했는데 sequelize sequelize-auto comman not found 커맨드 에러가 계속 뜬다 sequelize-auto는 더 이상 지원하지 않기 때문에 sequelize를 설치해야 한다 sudo npm install -g sequelize sudo npm install -g sequelize-cli sequelize를 전역으로 설치해 줬기 때문에 mysql2도 전역으로 설치해야 한다 sudo npm install -g mysql2 터미널에 sequelize를 입력하면 잘 설치된 것을 확인할 수 있다 github.com/sequelize/sequelize-auto sequelize/seq.. [#. react-images-uploading] react에서 react-images-uploading를 이용해서 이미지 올리기, 이미지 수정/삭제하기 상품을 구입한 사람에게만 이렇게 리뷰를 쓸 수 있는 영역이 노출되도록 했다 리뷰에는 텍스트와 이미지를 둘다 올릴 수 있다 이때 이미지를 업로드하기 위해 react-images-uploading를 이용해 보자 www.npmjs.com/package/react-images-uploading react-images-uploading The simple images uploader applied Render Props pattern. This approach allows you to fully control UI component and behaviours. www.npmjs.com ① react-images-uploading 설치 npm install --save react-images-uploading ② .. [#. react-image-gallery] npm 패키지를 사용해서 상품 상세 페이지에 이미지 슬라이드 image slide 만들기 Node + React로 쇼핑몰을 개발하고 있다 react-image-gallery 패키지를 설치해서 상품 상세 페이지에서 이미지 슬라이드를 사용해 보자 www.npmjs.com/package/react-image-gallery react-image-gallery React carousel image gallery component with thumbnail and mobile support www.npmjs.com ① react-image-gallery 설치 npm install react-image-gallery --save ② css 설정 src/index.css 최상단에 css 파일을 import 해준다 @import "~react-image-gallery/styles/css/image-galle.. 이전 1 2 다음
