JNarin Development Story

비밀번호는 아무리 판매자라 하여도 사용자의 비밀번호를 보아서도 알아서도 안된다. 그렇기에 비밀번호를 암호화하는 것이 중요하다. 이번에는 bcrypt 패키지를 이용하여 회원가입 시 암호화를 진행하려 한다. 일단 mongoDB를 확인하면 맨 처음 가입 시 테스트했던 것을 확인하면, 비밀번호가 너무 잘 보인다. 그래서 그 부분을 보완하기 위해서 bcrypt패키지를 설치해야 한다. yarn add bcrypt OR npm install bcrypt moduls/User.js ... const bcrypt = require('bcrypt'); const saltRounds = 10; ... userSchema.pre('save', function(next){ // 회원가입할 정보를 저장하기 전에 함수 실행 let..

리액트를 사용하면 경로는 일반적으로 상대 경로를 사용하게 된다. 상대 경로의 최대의 단점은 코드 길이가 길어질 뿐만 아니라, 코드 경로가 헷갈리는 경우가 많이 발생하여 쓸데없는 시간소비가 있을 수 있다. 그렇기 때문에 절대 경로도 꽤 편리한 기능이어서 그 사용방법에 대해 적어보려고 한다. 먼저, 원하는 위치에 absolute-path라는 앱을 설치한다. (여기서 앱이름은 본인이 원하는 이름으로 하여도 큰 문제는 없다. 단, 대문자는 안된다.) yarn create react-app absolute-path 추가적으로 원하는 폴더가 현재 위치일 경우(즉, absolute-path폴더가 있고 터미널로 현재 그 위치일 경우)에는 다음과 같은 명령어로 입력을 한다. TMI yarn create react-app..

오늘의 스터디는 boiler-plate에 업로드된 body-parser, Postman을 사용한 스터디 내용을 정리하려고 한다. body-parser Node.js 본문 파싱 미들웨어. 터미널에서 설치 명령어를 통해 설치를 해주면 된다. TMI 추가 설명 더보기 이전에는 body-parser을 따로 설치를 한 후, 임포트를 진행하였지만 Express v4.16.0을 기준으로 body parser가 추가가 되었다고 한다. 그래서 따로 설치를 하지 않고 다음과 같은 코드로 변경할 수 있다. // 일부 생략 index.js app.use(express.urlencoded({extended: true})); app.use(express.json()); // 일부 생략 또한 Postman을 설치하게 되면 API ..

데이터를 임시로 뿌려주면서 화면에 팝업창 형식으로 한번 더 보여주는 기능이 있다. 근데 문제점은 같은 데이터만 화면으로 보이는 문제가 발생하였다. 결론부터 말하자면 일단 해결은 되었다. 하지만 왜인지는 모르겠다. 수정전 코드 import React, {useState} from "react"; import { MainLayout, SliderStyle, ButtonStyle, HrCenter, DivisionLine } from "./Main.style"; import "antd/dist/antd.css"; import { Row, Carousel, Col, Modal } from "antd"; import { SearchOutlined } from "@ant-design/icons"; import ma..