본문 바로가기

카테고리 없음

리액트 기본 명령어 모음zip

[폴더 생성]      mkdir 폴더명
[찾고]              cd 폴더명
================================================
[리액트 프로젝트 앱 생성] 
-------------------------   yarn create react-app 프로젝트폴더명
-------------------------    cd 프로젝트폴더명                   
-------------------------    yarn start
                                        yarn install
=================================================
[리덕스 다운받기]                                             yarn add redux react-redux
=================================================
[리덕스 폴더 구조 만들기]
1.  src /redux 폴더                                         [ 리덕스 관련 코드 ]
2.  src /redux/config폴더                               [ 리덕스 설정 관련 ]
3.  src /redux/config/configStore.js파일        [ 중앙 state 관리소 -> 설정코드 ]
4.  src /redux/modules 폴더                          [ state의 그룹]
5.  src /redux/modules/counter.js 파일
==================================================
 비동기 통신 세팅                                                      yarn add axios
                                                                                   yarn add json-server
==================================================
json-server 홈페이지에서 // db.json파일 생성하고 코드 정리
{
  "posts": [
    { "id": 1, "title": "json-server", "author": "typicode" }
  ],
  "comments": [
    { "id": 1, "body": "some comment", "postId": 1 }
  ],
  "profile": { "name": "typicode" }
}
===============================================
yarn global add json-server
yarn json-server --watch db.json --port 4000
yarn json-server db.json --port 4000  (버전 문제)
yarn json-server --help 
==================================================
리덕스 툴킷(의존성) 설치                           yarn add @reduxjs/toolkit
==================================================
[라우터 설치]                                      yarn add react-router-dom
==================================================
스타일 컴포넌트 다운받기             yarn add styled-components
import styled from 'styled-components';
==================================================
react-query 명령어                             yarn add react-query
==================================================
리액트 페이지 기본 구성                  rfce 
==================================================
yarn 시작(서연)                           yarn add react-scripts --dev
==================================================
[상대경로 import → 절대경로 지정하기]
src 폴더 밑에 있는 것은 절대경로로 지정
반드시 root경로에 만들기> jsconfig.json파일 만들기
{
	"compilerOptions": {
		"baseUrl": "src"
	},
	"include": ["src"]
}
=====================================================
yarn add lodash