EJS, MongoDB

🪐 C:on·2021년 9월 7일
0
post-thumbnail

👉 EJS 사용

클라이언트에게 보낼 html파일에 자바스크립트 문법을 쓰고 싶거나 서버에서 전송한 context를 html에서 변수명으로 유동적으로 적용하고 싶을 때 ejs를 사용한다.

먼저 npm i ejs로 모듈을 설치해준다.

설치가 끝나면 app.js상단에 app객체가 선언된 코드 뒤에 app.set('view engine', 'ejs');를 작성한다.

그리고 views폴더를 만들어서 그안에 html파일의 확장자명을 ejs로 바꾼뒤 옮겨준다.

context는 <%= %>로 사용하고
자바스크립트 문법은 <% %>로 사용한다.

👉 MongoDB사용

앞에서 말했듯이 데이터베이스는 비교적 다루기 쉬운 NoSql을 사용하기로 한다.
Nosql은 sql을 사용하지 않는 DB로 여러 종류가 있는데 그 중 mongoDB를 사용할 것이다.

mongoDB를 구축하는 것은 이 블로그에 잘 설명되어있어서 참고하면 될 것 같다.

구축이 끝나면 nodejs에서 mongodb모듈을 사용해서 연동해보자.

import mongodb from "mongodb"
const MongoClient = mongodb.MongoClient;

MongoClient.connect('<mongoDB호스팅URL>', (err, client)=>{
  if (err){ 
    return console.log(err);
  }
  app.listen('8080', ()=>{
    console.log('listening on 8080')
  });
})

app.js에 mongoDB에 먼저 연결한 후 서버가 구동되도록 코드를 작성해봤다.

👉 mongoDB Insert

db = client.db('DB이름');

내 DB에 있는 어떤DB를 참조할거다라는 의미로 생각하면 된다.
몽고DB에서 db를 이름과 함께 생성하고 그 이름을 적어준다.

db.collection('post').insertOne( {name : 'con', _id : 100} , (err, result)=>{
  console.log('저장완료'); 
});

참조할 db에 post라는 collection을 먼저 생성한다.
그리고 post 문서에 데이터 하나를 추가해보자
추가할 데이터는 object 형태로 기입할 수 있다.

👉 MongoDB Read

app.get('/list', (req,res)=>{
  db.collection('post').find().toArray((err, data)=>{
    res.send(data)
  }
})

/list의 요청을 받았을 때 몽고 DB에서 데이터를 하나 가져와서 응답한다.
이때 toArray는 가져온 자려를 배열로 변환하는 API이다.

가져온 데이터를 html로 보낼때는 render함수의 두번째 파라미터에 object를 넣어주면 된다.

app.get('/list', (req,res)=>{
  db.collection('post').find().toArray((err, data)=>{
    res.render('list.ejs', {posts:data})
  }
})

👉MongoDB Auto Increment

mongoDB는 auto increment 기능이 없기 때문에 total을 저장할 문서를 하나 생성해서 직접 구현해야한다.

counter라는 collection을 생성하고 total값을 update 한다.

app.post('/add', (req,res)=>{
  db.collection('counter').findOne({name : '게시물갯수'}, (err, result)=>{
    const totalCnt = result.totalPost;
    db.collection('post').insertOne( { _id : (totalCnt + 1), 제목 : req.body.title, 날짜 : req.body.date } , (err,result)=> {
      db.collection('counter').updateOne({name:'게시물갯수'},{ $inc: {totalPost:1} }, (err,result){
	if(err){return console.log(err)}
        res.sendSatus(201);
      })
    });
  });
  
});

흐름은 이렇다.
1. /add 로 post요청이 들어온다.
2. counter라는 콜렉션에서 게시물갯수를 이름으로 가지는 문서를 가져와 콜백함수의 result로 전달한다.
3. 총 개시물의 개수를 사용하기 쉽도록 result의 totalPost가 totalCnt라는 변수에 저장한다.
4. insertOne 메서드로 게시물을 증가한 개수와 함께 저장한다.
5. 게시물개수 문서의 총 게시물 수도 update한다.
6. 성공적으로 요청이 수행되었음을 201상태코드로 응답해준다.

0개의 댓글