유튜브 클로닝 #5-5 MongoDB: Mongoose 이용해 불러온 데이터 이용하기

이현정·2022년 4월 14일

.find()mongoose youtube 강의

🔖 강의 범위: #6.12 ~ 6.14

Preview

저번 시간에는 CRUD 작업을 하기전 설정을 위해 mongoose.Schema, mongoose.model() 을 이용하여 db 에 보낼 데이터 형식을 정의해주었다.

이번시간에는 .find 매서드를 이용해 만들어진 데이터 형식으로 데이터를 요청하고 받아오는 것까지 해보자.

강의 내용

데이터 요청(쿼리 생성)

step 0) 서버 파일 리팩토링

다른 작업에 앞서 db 와 관련된 모든 데이터 형식들을 import 할 예정이니 server.js 파일이 길어질 걸 고려해서 깔끔하게 둘로 나누기로 한다.

1) src/server.js: server 설정과 관련된 사항들만 남겨두고,
2) src/init.js: init 파일 하나 생성하여 (initialize, 즉 초기화 담당 파일명이렇게 주로 씀) 서버 열고 닫는 역할을 하는 애들은 여기로 데려옴. + db 연결도 서버 열 때 실행되므로 같이 import 해 올 거임.

import "./db";
import "./models/Video";
import app from "./server";

const PORT = 4000; 

const handleListening = (req, res) => {
    console.log(`🚀 Sever listening on port http://localhost:${PORT}`)
};

app.listen( PORT, handleListening );

nodemon 재설정: nodemon 은 server 가 시작될 때 실행되므로 package.json 에 가서 nodemon 이 봐야할 파일은 server.js 가 아니라 init.js 라고 고쳐줘야 실행시 에러가 나지 않는다.

 "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "nodemon --exec babel-node src/init.js"
  },

step 1) .find() 이용하여 db 불러오기

fake db deleted
import Video models
Video.find(fillter, callback) 🌟
https://mongoosejs.com/docs/api.html#model_Model.find

step 1-1) 불러온 db 콜백함수로 사용하기 🌟

import Video from "../models/Video";


export const trending = (req, res) => {
  Video.find({}, (error, videos)=> {
    return res.render("home", { pageTitle:"Home", videos });
  })
}

! 여기서 callback 함수 다루는 이유
콜백함수는 나중에 발동된다. db의 경우 자바스크립트 관할을 떠나기 때문에 여러 변동사항이 생길 수 있어서 이러한 변동사항에서도 프로그램이 정상적으로 돌아갈 수 있도록 데베 관련 함수는 콜백함수로 두어 나중에..프로그램 다 돌아가고 난 후에 실행되도록 설정하는 것이다.

step 1-2) 불러온 db promise 이용하여 사용하기 🌟

model.find( filter ) 로는 데이터를 찾는데서 그치고, callback 대신 promise 문법을 활용하여 함수를 만드는 법을 배울 것이다.

promise 문법은 async(비동기) 와 await(수행될 때까지 기다려준다) 키워드를 이용하여 데이터베이스가 데이터 찾을때까지 기다려주는(다음 것이 먼저 수행되는 것을 막음) 문법을 지칭한다.

export const trending = async (req, res) => {
  const videos = await Video.find({});
  return res.render("home", { pageTitle:"Home", videos });
}

에러는 try-catch문으로 잡는다.

export const home = async (req, res) => {
  try {
    const videos = await Video.find({});
    return res.render("home", { pageTitle: "Home", videos })
  } catch (error) {
    console.log("server error", error)
  }
}

🌟 요약하면, callback 은 함수 안에 불려온 함수로 불러온 함수(고차함수)에 의해 실행 시점에 정해진다. 이 경우 고차함수인 .find 는 런타임 후 콜백함수를 실행하도록 설정했다고 한다. await 은 await 을 건 함수가 제대로 실행될 때까지 기다려주는 것. 실행되기 전까지 다음 코드로 넘어가지 않는다. 데이터가 덜 넘어왔는데 다음 코드가 실행되어서 에러가 나는 사태를 방지해준다.

여기서 위의 callback 함수는 함수 trending 안에 있다. 함수 안의 함수인 셈. 이러한 함수 안의 함수는 return 을 한다고 해도 trending 은 그 어떤 결과도 return 하지 않는다. 함수 안에 함수가 return 을 쓰는 경우는 그저 이 다음에 아무 명령도 하지 말라, 라는 실수방지용이다. 실제 뭔가를 return 하는게 아니라.

추가 공부 ？

callback vs. promise(async, await) 에 대해 알아보기

model.find( filter, callback ) 매서드를 이용해서 filter 조건에 부합하는 데이터를 db 에서 찾고, 그 결과를 받아 특정 기능을 수행할 함수를 설정했었다. 이 때 이 함수는 db 상태에 따라 발동이 안될 수 도 있으므로 에러가 나더라도 전체 앱 실행에 문제는 없도록 '앱 프로그램이 전부 실행된 후' 실행되도록 하는 callback 함수로 설정되어 있다.

*콜백함수에 대한 개념은 모던 자바스크립트 12장 함수 부분에 잘 정리되어 있었다. 다시 한 번 읽어보자.