728x90 SMALL Project/Semi21 세미프로젝트 기능구현 종합 2. 기능 구현 2.1.1 메인페이지 헤더: 검색, 로고, 메뉴에 댔을 때 서브메뉴 드롭다운 메인이미지 슬라이드 메인문구 슬라이드 카테고리별 Ajax로 상품진열, 상품정렬 푸터: 사이트맵 다른 팀원이 하신 부분이다 채팅API로 바로 문의 가능 2.1.2. 헤더 로그인 전, 회원가입과 로그인이 뜨도록 로그인 후, 마이룸과 로그아웃이 뜨도록 관리자 로그인 후, 관리자페이지와 로그아웃 뜨도록 메뉴 드롭다운 시 서브메뉴 나오도록 헤더는 픽스가 가능하도록 설정 스크롤을 내려도 헤더는 고정되어있다 2.1.3. 상품 진열 홈페이지를 클릭하면 바로 상품을 볼 수 있게 메인에 상품배치 Ajax를 활용하여 페이지전체새로고침없이 상품부분만 새로고침되도록 상품에 마우스를 댔을 때 희미해지며 더알아보기뜨도록 2.1.4. 상품 .. 2021. 4. 15. 6. Epilogue(TMI, TMT) 이로써 티스토리와 깃에 모두 정리를 마쳤다... 자세히 설명하려면 끝이 없을 것 같아서 최대한 간단하지만 이해하기 쉽게 적었다 티스토리는 기능별로 묶었고 코드에 대한 설명을 했으며 깃허브에는 시연만 간단하게 볼 수 있도록 정리했다 세미에 대해서는 할 말이 너무 많아서 다 써도 되나 싶을 정도이다.... 절대 한 줄로는 못 말해!!!! 구구절절 TMI... 일단 뿌듯하고 자랑스러운 점은 원하는 기능 대부분을 구현했다는 것이다. 사실 나는 빠르게 진행한 덕분에 계획했던 것에서 새로운 기능들을 추가하기도 하였다. 이를 통해 좀 더 다양하고 풍부한 기능을 가진 쇼핑몰이 완성됐다. 하지만 원래 있던 부분을 좀 더 수정하고 보완한다면 좀 더 완성도있는 결과물이 나왔을 것이다. 일단 벌린게 많아서 나중에 주워담느라 .. 2021. 2. 1. 5. 관리자페이지 관리자페이지 회원관리, 상품관리, 매출달력을 확인할 수 있다 공지사항에서 글을 작성할 수 있다 관리자페이지를 안하려다가 뭔가 아쉬워서 마지막 한 이틀인가 남기고 내가 부랴부랴 만들었었다 관리자로 로그인을 하면 관리자탭이 따로 생기고 그 페이지에서 회원, 상품, 매출을 관리할 수 있다 아쉬운 점은 매출달력에서 ajax를 활용해 data를 받아오고싶었는데 시간적여유가 안되서 출력만되도록 만들었다 (상품페이징부분은 팀원이 도와주셨다) admin table은 회원과 분리되게끔 따로 만들었다 로그인/아웃로직은 동일하다 create table admin( admin_id varchar(20), admin_pass varchar(20) ); insert into admin values('admin','0000'); .. 2021. 1. 31. 4. 공지사항 게시판 공지사항게시판의 VIEW화면, 검색화면 등록, 삭제화면 등록할 때는 다양한 서식적용이 가능하도록 에디터API를 사용했다 관리자로 로그인하면 입력버튼이 활성화된다 삭제시에는 다시한번 비밀번호를 입력받아 관리자임을 확인한다 아쉬운점 : 비밀번호암호화를 했어야했다 2021. 1. 31. 3-3 채팅 API (간단한 실시간 채팅API 추천) 메인페이지와 로그인부분에서 채팅으로 넘어갈 수 있다 메인에서는 스크롤을 내려도 채팅이모티콘은 fix되게끔 하였다 로그인부분에서 문제가 있을 시 실시간으로 채팅이 가능하도록 하였다 모바일로 채팅을 하는 듯한 느낌을 주었다 운영자에게 실시간 문의가 가능하다 접속해있는 사용자들끼리도 실시간 다중채팅이 가능하다. 나는 API를 쓸 때 최대한 간단하면서 기능이 좋고 예쁜 것으로 가져온다 그래야 쓰기도 쉽고 간단하니까 ㅎㅎ 당연한 얘기... 채팅 API는 많았지만 복잡한 것들은 가져오지않았다..... 그리고 디자인이 구린것도 패스.... 그래서 발견한 곳은 동글채팅 dongledongle.com/ 동글채팅-무료HTML5 웹채팅솔루션 멀티 디바이스,멀티 브라우저 지원 동글 채팅서비스는 TV,PC,태블릿,스마트폰 등 .. 2021. 1. 31. 3-2 에디터 API (summernote editor 를 사용한 에디터기능구현) 글쓰는 부분은 note.jsp를 include를 하였다 note.jsp summernote editor api를 사용하였다 다른 api도 많았지만 간단하면서도 기능이 좋다고 생각되어 선택했다 2021. 1. 31. 3-1 카카오 결제 API (iamport를 활용한 결제API) kakopay 결제API 구매부분은 다른 팀원의 부분이고 신용카드결제를 구현하셨다 나는 간단하게 결제되는 카카오페이를 구현하고싶어서 따로 해보았다 QR코드와 전화번호로 결제 둘 다 가능하다 먼저 결제 API를 이용하기위해서는 등록을 해야한다 admin.iamport.kr/ 로그인 - 아임포트 관리자 가입하신 Email주소로 비밀번호 변경 링크를 발송합니다. admin.iamport.kr 여기서 가입> 로그인을 먼저하고 가맹점 식별코드 확인 이부분을 몰라서 좀 헤맸다 사진처럼 해주면 된다 iamport script를 꼭 삽입하고 데이터를 불러와 아래 script에 가맹점 식별코드, 정보등을 넣어준다 PG사가 다양하게 많으니 비슷한 방법으로 API를 적용시킬 수 있다 이 API는 개발테스트를 위한 것이고 실.. 2021. 1. 31. 2-5 카카오 로그인 API #2 (jsp, javascript를 사용한 카카오간단로그인) #2 이번엔 코드작성하는 부분이다 스프링이나 서블릿은 굉장히 많은 이동과 전달이 필요하지만 javascript로도 충분히 가능하다 loginfo.jsp 로그인화면 하단에 있는 카카오로그인하기 버튼이다 사이즈는 각자 편한대로 정해준다 정말 중요한 부분..... 이걸 못찾아서 엄청 헤맸다.... API같은 경우는 구글을 뒤지는 것보다 개발자사이트를 뒤져야한다 무조건 있다 특히 API를 쓴다면 script는 어딨지? 이러고 먼저 찾아봐야한다. 중요한부분2222 kakao.init에 본인 앱키를 넣어준다 유효하지않으면 에러가 난다 로그인성공시 api를 호출하는데 url에서 v2/user/me도 내가 바꿔야하는지 알고 헤맸다 하지만 developers.kakao.com/docs/latest/ko/kakaologi.. 2021. 1. 30. 2-5 카카오 로그인 API #1 (jsp, javascript를 사용한 카카오간단로그인) 할말이 아주 많은 카카오로그인부분 정말.. 초기부터 카카오로그인을 하고싶었는데 스프링으로 카카오로그인을 한 사람들은 많았지만 jsp/서블릿을 사용하여 카카오로그인을 사용한 사람들은 거의 찾지를 못했다 ㅠㅠ 어떻게든 하려고 매달리다포기-다른기능구현-다시 카카오로그인매달리다포기-다른기능구현-다시 카카로로그인하다 포기-다른기능구현을 반복하다 세미프로젝트가 끝나기 직전에 가까스로 구현한 ....나의 자랑... ㅠㅠ 하지만 발표할 때 조장의 port넘버와 내 넘버가 달라 보여주지는 못했던 ..... ㅠㅠㅠ 시연전에 알아버려서 수정할 시간이 부족했다 하지만 jsp, javascript로도 간단하게 카카오로그인을 구현할 수 있다는 점!!! 크게 두가지 일을 해야한다 #1. 카카오 개발자페이지에서 애플리케이션추가 #2.. 2021. 1. 30. 2-4 비밀번호찾기 비밀번호찾기를 눌렀을 경우 아이디찾기를 통해 찾은 아이디와 번호로 찾을 수 있다 등록한 정보가 없을 때는 아이디찾기화면과 동일하게 등록된 정보가 없다고 뜨고 등록한 정보가 있을 때는 비밀번호가 뜬다 보안에는 아~주 취약..ㅎ findPw.jsp form태그를 사용하여 아이디와 번호를 받는다 id찾기와 로직은 거의 같다 찾기를 눌렀을 경우 pw_search()호출 등록한 정보로 인증 아이디 번호 findinfo.js pw_search라는 함수생성 아이디값과 핸드폰값을 검사한 후 findPwResult.jsp로 이동하게끔 action과 submit을 준다 function pw_search(){ var frm=document.pwfindscreen; if(frm.member_mid.value.length 2021. 1. 30. 이전 1 2 3 다음 728x90 LIST
