react5 [React] nginx 배포과정 #1 이유 react를 nginx에 배포하기는 과정에서 필요한건 3가지이다. 1) 용량 최소화, 최적화하고싶다. -> react production file - > nginx 2) production file은 static files 이기 때문에, sub-url에서 refresh가 안먹힘. -> nginx로 해결 3) ssl+https 적용하기 react 프론트를 nginx에 올려야하는 이유는 2가지가 있다. Event-driven nginx가 event-driven 방식으로 트랜잭션을 처리한다. 동시접속자가 많아도 적절히 처리 가능함. web-pack static file react production 파일이 static 파일이다. 이게 클라이언트 랜더링으로는 sub-url로 바로 접속이 안된다. 서버 랜더링이 .. 2020. 5. 19. [React] nginx에 배포하기 https://codechacha.com/ko/deploy-react-with-nginx/ Nginx로 React를 배포하는 방법 | codechacha React(리액트) 앱을 배포할 때 Nginx, Aphache와 같은 웹서버로 배포를 해야 합니다. Nginx는 오픈소스이며 매우 효율적인 웹서버입니다. 이 글에서 우분투 18.04환경에서 nginx로 React 앱을 배포하는 방법� codechacha.com 이 글이 정리가 잘돼있다. 굿굿 2020. 5. 19. firebase react setup 및 firestore 데이터 가져오기 설치 npm install --save firebase firebase 클래스 선언 파이어베이스 클래스를 선언한다. 파이어베이스에 받은 정보들을 config에 넣는다. import * as firebase from "firebase/app"; // Add the Firebase products that you want to use import "firebase/auth"; import "firebase/firestore"; var firebaseConfig = { apiKey: "api-key", authDomain: "project-id.firebaseapp.com", databaseURL: "https://project-id.firebaseio.com", projectId: "project-id", .. 2020. 3. 20. react-router path 가져오기 browerHistory를 활용하여 현재주소 가져오기 path 뒤에 #,? 정보도 가져옴 import { browserHistory } from 'react-router'; ... componentDidMount() { const location = browserHistory.getCurrentLocation(); console.log(location.hash); } 2020. 2. 29. mobx-react 실전, 요약 react에 상태관리 라이브러리는 필수라고 본다. mobx는 여러 페이지에서 필요한 상태를 하나의 스토어에 보관하고, 상태가 변경될 때 react component를 업데이트할 수 있다. 이 글에서는 mobx에 대해 설명한다. mobx에는 상태, 스토어가 있다. 상태는 class와 같고, 스토어는 객체라고 보면 된다. 스토어에서 상태를 객체화한다. 딱 실전에서 쉽게 활용할 수 있는 것들을 정리해본다. 상태 아래 AppState는 상태에 대한 코드이다. AppState는 변수로 hello를 갖고 있다. @observable이라고 적혀있는데, 이것은 Decorator라고 불리는 것이다. ES7 or typescript에서 사용할 수 있다. 이것의 의미는 관측될 수 있는 애 라는 의미이다. ㅋㅋ 여러 컴포넌트.. 2020. 2. 12. 이전 1 다음
