😵 ~23.11.10/✨ Prj.BuildDiary

추석 연휴 part 3 :: 회원가입 플로우 완, 공지사항 리스트&상세 완

unikue 2023. 10. 3. 21:13

✅ 회원가입 플로우 연결

부트에 회원가입 플로우를 모두 올렸다.

정식 로그인과 id/pw찾는 기능은 빼놓고 일단 회원가입만이라도 (할 수 있는것만이라도...) 정리했음.

 

[로그인화면] - [회원가입] - [회원정보 form 작성] - [가입테스트] - [가입완료] - [로그인 or 홈으로 이동] 한바퀴 돌 수 있음!

▶ 가입테스트시 화면이 튕겨서 새로고침이 될 수도 있으므로 (그럴일 잘 없겠지만) 타임리프를 가지고 선택값이 유지되도록 설정함

 

//타임리프 formating 문법
${#numbers.formatInteger(num,3)}
${param.x}

${#numbers.formatInteger(param.q1,1)}==1

 

mapping될 url 주소도 차곡차곡 정리 중. 다른 팀원들이 내가 담당한 url을 연결할 때 참고할 수 있도록.

 

 

🔥 회원가입에서 앞으로 정리되어야 할 부분

  • 회원정보에서 작성된 폼정보를 가지고 가입테스트 화면에서 (닉네임)님 이렇게 꽂아줘야 한다
  • 가입테스트 db 논의하기
  • 최종화면에선 회원가입 form에 required 설정 모두 넣어주기 (지금은 화면 테스트 하기 어려워서 빼놓았음)

 


 

✅ 공지사항 기본 MVC 연결

공지사항 리스트와 상세보기 화면 모두 서버에 올리기 완료.

피드와 로그인에 이어서 세번째 MVC라 안보고 써봤는데, 자꾸 서비스함수를 쓸때마다 내가 이름을 짓는게 아니라 뭔가 정해진 이름이 있는것 같다는 착각에 빠진다. 왜지..? 일단은 써놓고 다른 서비스함수와 통일감을 주기위해 이름을 비슷하게 수정하며 조정하는 중.

 

MVC보다도 타임리프가 오히려 난관. 수업자료를 안보고 공식문서에서 찾아보려하니 생각보다 하나하나 찾기가 힘든것도 있고 헷갈리는것도 있어서 일단 생각하는대로 써보고 다시 수업자료랑 맞춰보면서 수정했다.

 

<!--for-each 공식문서 -->
<tr th:each="prod : ${prods}">

<!-- 날짜변환식 공식문서 -->
th:text="${#calendars.format(today,'dd MMMM yyyy')}"
<!-- 변경 -->
th:text="${#calendars.format(n.regDate,'yy-MM-dd')}" 

<!-- th:fragment라고 자꾸 실수했던 레이아웃 -->
 <main layout:fragment="main">

<!-- 변수와 삼항연산자 -->
th:with="i=*{importance==0? '일반':'중요'}"

 

//notice.html --------------------------------
<div class="notice-list">
    <ul class="info-box" th:each="n : ${list}" th:object="${n}">
        <ul class="title" th:with="i=*{importance==0? '일반':'중요'}">
            <li th:text="${'['+i+']'}">[필독]</li>
            <li><a th:href="@{notice/detail(s=*{id})}"><span th:text="*{title}">공지제목</span></a></li>
        </ul>
        <ul class="subinfo">
            <li th:text="*{#calendars.format(regDate,'yyyy-MM-dd')}">23.07.10</li>
            <li>조회수 <span th:text="*{hit}">561</span></li>
        </ul>
    </ul>
</div>
  1. for-each로 불러와서 obejct객체로 선언하기도 가능.
  2. 변수로 선언한 i는 속성이 아닌 하나의 변수이자 객체이므로 ${변수}로 사용된다 *{이건 속성 표기법}
  3. 하이퍼링크의 파라미터는 (소괄호를 사용?=${한다}) 헷갈리지말기!

 

 

 

🔥 공지사항에서 앞으로 정리되어야 할 부분

  • pager만들기
  • 중요/일반으로 나누어서 최신데이터 순으로 rownum 붙인 쿼리문 만들기 ▶ 일단 객체 두개로 쿼리처리해봄
  • 글내용에 <br>적용할 수 있는지 알아보기. 엔터키가 안먹어요!

 


 

#️⃣ 공지사항 쿼리문 수정하기

공지사항에 pager 처리를 해보자는 이야기가 나오면서, 그럼 중요공지는 계속 상단에 띄워야 할까? 어떻게 처리해야할까? 라는 논의가 있었다. 

 

처음에는 rownum을 붙여서 가장 최신순으로 정렬을 시키고....를 생각했는데 그럼 2페이지로 넘어가면 상단에 박아놓은 공지개수가 보이질 않는거다. 네*버 카페는 첫페이지에만 중요공지를 올려놓았길래, 그렇게 할까 생각을 하다가 공지사항 구현 관련하여 돌아다니다보니 객체를 두개 넘기는듯한 글을 발견했다.

 

 

[스프링] 공지사항 구현

설명에 앞서, 이번 게시판 프로젝트는 여러 개의 테이블로 카테고리를 나누지 않고, 한 개의 테이블에 bgno라는 number 컬럼으로 카테고리를 나누었다, 게시글목록 쿼리에 where bgno = #{bgno} 를 추가

kimfk567.tistory.com

 

위 포스팅의 경우 게시판에서 카테고리에 따라 일반글과 공지사항으로 나누어지는데, 공지사항을 2개만 올릴수 있도록 조건을 걸어서 서비스함수를 만든것으로 보인다. 공지사항테이블에서 따로 가져와서 공지 두개를 위로 붙이고, html에서 for-each를 공지/일반으로 두개를 돌린다는 것.

 

우리테이블도 공지사항에 importance 속성이 중요/일반으로 나누어져 있기 때문에 객체를 두개 넘겨도 큰 문젠 없겠다는 생각을 했다. 다만 지금은 서비스 함수 하나로 속성값만 바꿔서 객체를 두개 넘기지만, 나중엔 [중요]용 쿼리문을 따로 만들어서 2~3개만 출력되도록 출력 조건을 걸어야 할 것 같다. (혹은 관리자페이지에서 중요 설정시 2개만 되도록 조건을 걸거나?)

 

보통은 뷰로 만들어서 리스트를 만든다지만, 이렇게 쪼개서 넘겼을때의 장점은, 관리자페이지에서 공개/비공개나 중요/일반 이렇게 쿼리문 업데이트만 해줘도 큰 오류없이 셀렉이 나누어져서 돌아간다는 것. 유지보수할때도 나눠져있으니까 rownum붙이는것보다 쿼리문도 단순하고 오히려 편할것같은데... 일단은 이렇게 해 두고 차차 고민을 해봐야겠다.

 

-- 조건
select * from notice where importance=1 and published=1 order by reg_date desc;
select * from notice where importance=0 and published=1 order by reg_date desc;

--mapper.xml
<select id="findAll" resultType="Notice">
    select * from notice where importance=#{i} and published=1 order by reg_date desc -- published는 공개글만 나오도록 상수로 설정
</select>

위에서 나온 10월 업데이트 게시글은 published=0으로 출력이 안되고 있음!