03. CRUD - 글쓰기 게시판 만들기

간단한 글쓰기 게시판을 write.html로 만들자

<form method="post" action="/write">
    <ul>
        <li>
        	제목 : <input type="text" name="subject"> 
        </li>
        <li>
        	작성자 : <input type="text" name="username">
        </li>
        <li>
        	작성일 : <input type="text" name="date">
        </li>
    </ul>
    <input type="submit" value="write">
</form>

 

 

list.html에는 write.html로 갈 수 있는 버튼을 만들어줬다.

<a href="/write">글쓰기</a>

 

 

server.js에 write.html과 연결해준다.

app.get('/write',(req,res)=>{
  res.render('board/write')
})

 

---

글 쓴 내용을 응답 받을 수 있도록 만들자

우리는 이미 위에서 post 명령문을 날리는 form 을 사용했다.

그러면 정말 post 응답을 하고 있는건지 확인하기 위해서 server.js에서 다음 코드를 입력해준다.

app.post('/write',(req,res)=>{
  console.log('post문 응답합니다!')
})

잘 응답하고 있음 확인.

 

 

입력란에 입력하고, 다음처럼 코드를 바꿔서 실행을 해보면 엄청나게 긴 값을 받을 수 있다.

app.post('/write',(req,res)=>{
  console.log('post문 응답합니다!')
  console.log(req);
})

우리가 필요한 값은 여기서 body라는 값이다.

 

app.post('/write',(req,res)=>{
  console.log('post문 응답합니다!')
  //...은 spread 문법으로 req.body의 내용을 가져온다.
  let board = {...req.body}

  // list 안의 배열을 test 안에 담는다
  let test = list.list

  // 배열test 안에 board 배열을 밀어넣는다
  test.push(board)
  console.log(test)

  //list주소로 다시 보내는 redirect
  res.redirect('/list')
})

 

입력한 값이 무사히 배열에 반영되어서, 리스트에서도 반영이 된것을 확인할 수 있다.