서버에 전송된 데이터를 html에 나타내보기(ejs활용)

먼저 EJS 설치
1. npm install ejs 설치
2. 메인.js 상단에

app.set('view engine', 'ejs');

3.표시될 html파일을 ejs형식으로 변경
Tip : <%= %> : ejs 파일에 서버 데이터를 넣는법 이것 대신 react 데이터바인딩도 가능

활용 EX

app.set('view engine', 'ejs'); // 선언

app.get('/list', function(요청, 응답){
db.collection('ring').find().toArray(콜백함수); ( 모든 데이터 가져온다는 문법)
console.log(결과)
응답.render('list.ejs', { posts : 결과 });
})

상단
app.set('view engine', 'ejs');

get 방식
app.get('/list', function(요청, 응답){
응답.render('list.ejs');
})

ejs파일은 views폴더안에 넣어야함 - > 그렇지 않으면 오류뜸

외우기
db.collection('dingGa').find().toArray(콜백함수); ( 모든 데이터 가져온다는 문법)

최종 정리 ex

npm install ejs 설치서버에 전송된 데이터 보여줄 ejs 파일 만들기

-- 서버.js 파일 -- ( 데이터를 list.ejs파일에 보내고 싶다면 아래 형식)
app.set('view engine', 'ejs'); // 선언
app.get('/list', function(요청, 응답){

 db.collection('ring').find().toArray(콜백함수);    ( 모든 데이터 가져온다는 문법)
console.log(결과)
응답.render('list.ejs', { posts : 결과 });

})

.render()라는 함수에 둘째 파라미터를 이렇게 적으면
list.ejs 파일을 랜더링함과 동시에 {posts : 결과} 라는 데이터를 함께 보내줄 수 있습니다.
(정확히 말하면 결과라는 데이터를 posts라는 이름으로 ejs 파일에 보내주세요~ 입니다)

MongoDB에서 데이터를 꺼내고 싶다면
db.collection('컬렉션명').find()
db.collection('컬렉션명').findOne()
이런 식으로 사용하면 데이터를 꺼낼 수 있다.
만약 저장된 모든 데이터를 꺼내달라면

db.collection('컬렉션명').find().toArray()를 사용함
tip : .find().toArray()라고 적으면 collection('컬렉션명')에 있는 모든 데이터를 Array 자료형으로 가져옵니다.

[자료1.... , 자료2.... ] 이런식으로

좋은 웹페이지 즐겨찾기