오늘은 Auth 기능을 공부하였는데 아직도 이해가 가지 않는 부분도 있지만 따라 해보려 한다. 먼저, 추후에 쓰일 예정이지만 Express라는 라우터를 사용하기 위해 현재 쓰이는 API들의 경로를 디테일하게 나누었다. 이렇게 해야 현재 라우터가 어디에 관련된 라우터인지 알 수 있기 때문이다. users, products, comment 등 다양하게 존재하기 때문이다. index.js 상단에는 auth를 import를 해야 사용할 수 있다. 또한 middleware값에서 Authenticaation이 True일 경우 원하는 유저정보를 제공하여 가져올 수 있다. middleware/auth.js 아직은 이 순서가 이해가 가면서도 이해가 잘 가지 않지만, 원래 어려웠던 것이니 일단 이렇게 하는구나 하고 넘어가..
가장 기본이지만 필자에게는 제일 어려웠던 로그인 기능을 오늘 추가해보려고 한다. 전체적인 개념은 이해했지만 아직도 무언가 부족한 느낌이 들었지만, 오늘도 어느 정도 이해를 바탕으로 글을 쓰려고 한다. 1. 데이터 베이스에서 요청한 E-mail을 찾기 일단 회원가입이 되어있는지의 E-mail을 찾는 코드가 필요하다. Express 라우트 메소드를 사용한다. // POST method route app.post('/', function (req, res) { res.send('POST request to the homepage'); }); mongodb에서 제공하는 method를 이용한다. //index.js ... app.post('/login', (req, res) => { User.findOne({ e..
비밀번호는 아무리 판매자라 하여도 사용자의 비밀번호를 보아서도 알아서도 안된다. 그렇기에 비밀번호를 암호화하는 것이 중요하다. 이번에는 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..
오늘은 벡앤드 프로그래밍 Koa에 대한 기본 사용법에 대한 정리를 하려고 한다. 1. 서버 띄우기 index.js const Koa = require('koa'); const app = new Koa(); app.use((ctx) => { ctx.body = 'hello world'; }); app.listen(4000, () => { console.log('Listening to port 4000'); }); index.js를 다음과 같이 작성하고, cmd창에 다음과 같은 명령어를 실행한다. $ node src Listening to port 4000 node src를 입력하게 되면 다음과 같이 Listening to port 4000이라는 문구가 나오며, 웹브라우저 http://localhost:40..
리액트를 배우기 앞서 필자는 노드를 설치하게 되었습니다. yarn을 사용하기 위해서는 Node.js를 먼저 설치를 해야 한다고 한다. 그래서 설치를 진행해보려고 한다. 참고로 필자는 window 10 Pro 사용자이다. 먼저 Node.js사이트를 방문한다. 다음과 같은 화면이 보이게 된다. 필자는 12.18.4 LTS버전이며 이후에는 그 윗단계 버전으로 '안정적, 신뢰도 높은'이라는 부제목이 있는 곳을 클릭한다. 다운이 완료되었다면 다운된 폴더로 가서 더블클릭을 한다. 초기화면으로 Next를 클릭한다. 라이선스 및 동의를 표시하므로, 체크 후 Next를 눌러준다. 노드를 어디에 설치를 할지 결정을 한다. 필자는 노드 설치 후 특별히 무언가 설정을 하러 찾아간 적이 없기에 기본 설정된 값을 그대로 두고 N..
- Total
- Today
- Yesterday
- redux
- 파이썬
- 리액트 썸네일
- node
- 리액트
- Switch
- array
- 리덕스
- Visual Studio Code
- CSS
- node-sass
- 프로그래머스
- 함수
- github
- 노드
- 자바
- 뷰
- 배열
- 재공부
- programmers
- Git
- react
- Coding Test
- 코딩테스트
- mongodb
- 리액트 유튜브
- java
- javascript
- 자바스크립트
- node.js
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |