멋쟁이 퍼블리셔의 개발자 거듭나기 프로젝트 멋쟁이 퍼블리셔의 개발자 거듭나기 프로젝트

다양한 짓을 해봤는데...... 두가지의 방법이 있었다. 1. 지우고 재설치하기 package-lock.json 파일, package.json 파일 node_modules 폴더를 싹 지운 뒤 다시 npm install을 해준다. 2. 그래도 안된다면? 버전 문제 나처럼 create-react-app version 4+로 설치한 것이다. 애초에 index.js파일 안에 여타 강의들처럼 기본적으로 serviceWorker가 아닌 reportWebVitals로 설치가 되어있어 당황했을 것이다. (나는 못본걸로 하고 강의를 듣다가 결국 막혀서 헤맸다) 기본 템플릿이 변경되어서 serviceWorker가 없다고 하니 그냥 하나 만들어서 넣어주면 된다. src/serviceWorker.js 파일을 하나 만들어준 뒤..

1. react 환경설정 npx creat-react-app 명령어를 이용해 react 환경설정을 한 뒤 npm run start로 시작 2. redux 설치 npm install redux redux를 설치한 뒤 store.js 파일을 만든다 3. store.js 파일을 생성하고, 그 안에 reducer 함수와 초기 state값을 생성 import { createStore } from "redux"; var initState = { mode: "WELCOME", welcome_content: { title: "WEB", desc: "Hello,WEB", }, selected_content_id: 1, contents: [ { id: 1, title: "HTML", desc: "HTML is ..." }..

1. 가장 큰 어려움은 복잡함이다. 이러한 코드의 복잡성을 어떻게 낮출 것인가? 2. 리덕스는 이 코드의 복잡성을 낮춰주고, 어떤 결과를 가져올지 예측가능하게 만들어준다. state란 상태.그냥 객체일 뿐. 데이터가 이곳저곳 흩어져있는 것보다 한곳에 묶여있는 게 훨씬 관리하기 쉽기 때문에 사용. 이렇게 단 하나의 state를 유지하는 것으로 어플리케이션의 복잡성을 낮춘다 3. 리덕스의 특징 1) Single Source of Truth - 1개의 상태 2) 1개의 state에 모든 데이터를 넣는다. 3) 인가된 담당자(특정 함수)를 통해서만 값을 수정한다. - 개발자가 직접 값을 수정할 수 없다. - reducer - dispatcher 4. 데이터를 가져 갈 때도 함부로 가져가지 못한다. 데이터를 아주..

오늘 차장님께 리덕스에 대한 설명을 들었다. 간단한 개념공부를 하며 이해했던 내용을 정리해보았따. 리덕스를 왜 쓰는가? 1. props 문법이 번거로울 때 2. state(상태)변경,관리할 때 1 ) 상태 변수를 내부 컴포넌트로 전달하기 위해서는 props 문법으로 끝없이 전달해줘야한다. (전달하지 않고 그냥 변수를 그대로 가져다 쓸 수 없음) 개귀찮아! => 그래서 쓰는 것이 REDUX state를 보관할 수 있게 된다. props 문법으로 계속 전달할 필요 없이 state를 보관한 곳(ex. store.js)에서 꺼내다가 쓰면 됨. component에서 store에 넣어둔 state를 쓰려면? function App() { const myScore = useSelector(( state ) => st..