본문 바로가기

분류 전체보기

(291)
EJS공부 & 팀원 코드 이해하기2 EJS공부 & 팀원 코드 이해하기2 이미지 파일 삽입 📄laundryApply.html 부트스트랩 이미지파일 input let myimg = $('#myimg').val(); 📌 사용 패키지(Terminal) npm install --save multer 📄 routes/workroutes.js // 파일 업로드를 위한 패키지 const multer = require('multer'); const storage = multer.diskStorage({ destination: function (req, file, cb) { cb(null, 'static/img/'); // cb 콜백함수를 통해 전송된 파일 저장 디렉토리 설정 }, filename: function (req, file, cb) { cb(nu..
EJS공부 & 팀원 코드 이해하기1 EJS공부 & 팀원 코드 이해하기1 📄 /controllers/workshow.controller.js const WorkShowService = require('../services/workshow.service'); class WorkShowController { workShowService = new WorkShowService(); getWork = async (req, res, next) => { const WorkShow = await this.workShowService.findAllWork(); res.render('workShow', { datas: WorkShow }); }; } module.exports = WorkShowController; 'workShow.ejs'로 render하..
내일배움캠프 4기_Node 3차 미니프로젝트 병합 39일차 TIL 내일배움캠프 4기_Node 3차 미니프로젝트 병합 39일차 TIL 2023.01.05 - [JavaScript] - 내일배움캠프 4기_Node 3차 미니프로젝트 html 가져오기 📌 ejs 란? Embedded JavaScript 자바스크립트가 내장되어 있는 html 파일 node.js 진영에서 많이 사용하는 템플릿 엔진. html안에 이용해 서버의 데이터를 사용하거나 코드를 실행할 수 있음. 일반 html파일은 태그를 이용해 분리를 시켜야 하지만, ejs는 지정된 태그를 통해 스크립트 내용을 하나의 요소처러 사용할 수 있어 페이지를 동적으로 짜는 것이 수월~ form 태그, input 태그, file태그 & name값을 가지고 가져감. 다른분들이 짠 ejs코드를 보면서 ejs 공부중인데, 어렵다. 하지..
내일배움캠프 4기_Node 3차 미니프로젝트 html 가져오기 내일배움캠프 4기_Node 3차 미니프로젝트 html 가져오기 팀원분이 짠 코드 나도 나중에 써먹기 위해 공부! 📄 logout.ejs (html) 로그아웃 로그아웃 버튼을 넣고 싶은 곳에 이렇게 넣어주면 된다. 📌 CSS 설정 이 버튼을에 대한 설정은 다음과 같이 해주면된다. 버튼 내부의 텍스트는 센터! 오른쪽으로 가게끔!
내일배움캠프 4기_Node 3차 미니프로젝트 정규화&비밀번호 암호화 38일차 TIL 내일배움캠프 4기_Node 3차 미니프로젝트 정규화&비밀번호 암호화 38일차 TIL 2023.01.04 - [JavaScript] - Node.js 3차 미니프로젝트 Node.js 비밀번호 암호화 오늘 회원가입 시 입력받는 정보들 모두 정규화하고 git에 올렸다. merge과정에서 해프닝이 있었지만, 잘 해결됐다. .env 문서에 DB이름도 저장하는게 협업 시 좋은 것 같다. 튜터님의 조언대로 비밀번호 암호화를 했다. 난수와 같이 묶엉서 해시화 해주는데... 난수값을 DB에 저장해야한다. 그래서 User Table의 수정이 필요한데.. 테스트 구현 부분을 아예 안해서... 로그인 부분은 callback함수로 구현하기 힘들어 동일 html에서 구현하지 못했던 부분을 조원분이 구현해 주셨다!!! 내일 이 코..
Node.js 3차 미니프로젝트 Node.js 비밀번호 암호화 Node.js 3차 미니프로젝트 Node.js 비밀번호 암호화 Node.js 비밀번호 hash 📌 활용한 라이브러리 npm i crypto 📄 signup const crypto = require('crypto'); const { User } = require("../models"); const { userType, email, phoneNumber, password, name, address, point } = req.body; const hashPassword = crypto.createHash('sha512').update(req.body.password + 10).digest('hex'); await User.create({ userType, email, phoneNumber, password:h..
내일배움캠프 4기_Node 3차 미니프로젝트 미들웨어 37일차 TIL 내일배움캠프 4기_Node 3차 미니프로젝트 미들웨어 37일차 TIL 2023.01.03 - [JavaScript] - Node.js 3차 미니프로젝트 middleware, auth 2023.01.03 - [JavaScript] - Node.js 3차 미니프로젝트 ejs html적용 2023.01.03 - [JavaScript] - Node.js 3차 미니프로젝트 middleware, local Storage 내일 로그아웃 함수를 따로 폴더에 빼야 한다. 사용자페이지부터 모든 기능구현 페이지에 로그아웃 버튼을 넣어야 하기 때문이다. 내일은 비밀번호 해쉬값으로 db에 저장하고 이메일, 전화번호 정규화 표현을 해야한다. test코드도 작성해 제대로 구현했는지 테스트해봐야 겠다.
Node.js 3차 미니프로젝트 middleware, local Storage Node.js 3차 미니프로젝트 middleware, local Storage 📄 middlewares/auth-middleware.js const jwt = require('jsonwebtoken'); const { User } = require('../models'); module.exports = (req, res, next) => { const token = req.cookies.token; console.log(token); if(!token){ res.status(401).send({ errorMessage: "로그인 후 이용해 주세요." }); return; } try { const { userId } = jwt.verify(token, process.env.SECRET_KEY); const..
Node.js 3차 미니프로젝트 ejs html적용 Node.js 3차 미니프로젝트 ejs html적용 Node.js html 템플릿 적용 📌 방법1. numjucks 이용 const nunjucks = require("nunjucks"); app.set('view engine', 'html'); nunjucks.configure('templates', { express: app, watch: true, }); 📌 템플릿 구성 templates ㄴ login.html ㄴ main.html ㄴ sign.html 2022.12.30 - [TIL] - 내일배움캠프 4기_Node 3차 미니프로젝트 회원가입 35일차 TIL router 와 get method 이용해 res.render("login"); 해주면 된다. 📌 방법2. ejs 이용 const ejs = ..
Node.js 3차 미니프로젝트 middleware, auth Node.js 3차 미니프로젝트 middleware, auth node.js 쿠키 가져오기 필요한 라이브러리 : cookie-parser 📄 app.js const cookieParser = require('cookie-parser'); const app = express(); app.use(cookieParser()); // 쿠키 가져오기 app.get('/api', function (req, res) { console.log(req.cookies); }) 📌 토큰 값이 있을 경우 { token: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOnsidXNlcklkIjo1fSwiaWF0IjoxNjcyNzA5ODA4LCJleHAiOjE2NzI3OTYyMDh9.W..