JNarin Development Story

저번 시간에는 로그인 페이지를 만들었었다. 이번에는 마지막으로 회원가입 페이지를 만드는 시간을 가지려 한다. 1. LoginPage.js를 가져와 추가하기 // client > src > components > views > RegisterPage > RegisterPage.js import React, { useState } from 'react'; import { useDispatch } from 'react-redux'; import { registerUser } from '../../../_actions/user_action'; function RegisterPage(props) { const [Email, setEmail] = useState(""); const [Password, setPass..

오늘은 로그아웃 기능을 만들어 보려고 한다. 1. 로그아웃 Router 만들기 // index.js app.get('/api/users/logout', auth, (req, res) => { }) 먼저 로그아웃 router를 만들어주고 auth middleware도 추가해준다. 2. 로그아웃 하려는 유저를 DB에서 찾기 app.get('/api/users/logout', auth, (req, res) => { User.findOneAndUpdate({ _id: req.user._id }, }) }) 여기서 findOneAndUpdate를 사용하여 로그아웃하려는 유저 ID를 찾는다. 3. 찾은 유저의 토큰을 삭제 app.get('/api/users/logout', auth, (req, res) => { U..

오늘은 Auth 기능을 공부하였는데 아직도 이해가 가지 않는 부분도 있지만 따라 해보려 한다. 먼저, 추후에 쓰일 예정이지만 Express라는 라우터를 사용하기 위해 현재 쓰이는 API들의 경로를 디테일하게 나누었다. 이렇게 해야 현재 라우터가 어디에 관련된 라우터인지 알 수 있기 때문이다. users, products, comment 등 다양하게 존재하기 때문이다. index.js 상단에는 auth를 import를 해야 사용할 수 있다. 또한 middleware값에서 Authenticaation이 True일 경우 원하는 유저정보를 제공하여 가져올 수 있다. middleware/auth.js 아직은 이 순서가 이해가 가면서도 이해가 잘 가지 않지만, 원래 어려웠던 것이니 일단 이렇게 하는구나 하고 넘어가..

비밀번호는 아무리 판매자라 하여도 사용자의 비밀번호를 보아서도 알아서도 안된다. 그렇기에 비밀번호를 암호화하는 것이 중요하다. 이번에는 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..

몽고DB 수업하다가 Connect를 진행하려고 하였는데 마지막까지 Connect가 되지 않았다. 이유를 확인해보니 IP Add를 제대로 하지 않아서 생긴 문제였다. 그래서 이번에는 connect를 하기 전에 해야할 부분과 IP Address를 추가하는 방법을 정리하려고 한다. IP Address를 하는 첫번째 방법 cluster를 만들었다면 connect를 클릭하면 다음과 같은 화면이 나오게 된다. 여기서 먼저 Add Your Current IP Address를 눌러 현재 내 아이피 혹은 다른 아이피를 추가하도록 한다. 현재 내 아이피가 필요하다면 자동적으로 IP를 추적하여 IP Address값에 들어가게 되므로 바로 추가하면 된다. IP Address를 하는 두번 째 방법 mongodb 우측에 Netw..

리액트를 배우기 앞서 필자는 노드를 설치하게 되었습니다. yarn을 사용하기 위해서는 Node.js를 먼저 설치를 해야 한다고 한다. 그래서 설치를 진행해보려고 한다. 참고로 필자는 window 10 Pro 사용자이다. 먼저 Node.js사이트를 방문한다. 다음과 같은 화면이 보이게 된다. 필자는 12.18.4 LTS버전이며 이후에는 그 윗단계 버전으로 '안정적, 신뢰도 높은'이라는 부제목이 있는 곳을 클릭한다. 다운이 완료되었다면 다운된 폴더로 가서 더블클릭을 한다. 초기화면으로 Next를 클릭한다. 라이선스 및 동의를 표시하므로, 체크 후 Next를 눌러준다. 노드를 어디에 설치를 할지 결정을 한다. 필자는 노드 설치 후 특별히 무언가 설정을 하러 찾아간 적이 없기에 기본 설정된 값을 그대로 두고 N..