320x100 Projects/NodeBoard16 글 수정 기능과 글 리스트 페이징 가장 먼저 해야할 것은 update.ejs의 작성이다. update.ejs 수정하기 수정하기 취소 update.ejs 는 기본적으로 write.ejs에서 약간 변형하였다. 작성자와 게시판 종류를 수정할 수 없도록 하고, code라는, 암호화된 비밀번호를 가져온다. 이 이유는 수정 화면에서 제출을 선택했을 때 어떤 글을 수정할 것인지를 id로 판단한다면 수정 화면에서 post의 id만 바꿔서 엉뚱한 글을 수정해버릴 수 있기 때문이다. 이를 막기 위한 조치이다. modify.js var express = require('express'); var router = express.Router(); var db = require('../db-query'); router.post('/',function(req,re.. 2021. 2. 27. 글 삭제 기능 제작 먼저 할일은 수정,삭제 버튼과 비밀번호 입력input의 추가이다. view.ejs (생략) 추천하기버튼 삭제 수정 (생략) CSS #modify-btn,#delete-btn{ margin: 2px; float:right; } #delete-password{ float:right; margin: 2px; font-size: 21px; } 해당 글이 비로그인 유저가 쓴 글인 경우만 수정,삭제 버튼을 노출한다. 만약 로그인 유저가 쓴 글이라면 해당 유저로 로그인하고 자신이 쓴 글을 보아야만 삭제 버튼이 보이도록 추후에 수정할 것이다. modify-or-update div에는 수정,삭제 버튼과 비밀번호를 입력하기 위한 input을 집어넣었다. post가 보내는 정보는 글 id와 Password이다. 굳이 onc.. 2021. 2. 26. 글 작성 기능 제작 먼저 글 작성 버튼을 만들어줘야 한다. HTML 글쓰기 CSS #wrap-upper{ height: 40px; width: 1180px; margin: 0 auto; } 버튼은 예쁜 부트스트랩의 것을 그대로 사용할 것이다. 이제 글쓰기 페이지를 작성한다. ejs 글쓰기 글쓰기 취소 자유게시판 유머게시판 CSS #wrap-inner-post{ margin: auto; display: flex; justify-content: center; flex-direction: column; } #write-box{ height: 900px; max-width: 900px; min-width: 900px; border: solid 1px gray; display: flex; flex-direction: column; .. 2021. 2. 25. 글 조회 페이지 작성 먼저 사이드바에 각 게시판으로 이동하기 쉽도록 카테고리를 만들고 링크를 건다. 전체글 보기 자유게시판 유머게시판 그리고 글 리스트에서 해당 글의 제목을 누르면 글로 이동할 수 있도록 링크를 걸어둔다. 링크는 글의 ID를 기준으로 생성한다. 그리고 해당 링크를 클릭했을 때 나오는 조회 페이지의 레이아웃을 작성했다. view.ejs 글 제목 작성자 / 게시판 조회수 본문 내용 (추천수) 추천하기버튼 style.css #view-left{ min-height: 500px; max-width: 900px; min-width: 900px; margin-right: 30px; } #wrap-inner-view{ padding-top: 150px; min-height: 1100px; display: flex; jus.. 2021. 2. 24. 이전 1 2 3 4 다음
