-
2차 프로젝트 - 서블릿을 통한 웹페이지 서버, jsp로 페이지 구현자바 초보개발/JSP-Servlet 2024. 2. 13. 17:51
프로젝트 간 내 역할과 목표
5개월동안 내가 팀원들과 의논해서 결정한 내 역할은 팀장이었고, 상품 관리를 담당했다. 그렇기 때문에 프로젝트를 진행하면서 팀원들과의 의사소통은 잘 일어날 수 있도록 하는데 특히 신경썼다.
수업에서 중점적으로 배웠던 것이 서버사이드에서 데이터를 다루는 것이었기 때문에, 데이터의 처리와 관리에 우선적으로 신경쓰는게 좋을 것이라 생각했다.
그래서 이번 프로젝트에서 내가 우선순위로 두었던 것은, 요구사항 정의에 대한 정보 전송과 교환, 데이터 표시만 되도록 최대한 빨리 구현하는 것이었다. 디자인과 최선의 구현방법에 대한 것은 우선순위에서 좀 내려놓았다.
그냥 학원에서 일시적으로 정한 역할일 뿐이지만, 팀장으로써 어떤 방식으로 팀 프로젝트를 진행할지 회의를 주도했을 때, 팀원들도 내가 우선순위로 둔 "데이터 전송과 표시" 를 우선 구현하기로 합의했었다.
의사소통이 중요하다고 생각은 하지만, 프로젝트 기간은 한정되있고 나도 배우는 입장이기에 직접 코딩해보는 시간을 더 중요하게 생각해서 하루에 1~2번 정도로 회의를 제한하고 나머지는 코딩에 집중했었다.
문서화작업을 완료하고, 기초 코딩을 전부 완료했을 때 시간이 60%정도 남았다. 다행히도 내 최선의 목표였던 데이터 전송과 표시는 완료했다.
최초 화면과 코드
상품 등록의 최소한의 화면구현. 서버쪽으로 데이터를 넘길수만 있을 정도로 구현했다. 작성 코드
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <form action = "write.do" method = "post" enctype="multipart/form-data"> <br> <div> <label for = "image">이미지</label> <input type = "file" id = "image" name = "itemImage" > </div> <div> <label for = "category">카테고리</label> <select id = "category" name = "category"> <option value = "1">옷</option> <option value = "2">사료</option> <option value = "3">간식</option> <option value = "4">건강 관리</option> <option value = "5">목욕</option> <option value = "6">장난감</option> <option value = "7">잡화</option> </select> </div> <div> <label for = "producer">제조사</label> <input type = "text" id = "producer" name = "producer" > </div> <div> <label for = "itemName">상품명</label> <input type = "text" id = "itemName" name = "itemName" > </div> <div> <label for = "itemName">상품설명</label> <textarea rows="5" cols="60" style="resize: none;"></textarea> </div> <div> <label for = "itemPrice">가격</label> <input type = "text" id = "itemPrice" name = "itemPrice" > </div> <div> <label for = "discount">할인가</label> <input type = "text" id = "discount" name = "discount" > </div> <div> <label for = "rate">할인율</label> <input type = "text" id = "rate" name = "rate" > </div> <div> <label for = "startDate">판매 시작일</label> <input type = "text" id = "startDate" name = "startDate" > </div> <div> <label for = "endDate">판매 종료일</label> <input type = "text" id = "endDate" name = "endDate" > </div> <button >등록하기</button> <button type = "reset">초기화</button> </form> </body> </html>이런식으로 상품관리에 필요한 모든 페이지, 코딩을 최소한으로 작성해서 입력받은 데이터가 처리되어 DB에까지 직접 정보전달이 되는것을 확인한 후 다른 팀원들의 경과를 확인했다.
내 코딩 역할을 마무리 한 뒤, 팀원들이 어느정도 코딩을 했는지 자세하게 점검하고, 방향에 맞춰서 잘 진행하고 있는지를 확인하는 시간을 가졌다.
이 시간을 거치면서 문제점을 몇 발견했다. 학원에 몇일간 출석하지 못한 사람은 이제 막 시작한 때여서 중간점검을 할 수가 없었고, 디자인을 신경쓰느라 하루를 완전히 보낸 사람이 있었고, gpt를 통해 코드를 작성해 자신이 어떤 코드를 썼는지 제대로 이해하지 못하는 사람도 있었다.
첫번째로, 이제 막 시작한 사람에게 어떤 피드백을 줄수는 없었다. 그저 도움이 필요하면 빠르게 말해달라고 요청하는 수밖엔 떠오르지 않았다.
두번째로, 다시한번 디자인은 최대한 나중에 신경쓰고 우리가 처음 목표했던 대로 정보처리가 제대로 되는지만 확인 가능한 정도로 만들 수 있게 코딩할것을 당부했다.
세번째로, 우리가 수업때 배웠던 것들을 쓰되, 새로운 코드를 쓰면, 그 코드가 어떤 코드인지 조사해볼 것을 부탁드렸다.
이 문제점들을 해결하기 위해서 회의시간이 될때마다 여러번,
"수업때 배운것을 기반으로 요구사항을 충족하기 위해 필요한 데이터들을 처리하고 DB까지 제대로 전송 되는지"
를 확인해달라 요청했다.
팀 전체적인 진행을 위해 내 시간을 다른사람들에게 꽤 투자했는데, 몇몇의 진행도는 꽤나 올라갔지만, 디자인에 관심을 많이 가지거나 잘 모르는 코드를 가져와서 쓰는 것에 대해서는, 내가 여러번 말씀 드리는 것으로는 해결이 불가능하지 않을까 싶은 생각이 들게 되었다.
그런데 요즘 나는 내가 통제할 수 있는 일인 내 생각과 행동에 집중하고, 다른사람의 생각이나 행동은 내가 통제하려고는 하지 않는다. 이후 회의에서 매번 같은 얘기를 하는듯 해서 조금 힘들었지만, 진행상황을 확인하고 목표했던 것만 생각하길 당부하길 멈추지 않았다. 그러나 그 이상 더 강압적인 방식이나 분노를 보여주며 강제로 그들의 행동을 바꾸려 하지는 않았다.
가격 테이블을 어떤식으로 구현할 것인가?
가격테이블을 구현할 때, 사용자가 가격을 관리하는 페이지로 이동한 뒤에 가격정보를 관리하도록 할것인지, 아니면 상품 상세보기 페이지에서 바로 가격관리를 할 수 있게 할것인지 고민했다. 페이지를 이동한 뒤에 가격정보를 입력하는게 나에게는 더 쉬운 방법일 것 같았다.
그런데 사용자 입장에서는 페이지를 여러번 이동하는 것은 번거로울 수도 있을 거란 생각이 들어서, 최대한 상품 상세보기 페이지 안에서 가격을 관리할 수 있는게 좋을 것 같다는 생각이 들었다.
상세페이지 구현 화면 그래서 위 화면처럼 가격테이블이 너무 많은 공간을 차지하지는 않게 overflow 속성을 주었고, 등록 폼도 현재 페이지에 넣고 수정을 클릭시 해당 행을 input 태그로 바꾸도록 처리하였다.
수정 클릭시 태그 변환 내가 아는 한에서는 최대한 공간을 제한하면서 사용자가 편할 수 있도록 만든 것 같은데, 아마 이게 최선일 거라고는 생각하지 않는다. 앞으로 코딩을 배울때도 내가 할 수 있는 것과 그걸 통해 사용자가 어떻게 편리하게 사용할 수 있는가도 중요하게 고려할 사항이라고 생각한다.
완성된 페이지를 보면서 든 생각은 이전에 등록한 가격기록을 삭제하는 것이 좋은지 추가로 고민해 볼수 있겠다는 것이엇다.
현재는 가격 기한을 등록하면, 해당 기한 내의 다른 가격정보들의 날짜를 자동으로 바꾸게 된다. 그래서 현재 가격으로는 설정되지 않되, 테이블 기록에는 해당 가격이 얼마였는지가 남는다.
**
개인적인 생각으로는 기록이 남아서 나중에 그 기록을 볼 수 있는 것도 정보관리에서는 좋고, 그냥 기한이 겹치는 가격을 삭제하는 것은 메모리 관리 측면에서 좋은 것 같았다. 현재는 겹치는 날짜의 가격정보가 무조건 남고, 시작 날짜가 9999년으로 남도록 해두었는데, 이를 더 개선하기 위해서 시작 날짜가 9999년인 가격정보를 일괄 삭제하는 버튼을 추가하면 사용자가 필요하면 기록을 남겨두고, 필요없다고 판단하면 가격정보를 편하게 관리할 수 있을 것 같다.
난관 - CSS 적용의 어려움
부트스트랩이 적용된 요소들에 대해서 class를 추가로 입력해 , 해당 클래스들에 css 조작을 추가로 하고싶었으나 적용이 힘들었다.
왜그런지 조금 찾아보니 부트스트랩의 css 적용 우선순위에 따라서 클래스 선택자는 최우선 중요도가 아니라고 한 것 같다.
디자인을 신경쓰기엔 시간이 많이 남지 않아서 일일히 찾아보고 개별로 적용하는 식의 디자인은 시간에 맞춰서 프로젝트를 진행하는 것을 불가능하게 만들 것 같았다. !important 를 사용할 수도 있을것 같긴 했지만 css 작성자에게 그다지 권유되는 사항이 아닌 것 같아, 모든것에 !important를 붙이는 것도 해결방법 중에서 제외했다.
결국 css가 필요한 태그마다 직접 style 요소를 입력해서 코드를 작성하기로 결정했다. 코드가 난잡해지지만, 다른 방법보다는 문제사항이 더 적을 것 같았고, 부트스트랩 적용 클래스와 상관 없이 css가 적용되었기 때문이다.
부트스트랩을 처음 접했을때는 정말 디자인을 쉽게 할 수 있게 해주는 좋은 도구로만 보였는데, 막상 내가 원하는식으로 디자인을 적용하려니 오히려 더 복잡해지는 것 같았다.
단점이 없는 도구가 어딨겠는가? 다음엔 부트스트랩을 사용하지 않고, 직접 모든 css를 적용해서 좀더 내가 원하는 식으로 디자인도 해보고 싶다.
최종적으로
이번 프로젝트에서는 내가 맡은 부분을 최소한의 완성상태로 만들어 놓고, 다른 모듈들은 프로토타입 완성이 조금 걸려서 최대한 각 부분마다 기본기능은 만들려고 돌아다니며 오류나 구현방식을 도운 것 같았다. 그런데도 프로젝트가 끝날 때 까지 모든 모듈의 요구된 기능을 구현하지는 못한 것 같다.
다음 프로젝트는 마지막인 만큼 좀 더 내 개인적인 모듈을 신경써야 할 것 같다는 생각이 들었다. 결국 내가 팀원들을 모두 챙기고 싶어도, 나도 배우는 입장이고 모든 문제점을 해결해주는 만능 해결사는 아니기 때문이다.
이번 프로젝트를 진행하면서, 나도 수업때 배우지 않은 코드를 몇 적용했는데, 어떤 원리로 코드가 작동하는지 하나하나 분석해서 이해하려고 했었다. 이해하지 못하는 코드를 남발하게 되면 더이상 코딩이 불가능해지는 수준이 될 수 있다는 것을 프로젝트 중에 크게 깨달아서 새로운 코드를 쓸 때는 지금처럼 꼭 이해를 해야겠다는 다짐을 하게되었다.
또 앞으로도 우선순위를 생각해서 가장 중요하다고 생각하는 부분부터 점진적으로 만드는 걸 이어가야겠다. 이런 마음가짐이 꽤 코딩에 도움이 되는 것 같다.
'자바 초보개발 > JSP-Servlet' 카테고리의 다른 글
JSP - 날짜 데이터 입력시 날짜 선택화면 띄우기 (0) 2024.01.19 다른 jsp파일을 현재 jsp파일 페이지에 불러오기 - include (0) 2024.01.17 [오류] For input String : "null" 와 Missing end tag for "c : out" (0) 2024.01.08 Servlet을 통한 MVC 모델 구현 개인정리 (1) 2024.01.04 JSP/Servlet에서의 파일 업로드 (0) 2023.12.26