회원가입 form 왼쪽이 실제 네이버의 회원가입 form이고 오른쪽이 클론코딩으로 만든 회원가입 form 필요한 부분만 사용을했고 필요 없는 부분은 제외 memberSave.jsp 아이디 @naver.com 비밀번호 비밀번호 재확인 이름 생년월일 월 1 2 3 4 5 6 7 8 9 10 11 12 성별 성별 남자 여자 선택 안함 가입하기 엄청 길지만 막상 뜯어보면 css가 절반 이상입니다 특이점은 사용자가에 생년월일을 입력받을 때 input , select , input을 사용했다는 점입니다 년 , 월 , 일 을 따로 입력받고 Controller에서 하나로 합쳐 DB로 넘겨줍니다 memberSave.jsp - script Controller Ajax에서 넘겨받은 값을 DB로보내 유효성 체크를 진행하는 P..
로그인 Form 왼쪽이 실제 네이버 로그인 form이고 오른쪽이 클론코딩을 진행하며 뜯어 만든 로그인 form입니다 솔직히 외관은 비슷하게 할 필요는 없지만 보기 좋은 떡이 먹기에도 좋다고 만들면서 눈요기좀 했습니다 memberLogin.jsp 로그인을 시도했지만 email/pass가 불일치하거나 없는 email로 로그인하는 경우 ${loginFalse} 회원가입 로그인 막상 뜯어보면 크게 특별한 기능은 없습니다 css때문에 엄청 길어졌습니다 memberLoging.jsp - script 아이디와 비밀번호가 있는지에 대한 판단은 서버에 넘어가서 확인을 해야하기 때문에 jsp에서는 최소한의 value 체크만 진행했습니다 MemberController - 생성자 주입 사용 @GetMapping("/membe..
주요 기능 - 로그인 - 회원가입 - 검색 - 페이징 - 게시글 작성 - 답글 작성 - 채택 - 댓글 기획 의도 네이버 지식인 클론 코딩으로 개인 프로젝트를 진행하게 된 이유는 아직 페이징 부분에 미숙한점이 많이 있기 때문에 따로 정보를 알아보던 중 지식인 페이지가 정말 페이징 공부에 도움이 많이 된다는 글을 읽고 시작하게 되었습니다 프로젝트 설계 총 2주간의 프로젝트 기간중 1일차에서는 프로젝트 설계를 진행하고 마무리했습니다
완성본 git GitHub - guguping/member_board: ICIA - DAY 54 ~ ING ICIA - DAY 54 ~ ING. Contribute to guguping/member_board development by creating an account on GitHub. github.com 다쓰기에는 너무 많기 때문에 완성본 git을 올림 페이징 , 검색 , 페이징 , 검색 , 페이징 ,검색 등 모르는 부분은 git을 참고 사진 프리뷰 - (다중) , 파일 이름 가져오기 - (다중) boardSave.jsp 이미지 등록 전날 회원가입에 사용한 이미지파일 미리보기 와 다른점이 있다면 전날 회원가입에 사용된 file 타입의 input으로는 하나의 파일만 받았다면 이번에는 게시판에 사용되는..
완성본 git GitHub - guguping/member_board: ICIA - DAY 54 ~ ING ICIA - DAY 54 ~ ING. Contribute to guguping/member_board development by creating an account on GitHub. github.com 회원가입 - 업로드 사진 미리보기 / 프리뷰 save는 지금까지 배운 내용을 사용하였기 때문에 따로 추가되는 부분이 없습니다 하지만 사진을 업로드하는 과정에서 사용자가 사진을 올렸을 때 이미지를 보여주기 위한 프리뷰를 추가하였습니다 memberSave.jsp 증명사진 label을 사용하여 text를 클릭해도 input file이 실행됨 등록 일반 input file은 이미지가 이쁘지 않고 Chrom..
로그인 게시판 만들어보기 그동안 배운 내용으로 3일동안 조건에 맞는 로그인 게시판 만들어보기 틀만들기 시작 index입니다 include - header MemberBoard include - nav 회원가입 로그인 글목록 include - footer memberSave.jsp - 틀만들기 (기능 x ) 만들면서 찾아보고 배운부분 input type file을 하면 브라우저에따라 기본 이미지가 다르기 때문에 이쁘지가 않고 특히 크롬으로 볼경우 파일이 없음 text가 붙어나와 거슬린다 이부분을 제거하고 파일이 업로드 되었을때 파일명만 따로 출력하기 위해 replace를 사용했다 replace를 사용하여 /c:\\fakepath\\/i 대소문자를 포함하여 앞에 붙는 파일의 경로를 , " " 로 변환하였다 ..
Search 기능 만들어보기 + 결과 페이징 어제 만들어본 페이징 기능을 활용하여 검색 기능을 추가했습니다 페이지당 보여지는 최대게시글 갯수 , 하단페이징의 갯수까지 동일하게 맞췄습니다 검색 결과가 페이지당 최대 글갯수인 9보다 작아진다면 [이전] , [다음] 기능을 비활성화 합니다 Search + Paging - Controller 서치의 페이징을 쉽게하기 위하여 전날에 사용했던 Controller의 Paging 메소드를 수정하여 사용했습니다 // pagin Mapping과 search Mapping을 합친것 @GetMapping("/paging") public String paging(@RequestParam(value = "page", required = false, defaultValue = "1..
Paging 기능 만들어보기 사진과 같이 한페이지에 9개의 게시글이 출력되고, 하단의 페이지번호는 1~3 ,4~6 이런식으로 3개씩 끊어서 출력했습니다 1아래는 더 이상 [이전] 으로 돌아갈 수 없기 때문에 회색으로 돌아갈 수 있는 페이지가 있다면 다시 검은색으로 활성화 됩니다 [다음] 부분도 마찬가지로 마지막 페이지에서는 비활성화 됩니다 Paging.jsp boardPagingList 글번호 제목 작성자 작성시간 조회수 ${board.id} ${board.boardTitle} ${board.boardWriter} ${board.boardHits} 여기까지는 게시글을 롬북의 C태그를 사용해 게시글을 출력했습니다 잘 모르겠다면 List 게시글을 참고해주세요 [이전] 현재 페이지가 1페이지면 [이전] 글자만..
