[REACT] 리액트 프로젝트 생성부터 빌드까지 필요한 패키지 설치와 import

프로젝트 만들기

yarn create react-app project name

 

 

 

스타일컴포넌트 설치

yarn add styled-components

import styled from "styled-components";

 

 

 

라우터설치

yarn add react-router-dom

import { withRouter } from "react-router";

import { Route } from "react-router-dom";

 

 

 

리덕스 설치

yarn add redux react-redux

(index.js)

import { Provider } from "react-redux";
// 연결할 스토어도 가지고 와요.
import store from "./redux/configStore";
ReactDOM.render(
  <Provider store={store}>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </Provider>,
  document.getElementById("root")
);

 

 

 

파이어베이스 패키지 설치

yarn add firebase

(firebase.js)

//firebase.js
import firebase from "firebase/app";
import "firebase/firestore";

const firebaseConfig = {
    // firebase 설정과 관련된 개인 정보
};

// firebaseConfig 정보로 firebase 시작
firebase.initializeApp(firebaseConfig);

// firebase의 firestore 인스턴스를 변수에 저장
const firestore = firebase.firestore();

// 필요한 곳에서 사용할 수 있도록 내보내기
export { firestore };

(App.js)

import { firestore } from "./firebase";

 

 

 

 

빌드

yarn build