본문 바로가기
React 환경셋팅 4. Redux 1. 설치 커맨드 $ npm install redux react-redux 2. dev툴로 확인하기 위한 커맨드 $ npm install redux-devtools-extension 2022. 5. 2.
React 환경셋팅 2. React_router_DOM 목차 React_router_DOM이란? 라이브러리의 적용 범위 현재 기준 최신버전 설치 커맨드 불러오기 1. React_router_DOM이란? 웹 어플리케이션에서 클라이언트와 서버측 라우팅하는 리액트 라이브러리 UI를 구축하는 JS 라이브러리 2. 라이브러리 적용 범위 Routes 설정 LInk를 통한 경로 이동 레이아웃을 위한 라우터 분할 서버 렌더링 등.. 3. 최신 버전 설치(v6 -2021-12-17) $ npm install react-router-dom 4. 불러오기 BrowserRouter: 최상위 컴포넌트 link: a 태그 대신 써야하는 컴포넌트 Routes: 컴포넌트를 보여주게 함 Route: URI에 맞는 컴포넌트를 찾아주는 컴포넌트 import { BrowserRouter as .. 2022. 5. 2.
React 환경셋팅1. Create-react-app 1. 실행 커맨드 $ npx create-react-app 디렉토리명 1-1. 실행되지 않은 경우 아래의 화면은 프로젝트 디렉토리를 작성하지 않을 경우 뜨는 문구이다. 아래의 화면이 확인된다면 커맨드에서 디렉토리명을 작성한 뒤 다시 커맨드를 입력하자 1-2. 정상적으로 실행되는 경우 아래의 화면이 나타나게 된다. 2. React 서버 돌리기 2-1. 1번에서 작성한 디렉토리로 이동 후 커맨드 입력 $ cd 디렉토리명 $ npm run start 2-2.dev 서버 열기 dev 서버를 시작한다는 문구가 확인되며 브라우저를 띄우겠다는 팝업이 뜬다 ok를 누르면 아래와 같은 화면이 완료되며 셋팅이 끝난다 3. 셋팅 webpack, babel, react, react-dom, eslint 설치되어 있음 함수 컴.. 2022. 4. 25.