shop-98

React와 Node를 이용한 쇼핑몰

• "리액트를 다루는 기술" 책의 연장선으로 공부 목적으로 간단한 쇼핑몰을 만들기로 결정함 이 프로젝트를 통해 React와 Node를 공부하는데 도움이 되었음.

대표적인 기능

• 로그인, 회원가입 기능
• 쇼핑몰 게시판 기능
• 상세페이지 상품 선택 후 장바구니에 추가, 삭제 기능
• 아임포트 api를 사용한 결제 기능

기술 스택

프로젝트 주소 : https://shop-98.herokuapp.com/ (현재는 접속 불가)

로그인 & 회원가입

책의 구현된 기능에 주소검색 기능을 추가

회원가입시 JWT를 적용

    UserSchema.methods.generateToken = function () {
    const token = jwt.sign(
      //첫 번째 파라미터에는 토큰 안에 집어넣고 싶은 데이터를 넣습니다.
      {
        _id: this.id,
        username: this.username,
      },
      process.env.JWT_SECRET, //두 번째 파라미터에는 JWT암호를 넣습니다.
      {
        expiresIn: '7d', //7일 동안 유효함
      },
    );
    return token;
  };

게시판

장바구니 추가 & 삭제 (Redux)

  const UserSchema = new Schema({
    username: String,
    hashedPassword: String,
    address: String,
    isAdmin: {
      type: Boolean,
      default: false,
    },
    cart: {
      type: Array,
      default: [],
    },
  });

Cart 스키마는 User 스키마에 배열 형태로 추가

결제