본문 바로가기

Redux

 (4)
A non-serializable value was detected in the state, in the path umc study를 하면서 redux를 쓰는 과정에서 겪었던 오류다. export const userSlice = createSlice({ name: "user", initialState: { id: "", pw: "", res: {}, }, reducers: { login: (state, action) => { state.id = action.payload.id; state.pw = action.payload.pw; state.res = action.payload.res; window.localStorage.setItem("token", state.res.data.accesstoken); window.localStorage.setItem("id", state.id); }, logout: (state) ..
Add To Cart 구현하기 #1 현재 server/models에서 Product 모델이나 User 모델을 보면 Cart에 관한 필드나 모델이 존재하지 않는다. 이 상태면 DB에 카트에 관한 정보를 저장할 수 없다. 이러면 카트에 관한 모델을 만들거나 따로 처리를 해줘야한다. 강의에서는 User 모델에 Cart 필드를 만들어서 관리를 했다. 가이드 라인은 다음과 같다. 위 이미지에서 history 필드는 결제를 하고 나면 어떤 상품을 샀는지 등등이 남을 건데 이것을 관리한다. User 모델에 Cart 필드랑 history 필드를 넣어주자. 더보기 const mongoose = require('mongoose'); const bcrypt = require('bcrypt'); const saltRounds = 10; const jwt ..
login page & register page & logout LoginPage.js import React, { useState } from 'react' import Axios from 'axios'; import { useDispatch } from 'react-redux'; import { loginUser } from '../../../_actions/user_action'; import { withRouter } from 'react-router-dom'; function LoginPage(props) { const dispatch = useDispatch(); // 여기 안에서 데이터를 변화 시켜줄 땐 state를 변화시켜준다. const [Email, setEmail] = useState(""); const [Password, setPassword] ..
Redux https://hanamon.kr/redux%EB%9E%80-%EB%A6%AC%EB%8D%95%EC%8A%A4-%EC%83%81%ED%83%9C-%EA%B4%80%EB%A6%AC-%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC/ Redux(리덕스)란? (상태 관리 라이브러리) - 하나몬 Redux(리덕스)란? 무엇인지 부터 간단한 실습까지 (상태 관리 라이브러리 리덕스 알아보기) ⚡️ Redux(리덕스)란? Redux(리덕스)란 JavaScript(자바스트립트) 상태관리 라이브러리이다. Redux(리덕스)의 hanamon.kr 위 사이트가 설명이 잘 나와있어서 두고두고 참고해야겠다. 위 파일의 27페이지 리덕스 관련 dependency들을 다운 받아주자. redux-pr..

티스토리툴바