넷플릭스 추천작 구독 서비스입니다. 개발기간 : 2020.07 ~ 개발인원 : 1명 개발환경 : open jdk 1.8, Oracle 11g DB, Javascript, Spring 5.0.7, Bootstrap, Apache Tomcat 8.5, Github, Source Tree, spring security 개발내용 : DB 설계 메인 페이지 - 부트스트랩 사용하여 UI/UX 디자인 설정 변경. - Header부분을 스크롤을 내려도 보이도록 고정시킴. - Header를 jsp파일로 따로 분리시켜 유지보수 효율 높임. - 로그인 성공 시 Header 부분 Spring Security의 authorize access를 이용하여 각각의 권한에 맞는 navigation 표현. 회원가입 페이지 - ajax사용하여 유효성검사를하고 입력받은 비밀번호를 암호화하여 DB에 저장. - CSRF Token을 사용하여 보안성을 높임. - 이메일 인증 방식을 사용하여 javax.mail, SMTP 프로토콜방식, mailSender 이용하여 해당 이메일로 확인 이메일 발송. - DB에 Spring Security에 필요한 Column들은 Default로 저장. 로그인 페이지 - 일반로그인, 카카오API, 네이버API 세가지로 구현. - Spring Security - 일반로그인시 Spring Security 사용하여 보안성 높임. - Max Session을 1로 설정하여 중복 로그인 방지. - properties파일로 로그인 에러 메시지를 alert가 아닌 같은 페이지 안에 표현. - bcryptPasswordEncoder로 비밀번호를 암호화. ID / PW 찾기 페이지 - 구현중

더보기

유아용품 정기 렌탈 서비스 사이트입니다. 개발기간 : 2019.09.02~2020.02.27 개발인원 : 6명 개발환경 : open jdk 1.8, Oracle 11g DB, Javascript, Spring 5.0.7, Bootstrap, Apache Tomcat 8.5, Github, Source Tree 개발내용 : DB 설계 메인 페이지 - 전체 UI/UX 디자인. - Header부분을 스크롤을 내려도 보이도록 고정시키고 아이콘 클릭 시 전체메뉴 나옴. - 로그인시 ‘로그아웃’으로 바뀌고 프로필 사진을 띄워줌. 사진 클릭하면 마이페이지로 이동 - 함수를 사용하여 구독 신청 날자 까지 남은일, 시, 분, 초를 표시. 아이디 찾기 - 아이디/패스워드 Javascript tab사용하여 페이지 이동 없이 각각 해당하는 데이터 전송하여 db값과 비교 - 이름과 핸드폰 번호를 입력받아 데이터베이스에서 확인 후 일치할 경우에는 해당 아이디를 화면에 띄워주고, 일치하지 않을 경우에는 Alert창으로 일치하는 ID가 없음을 알려줌. 비밀번호 찾기 - 입력 받은 아이디, 이름, 핸드폰번호를 데이터베이스에서 확인. - 일치할 시 ServiceImpl단에서 .randomUUID()로 8자리 난수 생성후 db에 변경된 비밀번호로 저장. - 난수로 변경 된 비밀번호를 javax.mail, SMTP 프로토콜, mailSender 이용하여 해당 이메일로 발송. - 정보 불일치 시 alert창. 회원정보 수정 - 데이터 베이스에 저장된 데이터를 불러와 회원정보 수정form에 띄워 줌. - 사진 등록 시 드래그&드랍 기능 구현. - 닉네임 변경 시 - 중복확인 필수, 변경하지 않을 시 중복확인 필요 없음. - 비밀번호 변경 원할 시 - 입력 후 변경하기 버튼 클릭. - Ajax 이용하여 페이지 이동 없이 변경 가능. - 새로운 비밀번호 입력 시 - 유효성 검사 후 변경. - 불만족시 javascript에서 .show()와 .hide()로 비밀번호8자리 이상, 일치여부 보여줌. 파트너 페이지 - Selectbox 이용하여 기존의 파트너사의 정보를 불러와 카테고리 세분화. - 데이터베이스에 저장된 파트너사 목록(파트너사 대표사진)을 ajax로 불러와 hover 기능을 이용하여 회사명 등을 사진 위에 띄워줌. - 파트너 가입신청 버튼 클릭 시 모달 창으로 정보를 받아 관리자가 수락/거절 할 수 있도록 데이터베이스에 저장. Contact Us 페이지 - 카카오맵 API를 이용하여회사 위치 표시. - 큰지도 보기, 길찾기 링크를 통해 카카오맵 연결 및 현재 나의 위치에서 회사까지 가는 길찾기 제공. 관리자 페이지 - dataTable 라이브러리, Ajax, JSON을 이용하여데이터베이스에 저장 된 전체 회원 목록을 띄워줌. - 상세정보 클릭 시 해당 회원에 대한 정보를 모달 창으로 띄워줌. - 검색기능, 한 페이지에 나오는 정보 개수, 페이징 처리는dataTable 라이브러리에서 자동 처리. - Ajax를 이용하여 일반회원이나 비매너회원 클릭 시 페이지 이동 없이 정보 변경 가능. 위 내용들은 첨부해 놓은 포트폴리오 파일에 실제 구현한 페이지와 함께 설명되어 있습니다.

더보기