본문 바로가기

✨ Back-end173

[Spring] 쇼핑몰 - 11 회원가입시 다음 API로 주소 넣기 https://postcode.map.daum.net/guide#usage Daum 우편번호 서비스 우편번호 검색과 도로명 주소 입력 기능을 너무 간단하게 적용할 수 있는 방법. Daum 우편번호 서비스를 이용해보세요. 어느 사이트에서나 무료로 제약없이 사용 가능하답니다. postcode.map.daum.net 위 주소로 들어가게 되면 API를 사용할 수 있는 코드들을 확인해볼 수 있다. 위 첫번째 줄에 있는 script 태그를 복사해서 html에 붙여넣기 해준다. admin_layout.html 과 user_layout.html 복사 위치는 내용에 나오는 js보다 위에 해주면 된다. 이후 위 스크립트 안에 있는 코드 내용들을 복사해서 js파일에 붙여넣어주면 되는데, header.js 이렇게 함수를 생성.. 2023. 3. 28.
[Spring] 쇼핑몰 - 10 회원가입시 전화번호 배열, ID 중복검사 join 할때, id 중복체크 검사하기. header.html memberVO에 있는 java로 생성된 변수에서 전화번호는 memTell이다. 하지만, 여기서 배열로 줄 것이기 때문에 memTells로 name속성을 주자. header.html DB에서 MEMBER 테이블을 하나 생성해준다. MemberVO 이곳에서 새롭게 배열 변수 memTells를 하나 만든다. member-mapper.xml 회원가입 쿼리에서 memberVO에서 새롭게 만들어준 memTells를 사용했다. 하지만 이것을 배열 형태로 바꿔줄 것이다. MEM_TELL 부분에 #{memTells} 값으로 바꿔주고, foreach문으로 돌려준다. open은 foreach문이 실행될때 최초에 한번만 할 거, separator는 foreach.. 2023. 3. 28.
[Spring] 쇼핑몰 - 9 부트스트랩 문법 hide.bs.modal 적용 Bootstrap은 모달이 켜지거나 꺼질때 자동으로 값이 ' ' 이 되도록 해주는 기본적인 기능이 있다. header에 login 모달 창을보면 아이디와 비밀번호 input 박스에 값을 넣고 끄고 다시 들어와도 똑같이 채워져있다. BootStrap hide.bs.modal이란, 인스턴스 숨기기 메서드가 호출되면 즉시 시작되는 이벤트이다. 위 함수를 한번 해보기 위해 header의 자바스크립트를 하나 만들어주자. html에서 loginModal 이라는 id 값에 담긴 데이터를 js로 가지고 온 뒤 loginModal 이라고 저장한다. 어떤 데이터를 가지고 올지는 아래 html에서 확인해보자. header.html form태그에 id를 만들자. user_layout이 열리면 어차피 header도 함께 열리니.. 2023. 3. 28.
[Spring] 쇼핑몰 - 8 BootStrap으로 로그인과 회원가입 폼 만들기 LOGIN 부트스트랩에서 Modal을 찾아 Static backdrop으로 찾아간 후 코드를 저장한다. header.html header.html에서 작업할 것이기 때문에 복사 붙여넣기를 해준 후 data-bs-toggle~~ 머시기 빨간 박스를 복사한다. 그리고 id 값을 loginModal로 바꿔준다. 헤더 부분에 있는 LOGIN에 와서 span 태그로 감싸 복사 붙여넣기를 한 후 , 아이디를 설정해주면 된다. 이렇게 LGOIN을 눌러주면 부트스트랩에서 끄집어온 디자인이 잘 된다. 계속해서 header에서 LOGIN 페이지를 제대로 바꿔보자. 위처럼 일단 디자인만 손봐보았다. LOGIN을 눌렀을떄 폼 모달 화면. 다음에 데이터를 넣어 가입을 완료해보자. JOIN 똑같이 이것을 복사하여 body 태그에.. 2023. 3. 28.
[Spring] 쇼핑몰 - 7 관리자 사용 여부에 따른 사용자 화면 리스트 관리자가 사용여부 (IS_USE)에 Y 준것만 상품 리스트에 조회시켜보는 기능을 해보았다. user_layout.html 먼저, user_layout.html로 들어와 admin_layout.html에 있는 파일을 모두 복사한후, side는 필요없으니까 적절하게 지워준 후 헤더부분과 내용부분을 연동시킨다. item_list.html 여기는 item_list.html인데, 관리자 모드에서 콘텐츠 부분에 나올 부분이므로 지금은 비워두었다. item 기능 부분을 본격적으로 만들어 볼것이다. controller와 Service, mapper들을 활용해야 하므로 없으면 만들어주자. item-mapper.xml 매퍼에서 이렇게 쿼리를 짜주면 된다. namespace는 이전에 이미 만들어져있던것이다. ItemServ.. 2023. 3. 28.
[Spring] 쇼핑몰 -6 삭제 (Delete) cate_manage.html html에서 삭제버튼을 추가하고, 삭제버튼을 눌렀을때 th:onclick="|location.href='@{/admin/deleteCategory(cateCode=${category.cateCode})}';|" 와 같이 경로로 cateCode 데이터를 가지고 컨트롤러로 가준다. AdminController 컨트롤러 이번엔 컨트롤러에서 Ajax로 다시 넘겨주면서 삭제하는 기능을 하지 않았다. admin-mapper AdminService 인터페이스 매개변수 및 리턴 타입 결정 방법(우선적으로 실행 시 쿼리를 작성) 매개변수 : 쿼리 실행 시 빈 값을 채울 용도 1. 쿼리에서 채워 줄 값이 없을 경우 : 매개변수 없음 2. 채워줄 값이 하나일 경우 2-1) 채워줄 값이 숫자인 .. 2023. 3. 28.
[Spring] 쇼핑몰 - 5 카테고리 사용여부 체크 위에 사진에있는 사용여부를 radio 박스로 바꿔보려고 한다. Radio 박스의 class는 복붙해왔다. 하지만 이렇게 복붙만 해와도 적용이 잘 안됄수도 있다. 이렇게 사용자가 편한대로 바꿔줄 수 있다. 카테고리가 존재할때, th:each를 통해 cateList에 저장된 데이터 VO들을 category 이름으로 뽑아줄 수 있다. 이렇게 바꿔도 불과하고, 아래와 같이 orderNum이 2인 악세사리는 사용중에 체크가 되어있다. is_use가 N이지만, 순번 2인 악세사리에는 사용중으로 checked되어있다. 코드를 이런식으로 바꿔주면 잘 뜰 것이다. th:onchange를 사용해서 js 함수를 만들어준다. 이때 js로 보낼 cateCode를 데이터값으로 받아온다. cate_manage.js url로 컨트롤.. 2023. 3. 27.
[Spring] 쇼핑몰 -4 카테고리 등록 중복체크 왼쪽과 같이 카테고리에 이미 등록된 상품을 같은 이름으로 등록하면 중복이 뜨게끔 기능을 구현하였다. item-mapper.xml 먼저 item-mapper에서 카테고리 중복체크 select 쿼리문을 만들어주었다. 카테고리 이름을 가지고 조회된 개수를 뽑아내는 쿼리문으로, cateName이 같은 것의 개수를 주었다. 이때 resultType으로 int를 주었는데, 뽑아내는 결과값이 count 갯수 이므로 int로 나타내주었다. AdminService 인터페이스 매개변수 및 리턴 타입 결정 방법(우선적으로 실행 시 쿼리를 작성) 매개변수 : 쿼리 실행 시 빈 값을 채울 용도 1. 쿼리에서 채워 줄 값이 없을 경우 : 매개변수 없음 2. 채워줄 값이 하나일 경우 2-1) 채워줄 값이 숫자인 경우 : 매개변수 .. 2023. 3. 27.
[Spring] 쇼핑몰 -3 카테고리 등록 (INSERT) 먼저, Bootstrap으로 가서 이쁜 등록버튼을 복사해오자. cate_manage.html Confirmidentity 위 코드를 빨간 박스에 복사 붙여넣기 해준다. 그럼 위와 같이 이쁘게 잘 나타나있는 것을 확인할 수 있다. 조금 부족하니 + 아이콘도 한번 추가해보자. Icons에 들어가 해당 아이콘 이미지를 복사해온다. col-8과 col-4로 나뉘어져있다고, 12등분중 4만큼의 공간을 차지 하지않는다. 일단 위와 같이 조금 더 세련된 형태로 Bootstrap을 적용하는데 완성하였다. 여기보면 class에 d-grid라는 코드가 있다. 이것을 이용하면 가로줄 전체에 꽉차게끔 만들어주는 기능이다. 그래서 위와 같이 d-grid를 추가해주었다. 보다시피 아주 깔끔한 카테고리 등록 버튼이 만들어진 것을 .. 2023. 3. 26.
[Spring] 쇼핑몰 -2 카테고리 조회 (SELECT) 상품 카테고리 테이블을 만들고 조회 시켜보자. item-mapper.xml admin-mapper.xml AdminService 인터페이스 매개변수 및 리턴 타입 결정 방법(우선적으로 실행 시 쿼리를 작성) 매개변수 : 쿼리 실행 시 빈 값을 채울 용도 1. 쿼리에서 채워 줄 값이 없을 경우 : 매개변수 없음 2. 채워줄 값이 하나일 경우 2-1) 채워줄 값이 숫자인 경우 : 매개변수 int형 하나 2-2) 채워줄 값이 문자인 경우 : 매개변수 String형 하나 3. 채워줄 값이 여러개인 경우 : 매개변수는 VO 객체. 리턴타입 : 쿼리 실행 결과를 어떻게 받아올지에 대한 정의 INSERT, UPDATE, DELETE 쿼리 실행 결과는 리턴타입을 int 혹은 void 사용하면됨. int로 받을 땐 re.. 2023. 3. 26.
[Spring] 쇼핑몰 - 1 BootStrap으로 레이아웃 구성 프로젝트 생성하자. 일단 기본적으로 늘 사용해왔던 6개 항목을 체크하여 만 프로젝트를 생성해주었다. 프로젝트 생성후 셋팅하고 가져와 줄것들 1 application.properties 파일에 이전에 사용했던 것들을 가지고온 후 username을 이번 DB에 저장한 이름으로 바꿔준다. 2 mappers와 log4jdbc.log4j2.propertis 파일, logback.xml 파일을 복사해서 가지고와준다. 이후 mapper에 있는 xml 파일을 비워준다. 3 implementation 'nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect' // fragment 사용하기 위해 추가 implementation 'org.bgee.log4jdbc-log4j2:log4jdbc-.. 2023. 3. 26.
[Spring] 보드게시판 만들기(10) 비밀글 여부 표시하기 ****** 보호되어 있는 글 입니다. 2023. 3. 26.

티스토리툴바