728x90 SMALL Project28 2-1. 로그인(jsp를 활용한 간단 로그인) 로그인버튼을 누르면 로그인창으로 이동한다 로그인이 성공했을 때는 로그인버튼이 로그아웃으로 바뀌며 회원가입부분은 마이룸으로 바뀐다 로그아웃할 때는 이렇게 확인창이 뜨고 확인을 누르면 로그아웃이 된다 loginfo.jsp form_log라는 form을 만들고 method는 post mid와 pwd라는 input박스를 만들어서 name값을 각각 주었다 로그인 버튼타입은 submit으로 써서 form을 넘기게끔 해줬다 login.js loginOut이라는 객체를 만들어주고 id가 btnLogin인 것을 btnLogin으로 선언 btnLogin을 눌렀을 때 form_log값을 가져오고 login.jsp로 넘어가도록 action설정 마지막으로 submit var logInOut = function(){ var bt.. 2021. 1. 30. 1-5. 공지 팝업창(레이어팝업 홈페이지에 띄우기, 오늘하루그만보기 쿠키 설정) 위와 같은 공지 팝업창을 만들어보겠다 - 메인들어갔을 때 가장 먼저 떠야함 - 인터넷창이 안뜨는 깔끔한 레이어팝업 - 팝업이 떴을 때는 메인홈페이지의 화면을 약간 어둡게 - 오늘하루보지않기를 누르면 새로고침을 해도 안 뜨게 필요한 파일은 두개가 되겠다 먼저 팝업을 띄울페이지, 그리고 팝업내용페이지 일단 나는 메인에 공지팝업을 띄울거라서 메인페이지에 이렇게 include해준다 아래 코드대로라면 popup폴더안의 popup.jsp가 실행이 되겠지? 팝업창의 content 다 FineApple 공지사항   오늘 하루동안 보지 않기 닫기 스타일은 아래와 같다 정리가 귀찮아서 막했네.... 쿠키를 설정하고 창을 닫는 script 쿠키설정하는데 제일 애먹었다 처음에는 그냥 닫기만 해놔야지~ 했는데 자.. 2021. 1. 15. 1-4. 상품 정렬 (ajax를 활용하여 최신순, 낮은가격순, 높은가격순으로 정렬) 상품정렬은 최신순, 낮은가격순, 높은 가격 순으로 하였다 아쉬운점은 카테고리별로 구분하지는 못했다는 점 상품을 정렬하는 부분은 구글에 찾아봐도 잘 없길래(내가 못 찾는것일 수도..ㅠ_ㅠ) 그냥 쿼리문을 사용하여 주먹구구식으로 구현하였다. 분명 메소드하나만 써서 재사용이 가능할텐데 시간이 없기도 하였고 .. ㅋㅋㅋㅋ index.jsp 상품정렬하는 div javascript를 사용해 클릭하면 함수호출 가능하도록 ` `를 사용하여 공백을 표시해주었다 최신순   |    낮은가격   |    높은가격 pricelistdesc누르면 ajax를 사용하여 넘어가게끔 url은 PricelistDesc(서블릿) product_l.. 2021. 1. 15. 1-3 상품 검색 헤더에 배치하여 어디에서든 상품을 검색할 수 있도록 하였다 검색을 하면 검색페이지로 이동한다 상품명으로 검색이 가능하고 검색된 상품 갯수도 불러온다 검색한 상품이 DB에 없을 경우 '검색 결과 없음'으로 뜨게끔 하였다 검색창 검색했을 때 검색단어가 그대로 남아있게 search 스크립틀릿(서블릿을 써도 됨) findStr이 null이 아닐 때 request.getParameter에서 가져옴 dao의 select메소드의 매개변수로 넣어줌 dao.select의 반환값이 List기 때문에 List타입으로 list객체안에 값을 넣어줌 그 값을 request의 setAttrivute을 써서 list에 저장함 dao에서 select public List select(String findStr) { List list .. 2021. 1. 15. 1-2.상품진열 (서블릿과 ajax를 사용해 메인에 상품진열하기) 홈페이지를 클릭하면 바로 상품을 볼 수 있게 메인에 상품배치 Ajax를 활용하여 페이지전체새로고침없이 상품부분만 새로고침되도록 상품에 마우스를 댔을 때 희미해지며 더알아보기뜨도록 index.jsp 상품카테고리부분 각각의 카테고리를 만들었고 클릭하면 javascript를 호출하는 것으로 상품목록 상품목록은 div만 만들어놓고 그 안에 채워넣는 것으로 id : product_list 휴대폰 노트북 태블릿PC 스마트워치 악세서리 Indexproduct.js Ajax를 활용 url은 productList.do로 넘기기(서블릿) type은 POST이지만 사실 GET이어도 작동은 한다 각각 눌렀을 때 `desc`를 이미 지정을 해준다 가져온 값은 product_list라는 id값의 html로 보낸다 var phon.. 2021. 1. 15. 1-1. 헤더 로그인 전, 회원가입과 로그인이 뜨도록 로그인 후, 마이룸과 로그아웃이 뜨도록 관리자 로그인 후, 관리자페이지와 로그아웃 뜨도록 메뉴 드롭다운 시 서브메뉴 나오도록 헤더는 픽스가 가능하도록 설정 스크롤을 내려도 헤더는 고정되어있다 왼쪽 검색창 헤더에 검색창을 두어 메인이 아닌 어느 곳에서도 검색을 가능하게 하도록함 따로 검색한 상품이 나오도록 검색페이지를 따로 만듬 검색 나중엔 정말 이렇게 안할거야.. 검색페이지를 굳이 안 만들고 싶었으나.... 이게 낫겠다 싶어서 결국 만듬 흑흑... 로고 이미지 얘는 절대경로 경로가 깨질 때는 절대경로를 써주는게 제일 안전 사실 이 로고이미지를 정 가운데에 해주는게 너무 시간이 오래걸렸다 ㅠㅠㅠ 텍스트로 하려다가 내가 만든 이 로고를 도저히 버릴 수 없어서 어찌저찌 .. 2021. 1. 15. 1. 메인페이지(이미지슬라이드, 메인문구 슬라이드) 메인페이지 헤더: 검색, 로고, 메뉴에 댔을 때 서브메뉴 드롭다운 메인이미지 슬라이드 메인문구 슬라이드 카테고리별 Ajax로 상품진열, 상품정렬 푸터: 사이트맵 채팅API로 바로 문의 가능 메인부분은 눈물나도록 css에 공을 들인 페이지다 뿐만아니라 공지팝업, Ajax, 서블릿, 채팅API등 많은 기능이 들어간 페이지다 푸터와 상품상세페이지로 연결하는 부분은 각 역할을 맡은 팀원이 하였고 나머지는 내가 구현한 부분이다 index.jsp FineApple makes / Innovation 휴대폰 노트북 태블릿PC 스마트워치 악세서리 Total :  12 최신순   |    낮은가격   |    높은가.. 2021. 1. 15. Prologue 프로젝트 기간 2020.12.01~ 2020.01.12 프로젝트 명 FineApple (전자제품 판매쇼핑몰) 프로젝트 인원 6명 주제 선정 이유 팀원들 대부분이 가장 무난하고도 배운 내용을 복습할 수 있는 프로젝트는 쇼핑몰이라고 생각했다. 쇼핑몰은 무난하지만 기능을 얼마나 추가하냐에 따라서 난이도가 높아질 수도 있기때문에 최소기능 구현 후에는 추가작업을 하려고 했다 차별성 가독성과 접근성 쇼핑몰에서 상품의 질과 가격도 중요하지만 접근성과 가독성도 무척 중요하다. 따라서 직관적이고 심플한 UI/UX를 구축하였고 다양한 기능들을 추가했다. 헤더에 상품 검색 기능, 사이트 맵, 메뉴 드롭다운 시 서브메뉴, 게시판 마다 있는 바로가기키 커뮤니케이션 고객과의 소통을 중요시하며 단방향이 아닌 양방향성의 의사소통을 .. 2021. 1. 15. 이전 1 2 3 다음 728x90 LIST
