프로젝트

2주 프로젝트 - 12일차, 13일차

록's 2023. 4. 23. 17:03
728x90
반응형

글을 작성할 때 부족한 점이 많지만 기록을 하기위해 적었습니다. 수정해야할 부분이 있다면 추후 수정할 예정입니다

 

 

2주 프로젝트 12일차

댓글 기능을 성공했고 이제 그 이후의 기능 , 댓글 삭제, 수정 그리고 html 과 css 를 수정해야했다.

 

 

댓글 html, css 을 수정했는데 임시로  기능들을 넣어뒀고 

 

 

 

글을 작성하고 글을 클릭해서 상세페이지에 들어가면 

 

 

이렇게 보여지고 

댓글부분에 (익명)이라고 표시를하고 앞에 캐릭터 이미지를 넣어서 댓글을 쓰면 저렇게 나타나게 만들었다.

 

그리고 연필부분을 누르면 댓글이 수정이 되게 할 예정이고 휴지통을 누르면 지금은 댓글이 삭제 되는걸 볼 수 있다.

 

 

 

// html

<div class="form-group">
                  <label for="commentList"><strong>댓글 목록</strong></label>
                  <div class="comment-list-container">
                      <ul id="commentList">
                          <li class="reply-list" th:each="reply: ${replies}">
                              <img th:src="@{/img/panda.png}" alt="판다캐릭터">
                              <span class="reply-author">(익명)</span>
                              <span th:text="${reply.reContent}" style="display:none;"></span>
                              <textarea class="form-control" style="border: none; resize: none;" readonly th:text="${reply.reContent}"></textarea>
                              <div class="btn-group" style="float: right;">
                                  <!-- 수정 버튼 -->
                                  <button type="button" class="btn btn-primary btn-sm btn-comment-action"
                                          th:data-reid="${reply.reId}"
                                          th:data-recontent="${reply.reContent}"
                                          onclick="editReply(this)">
                                      <img src="/img/edit.png" alt="Edit" width="16" height="16">
                                  </button>
                                  <!--th:value="${replyFormDto.board}"-->
                                  <!-- 삭제 버튼 -->
                                  <form th:action="@{'/hbrg/' + ${reply.reId} +'/delete' }" method="post"
                                  th:object="${BoardFormDto}">
                                      <input type="hidden" value="delete"/>
                                      <input type="hidden" name="boardId" th:value="${BoardFormDto.boardId}"/>
                                      <button type="submit" class="btn btn-danger btn-sm btn-comment-action">
                                      <img src="/img/delete.png" alt="Delete" width="16" height="16">
                                  </button>
                                  </form>
                              </div>
                          </li>
                      </ul>
                  </div>
              </div>



              <form role="form" method="post" enctype="multipart/form-data" th:object="${replyFormDto}">

                  <!-- 댓글 부분 -->
                  <div class="form-group">
                      <label for="inputComment"><strong>댓글</strong></label>
                      <div class="comment-container">
                          <input type="hidden"  th:field="*{board}" th:value="${replyFormDto.board}">
                          <input type="text" th:field="*{reContent}" name="comment" class="form-control comment-input" id="inputComment" />
                          <button type="submit" class="btn btn-primary btn-comment btn-sm">댓글달기</button>
                      </div>
                  </div>
              </form>

 

댓글 삭제 

controller

   // 댓글 삭제
    @PostMapping("/{reId}/delete")
    public String replyDelete(@PathVariable Long reId, @RequestParam(name="boardId") Long boardId){

        replyService.deleteReply(reId);
        return "redirect:/hbrg/ex02/" + boardId;
    }

 

service

  public void deleteReply(Long reId) {
        replyRepository.deleteByReId(reId);
    }

 

repository

    @Transactional
    void deleteByReId(Long reId);

 

작성하면  댓글이 삭제가 된다. (앞에 연관된 코드들이 몇개있어서) 다른것도 원래 필요한거같다.

 

 

 

 

2주 프로젝트를 마치며

 

각자의 역할을 다 수행을 하고 2주 동안 프로젝트를 하면서 많은 실패와 성공이 있었다.  로그인 페이지의 카카오 로그인, 일반 로그인, 회원가입 페이지, 회원가입, 메인 페이지 글작성, 글 내용리스트, 글번호, 제목, 조회수, 좋아요, 생성일 등 표시가 되었고 글 쓰기를 하여 제목, 내용, 첨부파일, 글 쓰기 저장, 목록가기 를 만들었고 해시태그는 만들지 못했다.. 아쉬웠고 ㅜ 글 수정도 할 수 있게 하고 댓글 기능 대댓글 기능 등  댓글삭제, 대댓글 삭제 까지 할 수있었지만 수정하는것은 시간이 부족해서 하지 못했다.. 글 목록에서 글을 들어가서 보면 좋아요 버튼을 누르면 메인페이지의 리스트에 좋아요 1이 올라가고 다시 좋아요 버튼을 누르면 좋아요가 0 이되는 방식으로 사용했다. 

 

결과적으로 몇가지 기능을 넣지 못했지만 시간이 부족해서.. 그래도 우리 조원들이 끝까지 포기하지 않고 할 수 있는 부분까지 최선을 다했고 다들 잘한다 잘한다 하면서 조원들 끼리 뭉쳐서 서로 도와주면서 페이지를 만들어 나갔었다. 

 

기능이 잘 안될때 좌절도 많이 했지만 끈질기게 계속 잡고 포기를 하지 않고 끝까지 최선을 다해서 기능을 구현 하였다.

물론 구현을 못한 기능도 있었지만 다음에 추후 공부도 할겸 업데이트를 해볼 생각이다. 

 

 

 

 

728x90
반응형