분류 전체보기
-
socket.io로 로그인 알리기Project using node.js/Cloning Catch-Mind 2020. 12. 14. 14:24
socket.io로 로그인 알리기 // globalRouter.js globalRouter.post(routes.login, onlyPublic, postLogin, notifyLogin); login 부분에서 postLogin 뒤에 notifyLogin을 추가한다. 사용자가 로그인을 하면 게임을 하고 있는 모든 사용자에게 알림이 가도록 한다. import events from "../events"; import io from "../server"; const superBroadcast = (event, data) => io.emit(event, data); export const postLogin = passport.authenticate("local", { // successRedirect: rout..
-
Client가 서버의 변수 공유하기Project using node.js/Cloning Catch-Mind 2020. 12. 14. 14:20
socketIO // server.js import socketIO from "socket.io"; import { socketController } from "./socketController"; const server = app.listen(PORT, handleListening); const io = socketIO(server); io.on("connection", (socket) => socketController(socket, io)); export default io; socket.io는 브라우저와 서버가 실시간으로 event 기반으로 양방향 통신을 할 수 있게 하는 라이브러리다. // socketController.js export const socketController = (socket..
-
gulpProject using node.js/Cloning Catch-Mind 2020. 12. 14. 09:57
설치 npm install gulp gulp-sass node-sass gulp-autoprefixer gulp-csso del gulp-browserify babelify gulp gulp를 실행시킬 수 있다. package.json에서 "scripts"에 "dev:assets" : "gulp"를 설정함으로써 gulp를 실행시킬 수 있다. gulp-sass Sass plugin for gulp node-sass node.js에서 sass를 사용할 수 있게 하는 모듈이다. gulp-autoprefixer Prefix CSS with Autoprefixer gulp-csso Minify CSS with CSSO. CSS 파일의 공백을 없앰으로써 파일 크기를 줄인다. del Delete files and d..
-
login on Catch MindProject using node.js/Cloning Catch-Mind 2020. 12. 13. 20:05
Sign up을 통해서 저장한 사용자 정보로 이제 로그인을 해야 한다. 웹 애플리케이션에 로그인을 하면 서버는 세션 키를 준다. 이 세션 키를 가지고 있음으로써 로그인이 유지가 된다. 만약 내가 브라우저를 다 끄고 다시 키 애플리케이션에 접속하면 키 값은 소멸되어서 다시 로그인을 해야 한다. 이러한 기능을 구현하기 위해서 설치할 두 가지가 있다. #npm install express-session connect-mongo express-session은 cookie-password를 생성하고 connect-mongo는 쿠키 값을 mongoDB에 저장하게 한다. app.js import session from "express-session"; import MongoStore from "connect-mong..
-
Sign up - ControllerProject using node.js/Cloning Catch-Mind 2020. 12. 13. 19:13
Mongo DB // db.js import mongoose from "mongoose"; mongoose.connect(process.env.MONGO_URL, { useNewUrlParser: true, useUnifiedTopology: true, useFindAndModify: false, }); const db = mongoose.connection; const handleOpen = () => console.log(`✅ Connected to DB`); const handleError = (error) => console.log(`❌ Connection ${error}`); mongoose.set("useCreateIndex", true); db.on("error", handleError); ..
-
Show sign up and login pagesProject using node.js/Cloning Catch-Mind 2020. 12. 13. 17:20
Router 관리 routes.js라는 파일을 작성해서 모든 URL을 관리한다. middlewares.js 파일에서 localMiddleware() 라는 함수를 작성하였다. res.locals를 이용해서 .pug 파일에 변수를 전달할 수 있다. 이 함수는 server.js에서 middleware로 사용했다. globalRouter.js에 sign-up과 관련된 Router를 추가했다. get방식이나 post 방식이 왔을 때 getSignUp이나 postSignUp 함수를 실행한다. postSignUp은 회원 가입을 시도했을 때 작동되는 함수이지만, 아직 제대로 구현을 하지 않아서 res.render()를 사용했다. getSignUp 함수는 사용자가 회원가입 URL로 들어왔을 때 signUp.pug 파일을..
-
Server setupProject using node.js/Cloning Catch-Mind 2020. 12. 12. 11:30
Middleware 설치 # npm install morgan body-parser 웹 페이지 만들기 # npm install pug app.set("view engine", "pug")으로 pug engine을 nodeJS에 추가한다. app.set("views", join(__dirname,"views"))로 app.js 파일 기준으로 views 디렉토리를 찾아서 path에 추가한다. app.use("/", globalRouter)로 "/" url에 접속하였을 때 globalRouter를 실행하도록 한다. "/" url로 get 요청이 왔을 때 globalRouter.get("/", home)을 실행한다. home은 globalController에 있는 controller 함수다. home.pug를 ..